fix(groups): inset Requests headers and lead Join Requests with the key note (#1766)

The Requests screen's "Waiting on you" and "Sent" headers sat flush with
the screen edge: SectionHeader sets only vertical padding. They now take
the rows' inset.

Join Requests showed "Approving shares the group key with them from this
device." under the list. iOS shows it above the rows, so it is read before
Approve; Android now does the same, with iOS's 4/12 spacing.

Author: bmc08gt

apps/flipcash/features/messenger/src/main/kotlin/com/flipcash/app/messenger/internal/screens/profile/JoinRequestsScreen.kt

@@ -104,6 +104,19 @@ internal fun JoinRequestsScreen(viewModel: ChatViewModel) {
                     .padding(innerPadding),
                 contentPadding = PaddingValues(vertical = CodeTheme.dimens.grid.x2),
             ) {
+                // Above the rows, as on iOS, so it's read before Approve and scrolls away with the list.
+                item {
+                    Text(
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .padding(horizontal = CodeTheme.dimens.inset)
+                            .padding(top = CodeTheme.dimens.grid.x1, bottom = CodeTheme.dimens.grid.x3),
+                        text = stringResource(R.string.subtitle_joinRequestsFooter),
+                        style = CodeTheme.typography.caption,
+                        color = CodeTheme.colors.textSecondary,
+                        textAlign = TextAlign.Center,
+                    )
+                }
                 items(state.joinRequests, key = { it.publicKey.byteArray.toList() }) { member ->
                     val userId = member.userProfile.userId
                     JoinRequestRow(
@@ -124,18 +137,6 @@ internal fun JoinRequestsScreen(viewModel: ChatViewModel) {
                         onApprove = { viewModel.dispatchEvent(ChatViewModel.Event.ApproveJoinRequest(member)) },
                     )
                 }
-                item {
-                    Text(
-                        modifier = Modifier
-                            .fillMaxWidth()
-                            .padding(horizontal = CodeTheme.dimens.inset)
-                            .padding(top = CodeTheme.dimens.grid.x10),
-                        text = stringResource(R.string.subtitle_joinRequestsFooter),
-                        style = CodeTheme.typography.caption,
-                        color = CodeTheme.colors.textSecondary,
-                        textAlign = TextAlign.Center,
-                    )
-                }
             }
         }
     }

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

@@ -113,7 +113,10 @@ fun RequestsScreen() {
             if (state.hosted.isNotEmpty()) {
                 item(key = "hosted_header") {
                     SectionHeader(
-                        modifier = Modifier.animateItem(),
+                        // The rows' inset: SectionHeader sets only vertical padding.
+                        modifier = Modifier
+                            .animateItem()
+                            .padding(horizontal = CodeTheme.dimens.inset),
                         title = stringResource(R.string.header_waitingOnYou),
                     )
                 }
@@ -136,7 +139,10 @@ fun RequestsScreen() {
             if (state.sent.isNotEmpty()) {
                 item(key = "sent_header") {
                     SectionHeader(
-                        modifier = Modifier.animateItem(),
+                        // The rows' inset: SectionHeader sets only vertical padding.
+                        modifier = Modifier
+                            .animateItem()
+                            .padding(horizontal = CodeTheme.dimens.inset),
                         title = stringResource(R.string.header_sentRequests),
                     )
                 }