Add UI for EditMode

app/src/main/java/gq/kirmanak/mealient/data/recipes/impl/RecipeRepoImpl.kt

@@ -48,6 +48,7 @@ class RecipeRepoImpl @Inject constructor(
         return runCatchingExceptCancel {
             val recipe = dataSource.requestRecipe(recipeSlug)
             val entity = modelMapper.toRecipeEntity(recipe)
+            val settings = modelMapper.toRecipeSettingsEntity(recipe.settings)
             val ingredients = recipe.ingredients.map {
                 modelMapper.toRecipeIngredientEntity(it, entity.remoteId)
             }
@@ -63,7 +64,7 @@ class RecipeRepoImpl @Inject constructor(
                     )
                 }
             }
-            storage.saveRecipeInfo(entity, ingredients, instructions, ingredientToInstruction)
+            storage.saveRecipeInfo(entity, settings, ingredients, instructions, ingredientToInstruction)
         }.onFailure {
             logger.e(it) { "loadRecipeInfo: can't update full recipe info" }
         }

app/src/main/java/gq/kirmanak/mealient/ui/recipes/info/HeaderSection.kt

@@ -2,10 +2,14 @@ package gq.kirmanak.mealient.ui.recipes.info
 
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.ClickableText
+import androidx.compose.material3.Button
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -19,15 +23,33 @@ import androidx.compose.ui.unit.dp
 import coil.compose.AsyncImage
 import gq.kirmanak.mealient.R
 import gq.kirmanak.mealient.ui.Dimens
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.modifier.modifierLocalConsumer
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.buildAnnotatedString
+import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.text.style.TextAlign
+import gq.kirmanak.mealient.ui.AppTheme
+import gq.kirmanak.mealient.ui.preview.ColorSchemePreview
+import okhttp3.internal.http2.Header
 
 @Composable
 internal fun HeaderSection(
     imageUrl: String?,
-    title: String?,
-    description: String?,
+    title: String,
+    description: String,
+    isEditMode: Boolean,
 ) {
     val imageFallback = painterResource(id = R.drawable.placeholder_recipe)
 
+    var bHeaderExpanded by remember {
+        mutableStateOf(false)
+    }
+
     Column(
         verticalArrangement = Arrangement.spacedBy(Dimens.Small, Alignment.Top),
     ) {
@@ -51,22 +73,79 @@ internal fun HeaderSection(
             contentScale = ContentScale.Crop,
         )
 
-        if (!title.isNullOrEmpty()) {
-            Text(
-                modifier = Modifier
-                    .padding(horizontal = Dimens.Small),
-                text = title,
-                style = MaterialTheme.typography.headlineSmall,
+
+        if (isEditMode) {
+            // ToDo: Only for Testing
+            var titleValue by remember {
+                mutableStateOf(TextFieldValue(title))
+            }
+
+            OutlinedTextField(
+                value = titleValue,
+                onValueChange = { titleValue = it },
+                modifier = Modifier.fillMaxWidth(),
+                label = { Text(text = "title")}
+            )
+            OutlinedTextField(
+                value = description,
+                onValueChange = { /* TODO */ },
+                modifier = Modifier.fillMaxWidth(),
+                label = { Text(text = "description")}
             )
+        } else {
+            if (!title.isNullOrEmpty()) {
+                Text(
+                    modifier = Modifier
+                        .padding(horizontal = Dimens.Small),
+                    text = title,
+                    style = MaterialTheme.typography.headlineSmall,
+                )
+            }
+            if (!description.isNullOrEmpty()) {
+                Text(
+                    modifier = Modifier
+                        .padding(horizontal = Dimens.Small),
+                    text = description,
+                    style = MaterialTheme.typography.bodyLarge,
+                )
+            }
         }
 
-        if (!description.isNullOrEmpty()) {
-            Text(
-                modifier = Modifier
-                    .padding(horizontal = Dimens.Small),
-                text = description,
-                style = MaterialTheme.typography.bodyLarge,
+        val sExpandText =
+            if (bHeaderExpanded) stringResource(id = R.string.hideDetails) else stringResource(id = R.string.showDetails)
+        ClickableText(
+            text = buildAnnotatedString {
+                append(sExpandText)
+            },
+            onClick = { bHeaderExpanded = !bHeaderExpanded },
+            modifier = Modifier
+                .padding(top = 4.dp, start = 4.dp, bottom = 4.dp)
+                .fillMaxWidth(),
+            style = TextStyle(
+                textAlign = TextAlign.Center, color = MaterialTheme.colorScheme.primary
             )
+        )
+
+        if (bHeaderExpanded) {
+            // ToDo: Show categories, tags, settings, required tools and nutrition
+            Button(
+                onClick = { /*TODO*/ },
+            ) {
+                Text(text = "Settings")
+            }
         }
     }
+}
+
+@ColorSchemePreview
+@Composable
+private fun HeaderSectionPreview() {
+    AppTheme {
+        HeaderSection(
+            imageUrl = "",
+            title = "Test Recipe",
+            description = "test Test Test test",
+            isEditMode = true,
+        )
+    }
 }

app/src/main/java/gq/kirmanak/mealient/ui/recipes/info/IngredientsSection.kt

@@ -5,10 +5,17 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ArrowDownward
+import androidx.compose.material.icons.filled.ArrowUpward
 import androidx.compose.material3.Card
 import androidx.compose.material3.Checkbox
 import androidx.compose.material3.Divider
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -18,13 +25,15 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
 import gq.kirmanak.mealient.R
 import gq.kirmanak.mealient.database.recipe.entity.RecipeIngredientEntity
 import gq.kirmanak.mealient.ui.Dimens
 
 @Composable
 internal fun IngredientsSection(
     ingredients: List<RecipeIngredientEntity>,
+    isEditMode: Boolean,
 ) {
     Column(
         verticalArrangement = Arrangement.spacedBy(Dimens.Small, Alignment.Top),
@@ -47,9 +56,14 @@ internal fun IngredientsSection(
                     .padding(Dimens.Small),
                 verticalArrangement = Arrangement.spacedBy(Dimens.Small, Alignment.Top),
             ) {
+                var ingredientsCount = 0
                 ingredients.forEach { item ->
+                    val isLastItem = (ingredientsCount == ingredients.size -1)
                     IngredientListItem(
                         item = item,
+                        index = ingredientsCount++,
+                        isEditMode = isEditMode,
+                        isLastItem = isLastItem,
                     )
                 }
             }
@@ -60,44 +74,88 @@ internal fun IngredientsSection(
 @Composable
 private fun IngredientListItem(
     item: RecipeIngredientEntity,
+    index: Int,
     modifier: Modifier = Modifier,
+    isEditMode: Boolean,
+    isLastItem: Boolean,
 ) {
-    var isChecked by rememberSaveable { mutableStateOf(false) }
+    val title = item.title ?: ""
 
-    val title = item.title
-    if (!title.isNullOrBlank()) {
-        Text(
-            modifier = modifier
-                .padding(horizontal = Dimens.Medium),
-            text = title,
-            style = MaterialTheme.typography.titleMedium,
-        )
-
-        Divider()
+    if (isEditMode) {
+        Row {
+            OutlinedTextField(
+                value = title,
+                label = { Text(text = "title") },
+                onValueChange = { /*ToDo*/ }
+            )
+            if (!isLastItem) {
+                IconButton(
+                    onClick = { /*TODO*/ },
+                    modifier = Modifier.padding(4.dp).size(64.dp)
+                ) {
+                    Icon(Icons.Default.ArrowDownward, contentDescription = "Save")
+                }
+            }
+            if (index > 0) {
+                IconButton(
+                    onClick = { /*TODO*/ },
+                    modifier = Modifier.padding(4.dp).size(64.dp)
+                ) {
+                    Icon(Icons.Default.ArrowUpward, contentDescription = "Save")
+                }
+            }
+        }
+        if (item.disableAmount) {
+            OutlinedTextField(
+                value = item.display,
+                label = { Text(text = "ingredient")},
+                onValueChange = { /*ToDo*/ } )
+        }
+        else {
+            OutlinedTextField(
+                value = item.note,
+                label = { Text(text = "ingredient")},
+                onValueChange = { /*ToDo*/ } )
+        }
     }
+    else {
 
-    Row(
-        modifier = modifier,
-        horizontalArrangement = Arrangement.spacedBy(Dimens.Small, Alignment.Start),
-        verticalAlignment = Alignment.CenterVertically,
-    ) {
-        Checkbox(
-            checked = isChecked,
-            onCheckedChange = { isChecked = it },
-        )
+        var isChecked by rememberSaveable { mutableStateOf(false) }
 
-        val (text, note) = item.textAndNote
-        Column {
+        if (!title.isNullOrBlank()) {
             Text(
-                text = text,
-                style = MaterialTheme.typography.bodyLarge,
+                modifier = modifier
+                    .padding(horizontal = Dimens.Medium),
+                text = title,
+                style = MaterialTheme.typography.titleMedium,
+            )
+
+            Divider()
+        }
+
+        Row(
+            modifier = modifier,
+            horizontalArrangement = Arrangement.spacedBy(Dimens.Small, Alignment.Start),
+            verticalAlignment = Alignment.CenterVertically,
+        ) {
+            Checkbox(
+                checked = isChecked,
+                onCheckedChange = { isChecked = it },
             )
 
-            if (note.isNotBlank()) {
+            val (text, note) = item.textAndNote
+            Column {
                 Text(
-                    text = item.note,
-                    style = MaterialTheme.typography.bodyMedium,
+                    text = text,
+                    style = MaterialTheme.typography.bodyLarge,
                 )
+
+                if (note.isNotBlank()) {
+                    Text(
+                        text = item.note,
+                        style = MaterialTheme.typography.bodyMedium,
+                    )
+                }
             }
         }
     }