Focus on page title when returning from viewing item

alphagov · Dec 12, 2024 · 53945eb · 53945eb
1 parent 016bf1d
commit 53945eb
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 23 deletions.
diff --git a/design/src/main/kotlin/uk/govuk/app/design/ui/component/Header.kt b/design/src/main/kotlin/uk/govuk/app/design/ui/component/Header.kt
@@ -1,6 +1,5 @@
 package uk.govuk.app.design.ui.component
 
-import androidx.compose.foundation.focusable
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
@@ -14,8 +13,6 @@ import androidx.compose.material3.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.focus.FocusRequester
-import androidx.compose.ui.focus.focusRequester
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
@@ -49,8 +46,7 @@ fun ChildPageHeader(
     text: String? = null,
     onBack: (() -> Unit)? = null,
     onAction: (() -> Unit)? = null,
-    actionText: String? = null,
-    focusRequester: FocusRequester? = null
+    actionText: String? = null
 ) {
     Column(modifier) {
         if (onBack != null || onAction != null) {
@@ -89,20 +85,11 @@ fun ChildPageHeader(
         }
 
         if (text != null) {
-            var titleModifier =
-                Modifier
-                    .fillMaxWidth()
-                    .padding(horizontal = GovUkTheme.spacing.medium)
-            focusRequester?.let {
-                titleModifier = titleModifier.then(
-                    Modifier
-                        .focusRequester(it)
-                        .focusable()
-                )
-            }
             LargeTitleBoldLabel(
                 text = text,
-                modifier = titleModifier
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .padding(horizontal = GovUkTheme.spacing.medium)
             )
         }
     }

diff --git a/feature/visited/src/main/kotlin/uk/govuk/app/visited/ui/VisitedScreen.kt b/feature/visited/src/main/kotlin/uk/govuk/app/visited/ui/VisitedScreen.kt
@@ -12,7 +12,9 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.focus.FocusRequester
@@ -31,6 +33,7 @@ import uk.govuk.app.design.ui.component.BodyRegularLabel
 import uk.govuk.app.design.ui.component.ChildPageHeader
 import uk.govuk.app.design.ui.component.ExternalLinkListItem
 import uk.govuk.app.design.ui.component.ExtraLargeVerticalSpacer
+import uk.govuk.app.design.ui.component.LargeTitleBoldLabel
 import uk.govuk.app.design.ui.component.LargeVerticalSpacer
 import uk.govuk.app.design.ui.component.ListHeadingLabel
 import uk.govuk.app.design.ui.component.SmallVerticalSpacer
@@ -86,16 +89,23 @@ private fun VisitedScreen(
     val lifecycleState by lifecycleOwner.lifecycle.currentStateFlow.collectAsState()
     val focusManager = LocalFocusManager.current
     val focusRequester = remember { FocusRequester() }
+    var isViewingItem by remember { mutableStateOf(false) }
 
     Column(modifier) {
         val onAction = if (!visitedItems.isNullOrEmpty()) onEditClick else null
 
         ChildPageHeader(
-            text = title,
             onBack = onBack,
             onAction = onAction,
             actionText = editText,
-            focusRequester = focusRequester
+        )
+        LargeTitleBoldLabel(
+            text = title,
+            modifier = Modifier
+                .fillMaxWidth()
+                .focusRequester(focusRequester)
+                .focusable()
+                .padding(horizontal = GovUkTheme.spacing.medium)
         )
         LazyColumn(
             Modifier
@@ -106,7 +116,10 @@ private fun VisitedScreen(
                 if (visitedItems.isNullOrEmpty()) {
                     NoVisitedItems(modifier)
                 } else {
-                    ShowVisitedItems(visitedItems, onClick)
+                    ShowVisitedItems(visitedItems) { title, url ->
+                        isViewingItem = true
+                        onClick(title, url)
+                    }
                 }
             }
         }
@@ -115,9 +128,12 @@ private fun VisitedScreen(
     LaunchedEffect(lifecycleState) {
         when (lifecycleState) {
             Lifecycle.State.RESUMED -> {
-                focusManager.clearFocus(true)
-                delay(500)
-                focusRequester.requestFocus()
+                if (isViewingItem) {
+                    focusManager.clearFocus(true)
+                    delay(500)
+                    focusRequester.requestFocus()
+                    isViewingItem = false
+                }
             }
             else -> { /* Do nothing */ }
         }