Create web agnostic main container

app-compose/src/main/kotlin/com/pitchedapps/frost/main/MainData.kt

@@ -18,6 +18,7 @@ package com.pitchedapps.frost.main
 
 import androidx.compose.ui.graphics.vector.ImageVector
 import com.pitchedapps.frost.ext.WebTargetId
+import com.pitchedapps.frost.tabselector.TabData
 
 /** Data representation of a single main tab entry. */
 data class MainTabItem(
@@ -26,3 +27,10 @@ data class MainTabItem(
   val icon: ImageVector,
   val url: String
 )
+
+fun MainTabItem.toTab() =
+  TabData(
+    icon = icon,
+    title = title,
+    key = id.id,
+  )

app-compose/src/main/kotlin/com/pitchedapps/frost/main/MainScreen.kt

@@ -0,0 +1,185 @@
+/*
+ * Copyright 2023 Allan Wang
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+package com.pitchedapps.frost.main
+
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.material3.DrawerValue
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.ModalDrawerSheet
+import androidx.compose.material3.ModalNavigationDrawer
+import androidx.compose.material3.NavigationBar
+import androidx.compose.material3.NavigationBarItem
+import androidx.compose.material3.NavigationDrawerItem
+import androidx.compose.material3.NavigationDrawerItemDefaults
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.rememberDrawerState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableIntStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.pitchedapps.frost.compose.FrostTheme
+import com.pitchedapps.frost.facebook.FbItem
+import com.pitchedapps.frost.facebook.tab
+import com.pitchedapps.frost.tabselector.TabData
+import kotlinx.coroutines.launch
+
+@Composable
+fun MainScreenContainer(
+  modifier: Modifier = Modifier,
+  drawerItems: List<TabData>,
+  drawerSelectedIndex: Int,
+  drawerOnSelect: (Int) -> Unit,
+  navItems: List<TabData>,
+  navSelectedIndex: Int,
+  navOnSelect: (Int) -> Unit,
+  content: @Composable (PaddingValues) -> Unit,
+) {
+
+  val drawerState = rememberDrawerState(DrawerValue.Closed)
+  val scope = rememberCoroutineScope()
+
+  ModalNavigationDrawer(
+    modifier = modifier,
+    drawerState = drawerState,
+    drawerContent = {
+      MainModalDrawerContent(
+        items = drawerItems,
+        selectedIndex = drawerSelectedIndex,
+        onSelect = {
+          scope.launch { drawerState.close() }
+          drawerOnSelect(it)
+        },
+      )
+    },
+    //    drawerShape = …,
+    //  drawerTonalElevation = …,
+    //  drawerContainerColor = …,
+    //  drawerContentColor = …,
+  ) {
+    Scaffold(
+      containerColor = Color.Transparent,
+      topBar = { MainTopBar() },
+      bottomBar = {
+        MainBottomBar(
+          selectedIndex = navSelectedIndex,
+          items = navItems,
+          onSelect = { navOnSelect(it) },
+        )
+      },
+      content = content,
+    )
+  }
+}
+
+@Composable
+private fun MainModalDrawerContent(
+  modifier: Modifier = Modifier,
+  items: List<TabData>,
+  selectedIndex: Int,
+  onSelect: (Int) -> Unit,
+) {
+  ModalDrawerSheet(modifier = modifier) {
+    LazyColumn {
+      items(items.size) { i ->
+        val item = items[i]
+        NavigationDrawerItem(
+          icon = {
+            Icon(
+              modifier = Modifier.size(24.dp),
+              imageVector = item.icon,
+              contentDescription = null,
+            )
+          },
+          label = { Text(item.title) },
+          selected = i == selectedIndex,
+          onClick = { onSelect(i) },
+          modifier = Modifier.padding(NavigationDrawerItemDefaults.ItemPadding),
+        )
+      }
+    }
+  }
+}
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun MainTopBar(modifier: Modifier = Modifier) {
+  TopAppBar(modifier = modifier, title = { Text(text = "Title") })
+}
+
+@Composable
+fun MainBottomBar(
+  modifier: Modifier = Modifier,
+  selectedIndex: Int,
+  items: List<TabData>,
+  onSelect: (Int) -> Unit
+) {
+  NavigationBar(
+    modifier = modifier,
+  ) {
+    for ((i, item) in items.withIndex()) {
+      NavigationBarItem(
+        icon = {
+          Icon(
+            modifier = Modifier.size(24.dp),
+            imageVector = item.icon,
+            contentDescription = item.title,
+          )
+        },
+        selected = i == selectedIndex,
+        onClick = { onSelect(i) },
+      )
+    }
+  }
+}
+
+@Composable
+@Preview
+fun MainScreenContainerPreview() {
+  val context = LocalContext.current
+
+  val drawerItems = remember { FbItem.values().map { it.tab(context) } }
+
+  var drawerSelectedIndex by remember { mutableIntStateOf(0) }
+
+  val navItems = remember { listOf(FbItem.Feed, FbItem.Messages).map { it.tab(context) } }
+
+  var navSelectedIndex by remember { mutableIntStateOf(0) }
+
+  FrostTheme {
+    MainScreenContainer(
+      drawerItems = drawerItems,
+      drawerSelectedIndex = drawerSelectedIndex,
+      drawerOnSelect = { drawerSelectedIndex = it },
+      navItems = navItems,
+      navSelectedIndex = navSelectedIndex,
+      navOnSelect = { navSelectedIndex = it },
+    ) {}
+  }
+}

app-compose/src/main/kotlin/com/pitchedapps/frost/main/MainScreenWebView.kt

@@ -19,20 +19,12 @@ package com.pitchedapps.frost.main
 import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.rememberPagerState
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.pullrefresh.PullRefreshIndicator
 import androidx.compose.material.pullrefresh.pullRefresh
 import androidx.compose.material.pullrefresh.rememberPullRefreshState
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.NavigationBar
-import androidx.compose.material3.NavigationBarItem
-import androidx.compose.material3.Scaffold
-import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -42,8 +34,6 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.pitchedapps.frost.compose.webview.FrostWebCompose
 import com.pitchedapps.frost.ext.WebTargetId
@@ -62,17 +52,13 @@ fun MainScreenWebView(modifier: Modifier = Modifier) {
 
   val selectedHomeTab by vm.store.observeAsState(initialValue = null) { it.selectedHomeTab }
 
-  Scaffold(
-    modifier = modifier,
-    containerColor = Color.Transparent,
-    topBar = { MainTopBar(modifier = modifier) },
-    bottomBar = {
-      MainBottomBar(
-        selectedTab = selectedHomeTab,
-        items = homeTabs,
-        onSelect = { vm.useCases.homeTabs.selectHomeTab(it) },
-      )
-    },
+  MainScreenContainer(
+    drawerItems = emptyList(),
+    drawerSelectedIndex = -1,
+    drawerOnSelect = {},
+    navItems = homeTabs.map { it.toTab() },
+    navSelectedIndex = selectedHomeTab?.let { id -> homeTabs.indexOfFirst { it.id == id } } ?: -1,
+    navOnSelect = { vm.useCases.homeTabs.selectHomeTab((homeTabs[it].id)) },
   ) { paddingValues ->
     MainScreenWebContainer(
       modifier = Modifier.padding(paddingValues),
@@ -84,36 +70,6 @@ fun MainScreenWebView(modifier: Modifier = Modifier) {
   }
 }
 
-@OptIn(ExperimentalMaterial3Api::class)
-@Composable
-fun MainTopBar(modifier: Modifier = Modifier) {
-  TopAppBar(modifier = modifier, title = { Text(text = "Title") })
-}
-
-@Composable
-fun MainBottomBar(
-  modifier: Modifier = Modifier,
-  selectedTab: WebTargetId?,
-  items: List<MainTabItem>,
-  onSelect: (WebTargetId) -> Unit
-) {
-  NavigationBar(modifier = modifier) {
-    items.forEach { item ->
-      NavigationBarItem(
-        icon = {
-          Icon(
-            modifier = Modifier.size(24.dp),
-            imageVector = item.icon,
-            contentDescription = item.title,
-          )
-        },
-        selected = selectedTab == item.id,
-        onClick = { onSelect(item.id) },
-      )
-    }
-  }
-}
-
 @Composable
 private fun MainScreenWebContainer(
   modifier: Modifier,