diff --git a/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListDetailScreen.kt b/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListDetailScreen.kt index 7528da1..1028e47 100644 --- a/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListDetailScreen.kt +++ b/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListDetailScreen.kt @@ -1,4 +1,5 @@ @file:Suppress("ktlint:standard:no-wildcard-imports") +@file:OptIn(androidx.compose.foundation.ExperimentalFoundationApi::class) package com.collabtable.app.ui.screens import androidx.compose.foundation.ExperimentalFoundationApi @@ -2536,7 +2537,8 @@ fun ManageColumnsDialog( key = { _, field -> field.id }, ) { index, field -> ReorderableItem(reorderState, key = field.id) { _ -> - ColumnItem( + Box(modifier = Modifier.animateItemPlacement()) { + ColumnItem( field = field, onEdit = { fieldToEdit = field }, onDelete = { fieldToDelete = field }, @@ -2562,7 +2564,8 @@ fun ManageColumnsDialog( tint = MaterialTheme.colorScheme.onSurfaceVariant, ) }, - ) + ) + } } } } @@ -2658,7 +2661,8 @@ fun ColumnItem( dragHandle: (@Composable () -> Unit)? = null, ) { Card( - modifier = Modifier.fillMaxWidth(), + modifier = Modifier + .fillMaxWidth(), colors = CardDefaults.cardColors( containerColor = MaterialTheme.colorScheme.surfaceVariant, diff --git a/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListsScreen.kt b/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListsScreen.kt index 026bf7a..f8f57fd 100644 --- a/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListsScreen.kt +++ b/CollabTableAndroid/app/src/main/java/com/collabtable/app/ui/screens/ListsScreen.kt @@ -1,6 +1,9 @@ +@file:OptIn(androidx.compose.foundation.ExperimentalFoundationApi::class) + package com.collabtable.app.ui.screens import androidx.compose.foundation.clickable +import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column @@ -195,8 +198,9 @@ fun ListsScreen( verticalArrangement = Arrangement.spacedBy(8.dp), ) { itemsIndexed(working, key = { _, it -> it.id }) { index, list -> - ReorderableItem(reorderState, key = list.id) { isDragging -> - ListItem( + ReorderableItem(reorderState, key = list.id) { _ -> + Box(modifier = Modifier.animateItemPlacement()) { + ListItem( list = list, onListClick = { onNavigateToList(list.id) }, onEditClick = { listToEdit = list }, @@ -209,7 +213,8 @@ fun ListsScreen( tint = MaterialTheme.colorScheme.onSurfaceVariant, ) }, - ) + ) + } } } } @@ -283,6 +288,13 @@ fun ListItem( horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically, ) { + // Drag handle on the far left + if (dragHandle != null) { + dragHandle() + Spacer(modifier = Modifier.padding(start = 8.dp)) + } + + // Table name centered/left and clickable Column( modifier = Modifier @@ -292,11 +304,9 @@ fun ListItem( Text(text = list.name, style = MaterialTheme.typography.titleMedium) Spacer(modifier = Modifier.height(2.dp)) } + + // Actions on the right Row(verticalAlignment = Alignment.CenterVertically) { - if (dragHandle != null) { - dragHandle() - Spacer(modifier = Modifier.height(0.dp).padding(end = 4.dp)) - } IconButton(onClick = onEditClick) { Icon( Icons.Default.Edit,