1 files changed, 94 insertions, 0 deletions
diff --git a/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/components/menu/compose/header/SubmenuHeader.kt b/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/components/menu/compose/header/SubmenuHeader.kt
new file mode 100644
index 0000000000..6b47ea17db
--- /dev/null
+++ b/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/components/menu/compose/header/SubmenuHeader.kt
@@ -0,0 +1,94 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+package org.mozilla.fenix.components.menu.compose.header
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.defaultMinSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.semantics.heading
+import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import org.mozilla.fenix.R
+import org.mozilla.fenix.compose.annotation.LightDarkPreview
+import org.mozilla.fenix.theme.FirefoxTheme
+import org.mozilla.fenix.theme.Theme
+
+@Composable
+internal fun SubmenuHeader(
+    header: String,
+    onClick: () -> Unit,
+) {
+    Row(
+        modifier = Modifier
+            .padding(start = 4.dp, end = 16.dp)
+            .defaultMinSize(minHeight = 56.dp),
+        verticalAlignment = Alignment.CenterVertically,
+    ) {
+        IconButton(
+            onClick = { onClick() },
+        ) {
+            Icon(
+                painter = painterResource(id = R.drawable.mozac_ic_back_24),
+                contentDescription = null,
+                tint = FirefoxTheme.colors.iconSecondary,
+            )
+        }
+
+        Spacer(modifier = Modifier.width(4.dp))
+
+        Text(
+            text = header,
+            modifier = Modifier
+                .weight(1f)
+                .semantics { heading() },
+            color = FirefoxTheme.colors.textSecondary,
+            style = FirefoxTheme.typography.headline7,
+        )
+    }
+}
+
+@LightDarkPreview
+@Composable
+private fun SubmenuHeaderPreview() {
+    FirefoxTheme {
+        Column(
+            modifier = Modifier
+                .background(color = FirefoxTheme.colors.layer3),
+        ) {
+            SubmenuHeader(
+                header = "sub-menu header",
+                onClick = {},
+            )
+        }
+    }
+}
+
+@Preview
+@Composable
+private fun SubmenuMenuHeaderPrivatePreview() {
+    FirefoxTheme(theme = Theme.Private) {
+        Column(
+            modifier = Modifier
+                .background(color = FirefoxTheme.colors.layer3),
+        ) {
+            SubmenuHeader(
+                header = "sub-menu header",
+                onClick = {},
+            )
+        }
+    }
+}