feat(app): integrate search button into top bars and refactor for reusability

app/src/main/java/hu/bbara/purefin/ui/screen/AppScreen.kt

@@ -87,6 +87,7 @@ fun AppScreen(
             LibrariesScreen(
                 items = libraries,
                 onLibrarySelected = { item -> viewModel.onLibrarySelected(item.id, item.name) },
+                onSearchClick = viewModel::openSearch,
                 selectedTab = selectedTab,
                 onTabSelected = onTabSelected,
                 modifier = Modifier.fillMaxSize()

app/src/main/java/hu/bbara/purefin/ui/screen/home/components/DefaultTopBar.kt

@@ -1,11 +1,20 @@
 package hu.bbara.purefin.ui.screen.home.components
 
+import androidx.compose.animation.ExperimentalSharedTransitionApi
+import androidx.compose.animation.SharedTransitionScope
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.outlined.Search
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.IconButtonColors
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBar
@@ -18,6 +27,9 @@ import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import hu.bbara.purefin.navigation.HOME_SEARCH_SHARED_BOUNDS_KEY
+import hu.bbara.purefin.navigation.LocalNavSharedAnimatedVisibilityScope
+import hu.bbara.purefin.navigation.LocalSharedTransitionScope
 import hu.bbara.purefin.ui.common.image.PurefinLogo
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -58,3 +70,51 @@ fun DefaultTopBar(
         modifier = Modifier.padding(end = 12.dp)
     )
 }
+
+@OptIn(ExperimentalSharedTransitionApi::class)
+@Composable
+fun DefaultTopBarSearchButton(
+    onClick: () -> Unit
+) {
+    val scheme = MaterialTheme.colorScheme
+    val sharedTransitionScope = LocalSharedTransitionScope.current
+    val animatedVisibilityScope = LocalNavSharedAnimatedVisibilityScope.current
+
+    val searchButtonModifier = if (
+        sharedTransitionScope != null &&
+        animatedVisibilityScope != null
+    ) {
+        with(sharedTransitionScope) {
+            Modifier
+                .sharedBounds(
+                    sharedContentState = rememberSharedContentState(
+                        key = HOME_SEARCH_SHARED_BOUNDS_KEY
+                    ),
+                    animatedVisibilityScope = animatedVisibilityScope,
+                    enter = fadeIn(),
+                    exit = fadeOut(),
+                    resizeMode = SharedTransitionScope.ResizeMode.scaleToBounds()
+                )
+                .size(50.dp)
+        }
+    } else {
+        Modifier.size(50.dp)
+    }
+
+    IconButton(
+        onClick = onClick,
+        colors = IconButtonColors(
+            containerColor = scheme.surface,
+            contentColor = scheme.onSurface,
+            disabledContainerColor = scheme.surface,
+            disabledContentColor = scheme.onSurface
+        ),
+        modifier = searchButtonModifier,
+    ) {
+        Icon(
+            imageVector = Icons.Outlined.Search,
+            contentDescription = "Search",
+            modifier = Modifier.size(30.dp),
+        )
+    }
+}

app/src/main/java/hu/bbara/purefin/ui/screen/home/components/HomeTopBar.kt

@@ -1,15 +1,10 @@
 package hu.bbara.purefin.ui.screen.home.components
 
-import androidx.compose.animation.ExperimentalSharedTransitionApi
-import androidx.compose.animation.SharedTransitionScope
-import androidx.compose.animation.fadeIn
-import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.Person
-import androidx.compose.material.icons.outlined.Search
 import androidx.compose.material3.DropdownMenu
 import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.Icon
@@ -25,11 +20,7 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.unit.dp
-import hu.bbara.purefin.navigation.HOME_SEARCH_SHARED_BOUNDS_KEY
-import hu.bbara.purefin.navigation.LocalNavSharedAnimatedVisibilityScope
-import hu.bbara.purefin.navigation.LocalSharedTransitionScope
 
-@OptIn(ExperimentalSharedTransitionApi::class)
 @Composable
 fun HomeTopBar(
     onSearchClick: () -> Unit,
@@ -38,50 +29,12 @@ fun HomeTopBar(
     onLogoutClick: () -> Unit,
 ) {
     val scheme = MaterialTheme.colorScheme
-    val sharedTransitionScope = LocalSharedTransitionScope.current
-    val animatedVisibilityScope = LocalNavSharedAnimatedVisibilityScope.current
 
     var isProfileMenuExpanded by remember { mutableStateOf(false) }
 
     DefaultTopBar()
         {
-            val searchButtonModifier = if (
+            DefaultTopBarSearchButton(onClick = onSearchClick)
-                sharedTransitionScope != null &&
-                animatedVisibilityScope != null
-            ) {
-                with(sharedTransitionScope) {
-                    Modifier
-                        .sharedBounds(
-                            sharedContentState = rememberSharedContentState(
-                                key = HOME_SEARCH_SHARED_BOUNDS_KEY
-                            ),
-                            animatedVisibilityScope = animatedVisibilityScope,
-                            enter = fadeIn(),
-                            exit = fadeOut(),
-                            resizeMode = SharedTransitionScope.ResizeMode.scaleToBounds()
-                        )
-                        .size(50.dp)
-                }
-            } else {
-                Modifier.size(50.dp)
-            }
-
-            IconButton(
-                onClick = onSearchClick,
-                colors = IconButtonColors(
-                    containerColor = scheme.surface,
-                    contentColor = scheme.onSurface,
-                    disabledContainerColor = scheme.surface,
-                    disabledContentColor = scheme.onSurface
-                ),
-                modifier = searchButtonModifier,
-            ) {
-                Icon(
-                    imageVector = Icons.Outlined.Search,
-                    contentDescription = "Search",
-                    modifier = Modifier.size(30.dp),
-                )
-            }
             Spacer(modifier = Modifier.size(12.dp))
             IconButton(
                 onClick = { isProfileMenuExpanded = true },

app/src/main/java/hu/bbara/purefin/ui/screen/libraries/LibrariesScreen.kt

@@ -15,6 +15,7 @@ import hu.bbara.purefin.ui.screen.library.components.LibraryTopBar
 fun LibrariesScreen(
     items: List<LibraryUiModel>,
     onLibrarySelected: (LibraryUiModel) -> Unit,
+    onSearchClick: () -> Unit,
     selectedTab: Int,
     onTabSelected: (Int) -> Unit,
     modifier: Modifier = Modifier
@@ -25,7 +26,7 @@ fun LibrariesScreen(
         contentColor = MaterialTheme.colorScheme.onBackground,
         topBar = {
             LibraryTopBar(
-                onSearchClick = {},
+                onSearchClick = onSearchClick,
             )
         },
         bottomBar = {

app/src/main/java/hu/bbara/purefin/ui/screen/library/components/LibraryTopBar.kt

@@ -1,39 +1,14 @@
 package hu.bbara.purefin.ui.screen.library.components
 
-import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Search
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
-import androidx.compose.material3.IconButtonColors
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
 import hu.bbara.purefin.ui.screen.home.components.DefaultTopBar
+import hu.bbara.purefin.ui.screen.home.components.DefaultTopBarSearchButton
 
 @Composable
 fun LibraryTopBar(
     onSearchClick: () -> Unit,
 ) {
-    val scheme = MaterialTheme.colorScheme
-
     DefaultTopBar {
-        IconButton(
+        DefaultTopBarSearchButton(onClick = onSearchClick)
-            onClick = onSearchClick,
-            colors = IconButtonColors(
-                containerColor = scheme.surface,
-                contentColor = scheme.onSurface,
-                disabledContainerColor = scheme.surface,
-                disabledContentColor = scheme.onSurface
-            ),
-            modifier = Modifier.size(50.dp),
-        ) {
-            Icon(
-                imageVector = Icons.Outlined.Search,
-                contentDescription = "Search",
-                modifier = Modifier.size(30.dp),
-            )
-        }
     }
 }