Fix glass style in meal plan editor

This commit is contained in:
2026-06-06 10:28:05 +02:00
parent 11ea98e452
commit ade14e28fc
2 changed files with 64 additions and 67 deletions

View File

@@ -14,7 +14,6 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@@ -37,9 +36,6 @@ import com.composables.core.Scrim
import com.composables.core.Sheet
import com.composables.core.SheetDetent
import com.composables.core.rememberModalBottomSheetState
import dev.ulfrx.recipe.ui.components.glass.GlassBackdropSource
import dev.ulfrx.recipe.ui.components.glass.LocalGlassBackdropState
import dev.ulfrx.recipe.ui.components.glass.rememberGlassBackdropState
import dev.ulfrx.recipe.ui.theme.RecipeTheme
import org.jetbrains.compose.resources.stringResource
import recipe.composeapp.generated.resources.Res
@@ -88,26 +84,13 @@ fun <T : NavKey> RecipeBottomSheet(
@Composable
private fun BottomSheetScope.SheetBody(content: @Composable BoxScope.() -> Unit) {
val backdrop = rememberGlassBackdropState()
val spacing = RecipeTheme.spacing
CompositionLocalProvider(LocalGlassBackdropState provides backdrop) {
Box(
modifier =
Modifier
.fillMaxWidth()
.fillMaxHeight(SHEET_HEIGHT_FRACTION)
.background(RecipeTheme.colors.background),
) {
GlassBackdropSource(state = backdrop, modifier = Modifier.fillMaxSize()) {
Box(modifier = Modifier.fillMaxWidth().fillMaxHeight(SHEET_HEIGHT_FRACTION)) {
Box(modifier = Modifier.fillMaxSize(), content = content)
}
SheetHandle(
modifier = Modifier.align(Alignment.TopCenter).padding(top = spacing.sm),
modifier = Modifier.align(Alignment.TopCenter).padding(top = RecipeTheme.spacing.sm),
)
}
}
}
@Composable

View File

@@ -1,5 +1,6 @@
package dev.ulfrx.recipe.ui.screens.mealplaneditor
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
@@ -8,6 +9,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.text.BasicText
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@@ -17,6 +19,9 @@ import com.composables.icons.lucide.ArrowLeft
import com.composables.icons.lucide.Lucide
import com.composables.icons.lucide.Plus
import dev.ulfrx.recipe.ui.components.glass.CircleGlassButton
import dev.ulfrx.recipe.ui.components.glass.GlassBackdropSource
import dev.ulfrx.recipe.ui.components.glass.LocalGlassBackdropState
import dev.ulfrx.recipe.ui.components.glass.rememberGlassBackdropState
import dev.ulfrx.recipe.ui.theme.RecipeTheme
import org.jetbrains.compose.resources.stringResource
import recipe.composeapp.generated.resources.Res
@@ -30,12 +35,20 @@ internal fun MealPlanEditorScreen(
onBack: () -> Unit,
onConfirm: (PlannedMealUi) -> Unit,
) {
val backdrop = rememberGlassBackdropState()
val state by viewModel.state.collectAsStateWithLifecycle()
val spacing = RecipeTheme.spacing
Box(modifier = Modifier.fillMaxSize()) {
CompositionLocalProvider(LocalGlassBackdropState provides backdrop) {
Box(
modifier =
Modifier
.fillMaxSize()
.background(RecipeTheme.colors.background),
) {
when (val s = state) {
is MealPlanEditorState.Editing -> {
GlassBackdropSource(state = backdrop, modifier = Modifier.fillMaxSize()) {
MealPlanEditorContent(
editing = s,
catalog = sampleAddableIngredients,
@@ -51,6 +64,7 @@ internal fun MealPlanEditorScreen(
onRestoreRemoved = viewModel::restoreRemovedIngredients,
onAddIngredient = viewModel::addIngredient,
)
}
EditorChromeRow(
showConfirm = true,
@@ -65,12 +79,11 @@ internal fun MealPlanEditorScreen(
}
MealPlanEditorState.NotFound -> {
Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
BasicText(
text = stringResource(Res.string.meal_plan_editor_not_found),
style = RecipeTheme.typography.body,
modifier = Modifier.align(Alignment.Center),
)
}
EditorChromeRow(
showConfirm = false,
@@ -85,6 +98,7 @@ internal fun MealPlanEditorScreen(
}
}
}
}
}
@Composable