Fix nav icon bug for medium screens

jocmp · Jul 1, 2024 · a704a5e · a704a5e
1 parent 0e20b19
commit a704a5e
Show file tree

Hide file tree

Showing 8 changed files with 71 additions and 96 deletions.
diff --git a/app/src/main/java/com/jocmp/capyreader/MainActivity.kt b/app/src/main/java/com/jocmp/capyreader/MainActivity.kt
@@ -5,6 +5,8 @@ import android.os.StrictMode.ThreadPolicy
 import android.os.StrictMode.setThreadPolicy
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
+import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi
+import androidx.compose.material3.adaptive.currentWindowAdaptiveInfo
 import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
 import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
 import com.jocmp.capyreader.common.AppPreferences
@@ -13,17 +15,13 @@ import com.jocmp.capyreader.ui.Route
 import org.koin.android.ext.android.get
 
 class MainActivity : ComponentActivity() {
-    @OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
     override fun onCreate(savedInstanceState: Bundle?) {
         enableStrictModeOnDebug()
         super.onCreate(savedInstanceState)
 
         setContent {
-            val windowSizeClass = calculateWindowSizeClass(this)
-
             App(
                 startDestination = startDestination(),
-                windowSizeClass = windowSizeClass
             )
         }
     }

diff --git a/app/src/main/java/com/jocmp/capyreader/ui/App.kt b/app/src/main/java/com/jocmp/capyreader/ui/App.kt
@@ -3,62 +3,57 @@ package com.jocmp.capyreader.ui
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
-import androidx.compose.material3.windowsizeclass.WindowSizeClass
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.rememberNavController
-import com.jocmp.capyreader.ui.articles.articleGraph
 import com.jocmp.capyreader.ui.accounts.accountsGraph
+import com.jocmp.capyreader.ui.articles.articleGraph
 import com.jocmp.capyreader.ui.theme.CapyTheme
 import com.jocmp.capyreader.unloadAccountModules
 
 @Composable
 fun App(
     startDestination: String,
-    windowSizeClass: WindowSizeClass
 ) {
     val navController = rememberNavController()
 
     CapyTheme {
-        CompositionLocalProvider(LocalWindowWidth provides windowSizeClass.widthSizeClass) {
-            Surface(
-                modifier = Modifier.fillMaxSize(),
-                color = MaterialTheme.colorScheme.background
-            ) {
-                val isCompactWindow = LocalWindowWidth.current.isCompact
+        Surface(
+            modifier = Modifier.fillMaxSize(),
+            color = MaterialTheme.colorScheme.background
+        ) {
+            val compactWidth = isCompact()
 
-                NavHost(
-                    navController = navController,
-                    startDestination = startDestination
-                ) {
-                    accountsGraph(
-                        isCompactWindow = isCompactWindow,
-                        onNavigateToLogin = {
-                            navController.navigate(Route.Login)
-                        },
-                        onAddSuccess = {
-                            navController.navigate(Route.Articles) {
-                                popUpTo(Route.AddAccount.path) {
-                                    inclusive = true
-                                }
+            NavHost(
+                navController = navController,
+                startDestination = startDestination
+            ) {
+                accountsGraph(
+                    isCompactWidth = compactWidth,
+                    onNavigateToLogin = {
+                        navController.navigate(Route.Login)
+                    },
+                    onAddSuccess = {
+                        navController.navigate(Route.Articles) {
+                            popUpTo(Route.AddAccount.path) {
+                                inclusive = true
                             }
-                        },
-                        onLogout = {
-                            navController.navigate(Route.Login) {
-                                popUpTo(navController.graph.startDestinationId) {
-                                    inclusive = true
-                                }
+                        }
+                    },
+                    onLogout = {
+                        navController.navigate(Route.Login) {
+                            popUpTo(navController.graph.startDestinationId) {
+                                inclusive = true
                             }
-                            unloadAccountModules()
-                        },
-                        onNavigateBackFromSettings = {
-                            navController.navigateUp()
                         }
-                    )
-                    articleGraph(navController = navController)
-                }
+                        unloadAccountModules()
+                    },
+                    onNavigateBackFromSettings = {
+                        navController.navigateUp()
+                    }
+                )
+                articleGraph(navController = navController)
             }
         }
     }

diff --git a/app/src/main/java/com/jocmp/capyreader/ui/CurrentWindowSizeClass.kt b/app/src/main/java/com/jocmp/capyreader/ui/CurrentWindowSizeClass.kt
@@ -0,0 +1,15 @@
+package com.jocmp.capyreader.ui
+
+import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi
+import androidx.compose.material3.adaptive.currentWindowAdaptiveInfo
+import androidx.compose.runtime.Composable
+import androidx.window.core.layout.WindowWidthSizeClass.Companion.EXPANDED
+
+@Composable
+@OptIn(ExperimentalMaterial3AdaptiveApi::class)
+fun currentWindowSizeClass() = currentWindowAdaptiveInfo().windowSizeClass
+
+@Composable
+fun isCompact(): Boolean {
+    return currentWindowSizeClass().windowWidthSizeClass != EXPANDED
+}
diff --git a/app/src/main/java/com/jocmp/capyreader/ui/LocalWindowWidth.kt b/app/src/main/java/com/jocmp/capyreader/ui/LocalWindowWidth.kt
diff --git a/app/src/main/java/com/jocmp/capyreader/ui/accounts/AccountNavigation.kt b/app/src/main/java/com/jocmp/capyreader/ui/accounts/AccountNavigation.kt
@@ -15,7 +15,7 @@ fun NavGraphBuilder.accountsGraph(
     onNavigateToLogin: () -> Unit,
     onLogout: () -> Unit,
     onNavigateBackFromSettings: () -> Unit,
-    isCompactWindow: Boolean,
+    isCompactWidth: Boolean,
 ) {
     composable(Route.AddAccount) {
         AddAccountScreen(
@@ -28,7 +28,7 @@ fun NavGraphBuilder.accountsGraph(
             onSuccess = onAddSuccess,
         )
     }
-    dynamicLayout(isCompactWindow) {
+    dynamicLayout(isCompactWidth) {
         SettingsScreen(
             onLogout = onLogout,
             onNavigateBack = onNavigateBackFromSettings

diff --git a/app/src/main/java/com/jocmp/capyreader/ui/accounts/AddAccountView.kt b/app/src/main/java/com/jocmp/capyreader/ui/accounts/AddAccountView.kt
@@ -10,30 +10,21 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.LargeTopAppBar
 import androidx.compose.material3.MaterialTheme.typography
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
-import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
-import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.CompositionLocalProvider
-import androidx.compose.runtime.Stable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.jocmp.capy.accounts.Source
 import com.jocmp.capyreader.R
-import com.jocmp.capyreader.ui.LocalWindowWidth
 import com.jocmp.capyreader.ui.components.widthMaxSingleColumn
 import com.jocmp.capyreader.ui.isCompact
 import com.jocmp.capyreader.ui.theme.CapyTheme
 
-@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun AddAccountView(
     onSelectLocal: () -> Unit,
@@ -71,9 +62,7 @@ fun AddAccountView(
 
 @Composable
 private fun contentAlignment(): Alignment {
-    val width = LocalWindowWidth.current
-
-    return if (width.isCompact) {
+    return if (isCompact()) {
         Alignment.TopCenter
     } else {
         Alignment.Center
@@ -82,9 +71,7 @@ private fun contentAlignment(): Alignment {
 
 @Composable
 private fun titlePadding(): PaddingValues {
-    val width = LocalWindowWidth.current
-
-    return if (width.isCompact) {
+    return if (isCompact()) {
         PaddingValues(top = 56.dp, start = 16.dp, end = 16.dp)
     } else {
         PaddingValues(start = 16.dp, end = 16.dp)
@@ -105,12 +92,10 @@ private fun AddAccountViewPreview() {
 @Preview(device = "id:pixel_fold")
 @Composable
 private fun AddAccountViewPreview_Tablet() {
-    CompositionLocalProvider(LocalWindowWidth provides WindowWidthSizeClass.Medium) {
-        CapyTheme {
-            AddAccountView(
-                onSelectLocal = {},
-                onSelectFeedbin = {}
-            )
-        }
+    CapyTheme {
+        AddAccountView(
+            onSelectLocal = {},
+            onSelectFeedbin = {}
+        )
     }
 }
diff --git a/app/src/main/java/com/jocmp/capyreader/ui/articles/detail/ArticleTopBar.kt b/app/src/main/java/com/jocmp/capyreader/ui/articles/detail/ArticleTopBar.kt
@@ -7,9 +7,7 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.TopAppBar
-import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
@@ -18,8 +16,8 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
 import com.jocmp.capy.Article
 import com.jocmp.capyreader.R
 import com.jocmp.capyreader.common.shareArticle
-import com.jocmp.capyreader.ui.LocalWindowWidth
 import com.jocmp.capyreader.ui.fixtures.ArticleSample
+import com.jocmp.capyreader.ui.isCompact
 import java.net.URL
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -66,6 +64,7 @@ fun ArticleTopBar(
                             contentDescription = stringResource(R.string.article_view_star)
                         )
                     }
+
                     IconButton(onClick = { context.shareArticle(article = article) }) {
                         Icon(
                             painterResource(id = R.drawable.ic_share),
@@ -103,7 +102,7 @@ fun extractIcon(extractedContent: ExtractedContent) = when {
 
 @Composable
 fun ArticleNavigationIcon(onClick: () -> Unit) {
-    val showIcon = LocalWindowWidth.current == WindowWidthSizeClass.Compact
+    val showIcon = isCompact()
 
     if (!showIcon) {
         return
@@ -134,21 +133,17 @@ private fun ArticleTopBarPreview(@PreviewParameter(ArticleSample::class) article
     )
 }
 
-@Preview
+@Preview(device = "id:pixel_fold")
 @Composable
 private fun ArticleTopBarPreview_Tablet(@PreviewParameter(ArticleSample::class) article: Article) {
-    val width = WindowWidthSizeClass.Medium
-
-    CompositionLocalProvider(LocalWindowWidth provides width) {
-        ArticleTopBar(
-            article = article,
-            extractedContent = ExtractedContent(),
-            onToggleExtractContent = {},
-            onToggleRead = {},
-            onToggleStar = {},
-            onClose = {}
-        )
-    }
+    ArticleTopBar(
+        article = article,
+        extractedContent = ExtractedContent(),
+        onToggleExtractContent = {},
+        onToggleRead = {},
+        onToggleStar = {},
+        onClose = {}
+    )
 }
 
 @Preview

diff --git a/app/src/main/java/com/jocmp/capyreader/ui/settings/SettingsView.kt b/app/src/main/java/com/jocmp/capyreader/ui/settings/SettingsView.kt
@@ -36,7 +36,6 @@ import androidx.compose.ui.unit.sp
 import com.jocmp.capyreader.R
 import com.jocmp.capyreader.refresher.RefreshInterval
 import com.jocmp.capyreader.setupCommonModules
-import com.jocmp.capyreader.ui.LocalWindowWidth
 import com.jocmp.capyreader.ui.components.CrashReportingCheckbox
 import com.jocmp.capyreader.ui.isCompact
 import org.koin.android.ext.koin.androidContext
@@ -159,7 +158,7 @@ fun SettingsView(
 
 @Composable
 private fun backButton(): ImageVector {
-    val showBackArrow = LocalWindowWidth.current.isCompact
+    val showBackArrow = isCompact()
 
     return if (showBackArrow) {
         Icons.AutoMirrored.Filled.ArrowBack