Improves creation of lists for users that had none

This commit is contained in:
Vitor Pamplona
2025-11-15 11:26:35 -05:00
parent 1bd2b2168f
commit f7fd1e79f0
2 changed files with 144 additions and 133 deletions
@@ -23,7 +23,6 @@ package com.vitorpamplona.amethyst.ui.screen.loggedIn.lists.list
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
@@ -46,9 +45,8 @@ import com.vitorpamplona.amethyst.ui.stringRes
import com.vitorpamplona.amethyst.ui.theme.DividerThickness import com.vitorpamplona.amethyst.ui.theme.DividerThickness
import com.vitorpamplona.amethyst.ui.theme.FeedPadding import com.vitorpamplona.amethyst.ui.theme.FeedPadding
import com.vitorpamplona.amethyst.ui.theme.MaxWidthWithHorzPadding import com.vitorpamplona.amethyst.ui.theme.MaxWidthWithHorzPadding
import com.vitorpamplona.amethyst.ui.theme.Size40dp import com.vitorpamplona.amethyst.ui.theme.Size20dp
import com.vitorpamplona.amethyst.ui.theme.SpacedBy5dp import com.vitorpamplona.amethyst.ui.theme.SpacedBy5dp
import com.vitorpamplona.amethyst.ui.theme.StdVertSpacer
import com.vitorpamplona.amethyst.ui.theme.grayText import com.vitorpamplona.amethyst.ui.theme.grayText
@Composable @Composable
@@ -60,40 +58,46 @@ fun AllPeopleListFeedView(
val peopleListFeedState by peopleListModel.listFlow().collectAsStateWithLifecycle() val peopleListFeedState by peopleListModel.listFlow().collectAsStateWithLifecycle()
val followPackFeedState by followPackModel.listFlow().collectAsStateWithLifecycle() val followPackFeedState by followPackModel.listFlow().collectAsStateWithLifecycle()
if (peopleListFeedState.isEmpty() && followPackFeedState.isEmpty()) { LazyColumn(
AllPeopleListFeedEmpty( state = rememberLazyListState(),
message = stringRes(R.string.follow_set_empty_feed_msg), contentPadding = FeedPadding,
) ) {
} else { stickyHeader {
LazyColumn( Row(
state = rememberLazyListState(), modifier = MaxWidthWithHorzPadding,
contentPadding = FeedPadding, verticalAlignment = Alignment.CenterVertically,
) { horizontalArrangement = SpacedBy5dp,
stickyHeader { ) {
Row( Column(modifier = Modifier.weight(1f)) {
modifier = MaxWidthWithHorzPadding, Text(
verticalAlignment = Alignment.CenterVertically, text = stringRes(R.string.follow_sets),
horizontalArrangement = SpacedBy5dp, color = MaterialTheme.colorScheme.primary,
) { style = MaterialTheme.typography.titleSmall,
Column(modifier = Modifier.weight(1f)) { )
Text( Text(
text = stringRes(R.string.follow_sets), text = stringRes(R.string.follow_sets_explainer),
color = MaterialTheme.colorScheme.primary, style = MaterialTheme.typography.bodyMedium,
style = MaterialTheme.typography.titleSmall, color = MaterialTheme.colorScheme.grayText,
)
Text(
text = stringRes(R.string.follow_sets_explainer),
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.grayText,
)
}
NewListButton(
onClick = {
nav.nav(Route.PeopleListMetadataEdit())
},
) )
} }
NewListButton(
onClick = {
nav.nav(Route.PeopleListMetadataEdit())
},
)
} }
}
if (peopleListFeedState.isEmpty()) {
item {
Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center) {
Text(
text = stringRes(R.string.feed_is_empty),
modifier = Modifier.padding(vertical = Size20dp),
)
HorizontalDivider(thickness = DividerThickness)
}
}
} else {
itemsIndexed(peopleListFeedState, key = { _, item -> item.identifierTag }) { _, followSet -> itemsIndexed(peopleListFeedState, key = { _, item -> item.identifierTag }) { _, followSet ->
PeopleListItem( PeopleListItem(
modifier = modifier =
@@ -108,34 +112,46 @@ fun AllPeopleListFeedView(
) )
HorizontalDivider(thickness = DividerThickness) HorizontalDivider(thickness = DividerThickness)
} }
stickyHeader { }
Row( stickyHeader {
modifier = Row(
Modifier modifier =
.fillMaxWidth() Modifier
.padding(start = 10.dp, end = 10.dp, top = 10.dp), .fillMaxWidth()
verticalAlignment = Alignment.CenterVertically, .padding(start = 10.dp, end = 10.dp, top = 10.dp),
horizontalArrangement = SpacedBy5dp, verticalAlignment = Alignment.CenterVertically,
) { horizontalArrangement = SpacedBy5dp,
Column(modifier = Modifier.weight(1f)) { ) {
Text( Column(modifier = Modifier.weight(1f)) {
text = stringRes(R.string.discover_follows), Text(
color = MaterialTheme.colorScheme.primary, text = stringRes(R.string.discover_follows),
style = MaterialTheme.typography.titleSmall, color = MaterialTheme.colorScheme.primary,
) style = MaterialTheme.typography.titleSmall,
Text( )
text = stringRes(R.string.discover_follows_explainer), Text(
style = MaterialTheme.typography.bodyMedium, text = stringRes(R.string.discover_follows_explainer),
color = MaterialTheme.colorScheme.grayText, style = MaterialTheme.typography.bodyMedium,
) color = MaterialTheme.colorScheme.grayText,
}
NewListButton(
onClick = {
nav.nav(Route.FollowPackMetadataEdit())
},
) )
} }
NewListButton(
onClick = {
nav.nav(Route.FollowPackMetadataEdit())
},
)
} }
}
if (followPackFeedState.isEmpty()) {
item {
Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center) {
Text(
text = stringRes(R.string.feed_is_empty),
modifier = Modifier.padding(vertical = Size20dp),
)
HorizontalDivider(thickness = DividerThickness)
}
}
} else {
itemsIndexed(followPackFeedState, key = { _, item -> item.identifierTag }) { _, followSet -> itemsIndexed(followPackFeedState, key = { _, item -> item.identifierTag }) { _, followSet ->
PeopleListItem( PeopleListItem(
modifier = modifier =
@@ -153,17 +169,3 @@ fun AllPeopleListFeedView(
} }
} }
} }
@Composable
fun AllPeopleListFeedEmpty(message: String = stringRes(R.string.feed_is_empty)) {
Column(
Modifier
.fillMaxSize()
.padding(horizontal = Size40dp),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center,
) {
Text(message)
Spacer(modifier = StdVertSpacer)
}
}
@@ -23,8 +23,6 @@ package com.vitorpamplona.amethyst.ui.screen.loggedIn.lists.memberEdit
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
@@ -48,8 +46,8 @@ import com.vitorpamplona.amethyst.ui.screen.loggedIn.lists.list.NewListButton
import com.vitorpamplona.amethyst.ui.stringRes import com.vitorpamplona.amethyst.ui.stringRes
import com.vitorpamplona.amethyst.ui.theme.DividerThickness import com.vitorpamplona.amethyst.ui.theme.DividerThickness
import com.vitorpamplona.amethyst.ui.theme.MaxWidthWithHorzPadding import com.vitorpamplona.amethyst.ui.theme.MaxWidthWithHorzPadding
import com.vitorpamplona.amethyst.ui.theme.Size20dp
import com.vitorpamplona.amethyst.ui.theme.SpacedBy5dp import com.vitorpamplona.amethyst.ui.theme.SpacedBy5dp
import com.vitorpamplona.amethyst.ui.theme.StdVertSpacer
import com.vitorpamplona.amethyst.ui.theme.grayText import com.vitorpamplona.amethyst.ui.theme.grayText
@Composable @Composable
@@ -63,44 +61,43 @@ fun FollowListAndPackAndUserView(
val followPackFeedState by accountViewModel.account.followLists.uiListFlow val followPackFeedState by accountViewModel.account.followLists.uiListFlow
.collectAsStateWithLifecycle() .collectAsStateWithLifecycle()
if (followSetsState.isEmpty() && followPackFeedState.isEmpty()) { val userName by observeUserName(userToAddOrRemove, accountViewModel)
Column(
Modifier
.fillMaxWidth()
.fillMaxHeight(0.5f),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center,
) {
Text(text = stringRes(R.string.follow_set_empty_dialog_msg))
Spacer(modifier = StdVertSpacer)
}
} else {
val userName by observeUserName(userToAddOrRemove, accountViewModel)
LazyColumn(modifier = Modifier.fillMaxWidth()) { LazyColumn(modifier = Modifier.fillMaxWidth()) {
stickyHeader { stickyHeader {
Row( Row(
modifier = MaxWidthWithHorzPadding, modifier = MaxWidthWithHorzPadding,
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = SpacedBy5dp, horizontalArrangement = SpacedBy5dp,
) { ) {
Column(modifier = Modifier.weight(1f)) { Column(modifier = Modifier.weight(1f)) {
Text( Text(
text = stringRes(R.string.follow_sets), text = stringRes(R.string.follow_sets),
color = MaterialTheme.colorScheme.primary, color = MaterialTheme.colorScheme.primary,
style = MaterialTheme.typography.titleSmall, style = MaterialTheme.typography.titleSmall,
) )
Text( Text(
text = stringRes(R.string.follow_sets_explainer), text = stringRes(R.string.follow_sets_explainer),
style = MaterialTheme.typography.bodyMedium, style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.grayText, color = MaterialTheme.colorScheme.grayText,
)
}
NewListButton(
onClick = { nav.nav(Route.PeopleListMetadataEdit()) },
) )
} }
NewListButton(
onClick = { nav.nav(Route.PeopleListMetadataEdit()) },
)
} }
}
if (followSetsState.isEmpty()) {
item {
Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center) {
Text(
text = stringRes(R.string.feed_is_empty),
modifier = Modifier.padding(vertical = Size20dp),
)
HorizontalDivider(thickness = DividerThickness)
}
}
} else {
itemsIndexed(followSetsState, key = { _, item -> item.identifierTag }) { _, list -> itemsIndexed(followSetsState, key = { _, item -> item.identifierTag }) { _, list ->
PeopleListAndUserItem( PeopleListAndUserItem(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
@@ -136,32 +133,44 @@ fun FollowListAndPackAndUserView(
) )
HorizontalDivider(thickness = DividerThickness) HorizontalDivider(thickness = DividerThickness)
} }
stickyHeader { }
Row( stickyHeader {
modifier = Row(
Modifier modifier =
.fillMaxWidth() Modifier
.padding(start = 10.dp, end = 10.dp, top = 10.dp), .fillMaxWidth()
verticalAlignment = Alignment.CenterVertically, .padding(start = 10.dp, end = 10.dp, top = 10.dp),
horizontalArrangement = SpacedBy5dp, verticalAlignment = Alignment.CenterVertically,
) { horizontalArrangement = SpacedBy5dp,
Column(modifier = Modifier.weight(1f)) { ) {
Text( Column(modifier = Modifier.weight(1f)) {
text = stringRes(R.string.discover_follows), Text(
color = MaterialTheme.colorScheme.primary, text = stringRes(R.string.discover_follows),
style = MaterialTheme.typography.titleSmall, color = MaterialTheme.colorScheme.primary,
) style = MaterialTheme.typography.titleSmall,
Text( )
text = stringRes(R.string.discover_follows_explainer), Text(
style = MaterialTheme.typography.bodyMedium, text = stringRes(R.string.discover_follows_explainer),
color = MaterialTheme.colorScheme.grayText, style = MaterialTheme.typography.bodyMedium,
) color = MaterialTheme.colorScheme.grayText,
}
NewListButton(
onClick = { nav.nav(Route.FollowPackMetadataEdit()) },
) )
} }
NewListButton(
onClick = { nav.nav(Route.FollowPackMetadataEdit()) },
)
} }
}
if (followPackFeedState.isEmpty()) {
item {
Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center) {
Text(
text = stringRes(R.string.feed_is_empty),
modifier = Modifier.padding(vertical = Size20dp),
)
HorizontalDivider(thickness = DividerThickness)
}
}
} else {
itemsIndexed(followPackFeedState, key = { _, item -> item.identifierTag }) { _, list -> itemsIndexed(followPackFeedState, key = { _, item -> item.identifierTag }) { _, list ->
FollowPackAndUserItem( FollowPackAndUserItem(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),