added text field for title

app/src/main/java/com/sirekanian/spacetime/ui/ImagePageContent.kt

@@ -2,6 +2,7 @@ package com.sirekanian.spacetime.ui
 
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.MaterialTheme
+import androidx.compose.material.OutlinedTextField
 import androidx.compose.material.Slider
 import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
@@ -10,13 +11,14 @@ import androidx.compose.material.icons.filled.Delete
 import androidx.compose.material.icons.filled.Done
 import androidx.compose.material.icons.filled.Edit
 import androidx.compose.runtime.*
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.blur
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.pluralStringResource
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import coil.compose.AsyncImage
 import coil.request.ImageRequest
@@ -32,7 +34,9 @@ fun ImagePageContent(
     onDelete: () -> Unit,
     onDone: (ImagePage) -> Unit,
 ) {
-    var blur by remember { mutableStateOf(page.blur) }
+    var isEditMode by remember { mutableStateOf(false) }
+    var name by remember(isEditMode) { mutableStateOf(page.name) }
+    var blur by remember(isEditMode) { mutableStateOf(page.blur) }
     AsyncImage(
         model = ImageRequest.Builder(LocalContext.current)
             .data(page.url)
@@ -44,7 +48,6 @@ fun ImagePageContent(
             .blur((blur * 32).dp),
         contentScale = ContentScale.Crop,
     )
-    var isEditMode by remember { mutableStateOf(false) }
     DefaultAnimatedVisibility(visible = !isEditMode) {
         Row(Modifier.padding(insets)) {
             Spacer(Modifier.weight(1f))
@@ -63,7 +66,7 @@ fun ImagePageContent(
                 Spacer(Modifier.weight(1f))
                 VectorIconButton(Icons.Default.Delete, onClick = { onDelete() })
                 VectorIconButton(Icons.Default.Done, onClick = {
-                    onDone(ImagePage(page.id, page.name, page.url, page.date, blur))
+                    onDone(ImagePage(page.id, name, page.url, page.date, blur))
                     isEditMode = false
                 })
             }
@@ -71,14 +74,32 @@ fun ImagePageContent(
         }
     }
     Column(
-        modifier = Modifier.fillMaxSize(),
-        horizontalAlignment = Alignment.CenterHorizontally,
+        modifier = Modifier
+            .fillMaxSize()
+            .imePadding()
+            .padding(16.dp),
         verticalArrangement = Arrangement.Center,
     ) {
-        Text(
-            text = page.name,
-            style = MaterialTheme.typography.h2,
-        )
+        val textStyle = MaterialTheme.typography.h2.copy(textAlign = TextAlign.Center)
+        if (isEditMode) {
+            OutlinedTextField(
+                value = name,
+                onValueChange = { name = it },
+                modifier = Modifier.fillMaxWidth(),
+                textStyle = textStyle,
+                maxLines = 2,
+            )
+        } else {
+            Text(
+                text = page.name,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(16.dp),
+                style = textStyle,
+                overflow = TextOverflow.Ellipsis,
+                maxLines = 2,
+            )
+        }
         page.date.getRelativeDays()?.let { days ->
             Text(
                 text = when {
@@ -91,7 +112,10 @@ fun ImagePageContent(
                         pluralStringResource(R.plurals.duration_days, -days, -days)
                     }
                 },
-                style = MaterialTheme.typography.h2,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(16.dp),
+                style = textStyle,
             )
         }
     }

app/src/main/java/com/sirekanian/spacetime/ui/theme/Shape.kt

@@ -5,7 +5,7 @@ import androidx.compose.material.Shapes
 import androidx.compose.ui.unit.dp
 
 val Shapes = Shapes(
-    small = RoundedCornerShape(4.dp),
+    small = RoundedCornerShape(16.dp),
     medium = RoundedCornerShape(4.dp),
     large = RoundedCornerShape(0.dp)
 )