Added create key button

app/src/main/java/org/sirekanyan/outline/MainActivity.kt

@@ -21,13 +21,13 @@ class MainActivity : ComponentActivity() {
         WindowCompat.setDecorFitsSystemWindows(window, false)
         setContent {
             val api = remember { OutlineApi() }
-            val state = remember { MainState() }
+            val state = rememberMainState()
             val accessKeys by produceState(listOf<AccessKey>(), state.selected) {
                 value = state.selected?.let { api.getAccessKeys(it) } ?: listOf()
             }
             OutlineTheme {
                 Surface(Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background) {
-                    MainContent(state, accessKeys)
+                    MainContent(api, state, accessKeys)
                 }
             }
         }

app/src/main/java/org/sirekanyan/outline/MainContent.kt

@@ -6,12 +6,15 @@ import androidx.compose.foundation.layout.systemBars
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material3.ModalNavigationDrawer
 import androidx.compose.runtime.Composable
+import kotlinx.coroutines.launch
+import org.sirekanyan.outline.api.OutlineApi
 import org.sirekanyan.outline.api.model.AccessKey
+import org.sirekanyan.outline.ui.AddKeyButton
 import org.sirekanyan.outline.ui.DrawerContent
 import org.sirekanyan.outline.ui.KeyContent
 
 @Composable
-fun MainContent(state: MainState, keys: List<AccessKey>) {
+fun MainContent(api: OutlineApi, state: MainState, keys: List<AccessKey>) {
     ModalNavigationDrawer(drawerContent = { DrawerContent(state) }, drawerState = state.drawer) {
         LazyColumn(contentPadding = WindowInsets.systemBars.asPaddingValues()) {
             keys.forEach { key ->
@@ -20,5 +23,15 @@ fun MainContent(state: MainState, keys: List<AccessKey>) {
                 }
             }
         }
+        AddKeyButton(
+            visible = state.selected != null,
+            onClick = {
+                state.selected?.let {
+                    state.scope.launch {
+                        api.createAccessKey(it)
+                    }
+                }
+            },
+        )
     }
-}
+}

app/src/main/java/org/sirekanyan/outline/MainState.kt

@@ -2,11 +2,28 @@ package org.sirekanyan.outline
 
 import androidx.compose.material3.DrawerState
 import androidx.compose.material3.DrawerValue
+import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.launch
+
+@Composable
+fun rememberMainState(): MainState {
+    val scope = rememberCoroutineScope()
+    return remember { MainState(scope) }
+}
+
+class MainState(val scope: CoroutineScope) {
 
-class MainState {
     val drawer = DrawerState(DrawerValue.Closed)
     var selected by mutableStateOf<Int?>(null)
+
+    fun closeDrawer() {
+        scope.launch { drawer.close() }
+    }
+
 }

app/src/main/java/org/sirekanyan/outline/api/OutlineApi.kt

@@ -5,6 +5,7 @@ import io.ktor.client.call.body
 import io.ktor.client.engine.cio.CIO
 import io.ktor.client.plugins.contentnegotiation.ContentNegotiation
 import io.ktor.client.request.get
+import io.ktor.client.request.post
 import io.ktor.serialization.kotlinx.json.json
 import kotlinx.serialization.json.Json
 import org.sirekanyan.outline.api.model.AccessKey
@@ -28,4 +29,9 @@ class OutlineApi {
         return httpClient.get("$apiUrl/access-keys").body<AccessKeysResponse>().accessKeys
     }
 
+    suspend fun createAccessKey(index: Int) {
+        val (_, apiUrl) = API_URLS.getOrNull(index) ?: return
+        httpClient.post("$apiUrl/access-keys")
+    }
+
 }

app/src/main/java/org/sirekanyan/outline/ui/AddKeyButton.kt

@@ -0,0 +1,39 @@
+package org.sirekanyan.outline.ui
+
+import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
+import androidx.compose.animation.slideInVertically
+import androidx.compose.animation.slideOutVertically
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.navigationBarsPadding
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.outlined.Add
+import androidx.compose.material3.ExtendedFloatingActionButton
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun AddKeyButton(visible: Boolean, onClick: () -> Unit) {
+    Box(Modifier.fillMaxSize().navigationBarsPadding(), Alignment.BottomEnd) {
+        AnimatedVisibility(
+            visible = visible,
+            enter = fadeIn() + slideInVertically { it / 2 },
+            exit = fadeOut() + slideOutVertically { it / 2 },
+        ) {
+            ExtendedFloatingActionButton(onClick, Modifier.padding(16.dp)) {
+                Icon(Icons.Outlined.Add, null)
+                Spacer(Modifier.size(16.dp))
+                Text("Add key")
+            }
+        }
+    }
+}

app/src/main/java/org/sirekanyan/outline/ui/DrawerContent.kt

@@ -4,14 +4,11 @@ import androidx.compose.material3.ModalDrawerSheet
 import androidx.compose.material3.NavigationDrawerItem
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.rememberCoroutineScope
-import kotlinx.coroutines.launch
 import org.sirekanyan.outline.MainState
 import org.sirekanyan.outline.api.API_URLS
 
 @Composable
 fun DrawerContent(state: MainState) {
-    val scope = rememberCoroutineScope()
     ModalDrawerSheet {
         API_URLS.forEachIndexed { index, (name) ->
             val selected = state.selected == index
@@ -20,7 +17,7 @@ fun DrawerContent(state: MainState) {
                 selected = selected,
                 onClick = {
                     state.selected = index
-                    scope.launch { state.drawer.close() }
+                    state.closeDrawer()
                 }
             )
         }