Skip to content

Commit 191542e

Browse files
authored
feat(tipping): give the Chats tab the standard centred title (#1382)
The large title was the only one of its kind in the app, and it left the list running to a hard cut at both edges. Drop `screenTitleLarge` so the bar falls back to `screenTitle`, and centre it: with no leading control the slot reserves no width, so a Start-aligned title sits flush at the inset and reads off-centre against the Add button. Fade the list with `verticalScrollStateGradient`, applied after the scaffold padding so the gradient lands on the viewport flush under the bar rather than on the bar's own space. It only draws at an edge that can still be scrolled toward, so the empty state — which fills the viewport and cannot scroll — is unfaded. `screenTitleLarge` now has no callers; left in place.
1 parent 7700298 commit 191542e

1 file changed

Lines changed: 15 additions & 4 deletions

File tree

  • apps/flipcash/features/tipping/src/main/kotlin/com/flipcash/app/tipping

‎apps/flipcash/features/tipping/src/main/kotlin/com/flipcash/app/tipping/TipsScreen.kt‎

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import androidx.compose.foundation.layout.size
1111
import androidx.compose.foundation.lazy.LazyColumn
1212
import androidx.compose.foundation.lazy.LazyListScope
1313
import androidx.compose.foundation.lazy.itemsIndexed
14+
import androidx.compose.foundation.lazy.rememberLazyListState
1415
import androidx.compose.material3.Text
1516
import androidx.compose.runtime.Composable
1617
import androidx.compose.runtime.getValue
@@ -39,12 +40,14 @@ import com.getcode.navigation.flow.flowSharedViewModel
3940
import com.getcode.theme.CodeTheme
4041
import com.getcode.ui.components.AppBarDefaults
4142
import com.getcode.ui.components.AppBarWithTitle
43+
import com.getcode.ui.core.verticalScrollStateGradient
4244
import com.getcode.ui.theme.CodeScaffold
4345

4446
/**
4547
* The tip DM conversation list — always a step in the tipping [TippingFlowScreen] flow, so it shares
46-
* the flow's [TipFlowViewModel]. It is the "Chats" root tab: a flush large title over the list, no
47-
* dismiss affordance (the root nav bar is the chrome); the tip card lives on its own tab.
48+
* the flow's [TipFlowViewModel]. It is the "Chats" root tab: the standard centred screen title over
49+
* the list, no dismiss affordance (the root nav bar is the chrome); the tip card lives on its own
50+
* tab.
4851
*/
4952
@Composable
5053
fun TipsScreen() {
@@ -56,7 +59,9 @@ fun TipsScreen() {
5659
topBar = {
5760
AppBarWithTitle(
5861
title = stringResource(R.string.title_chats),
59-
titleTextStyle = CodeTheme.typography.screenTitleLarge,
62+
// Centred rather than flush-start: an empty leading slot reserves no width, so a
63+
// Start title sits at the inset and reads as off-centre against the Add button.
64+
titleAlignment = Alignment.CenterHorizontally,
6065
// Node 9442:5779 — the only way to start a chat with someone who has never paid
6166
// you. A pushed route, not a step of this flow: this list is a tab home, and a step
6267
// pushed inside it would leave the tab bar over the entry screen.
@@ -67,13 +72,19 @@ fun TipsScreen() {
6772
}
6873
) { padding ->
6974
val chats = state.tipChats
75+
val listState = rememberLazyListState()
7076
LazyColumn(
7177
modifier = Modifier
7278
.fillMaxSize()
7379
// Scroll anchor for UI tests: `send_contact_row` addresses a single row, this
7480
// addresses the scrollable list itself.
7581
.testTag("chat_list")
76-
.padding(padding),
82+
.padding(padding)
83+
// After the padding so the fade lands on the list viewport — flush under the app
84+
// bar — rather than on the bar's own space. Rows dissolve into the background at
85+
// whichever edge is still scrollable instead of being cut off.
86+
.verticalScrollStateGradient(scrollState = listState),
87+
state = listState,
7788
// Clears the hoisted tab bar: keeps the last row reachable and centers the empty state
7889
// in the space the bar leaves visible.
7990
contentPadding = LocalTabBarPadding.current,

0 commit comments

Comments
 (0)