Migrate HomeViewPagerFragment contents to Compose (#823)

* Migrate PlantListFragment content to Compose.

Change-Id: Ic6789a43249d93eba333cfbaba9eea0f1f042009

* Update tests.

Change-Id: I623bcbb75fd8d6e10bc882c961fafbc5636516e3

* Migrate HomeViewPagerFragment to Compose.

Change-Id: I52ad72604742bb89255980c27b5a5808e1fb43f0

* Use HorizontalPager in Compose 1.4.0

Change-Id: Ia552340497a889d9bc03a88c99ebf13d98455010

* Update migration journey.

Change-Id: I6fb161f6e8efb58dd8f1e435111ea30e2116f239

* Remove Git conflit text.

Change-Id: Idae05b580b6bc0b7406e26d15ee3f948a2b8ebb2

* PR Feedback.

Change-Id: I664126ec40cf94b0b42d4567227999ad3c8fb50e

* PR feedback.

Change-Id: I3a32073ff4d6c6214caaa5939803af95f251c501

app/build.gradle.kts

@@ -122,7 +122,6 @@ dependencies {
   implementation(libs.androidx.paging.compose)
   implementation(libs.androidx.paging.runtime.ktx)
   implementation(libs.androidx.room.ktx)
-  implementation(libs.androidx.viewpager2)
   implementation(libs.androidx.work.runtime.ktx)
   implementation(libs.material)
   implementation(libs.gson)

app/src/main/java/com/google/samples/apps/sunflower/HomeViewPagerFragment.kt

@@ -17,56 +17,84 @@
 package com.google.samples.apps.sunflower
 
 import android.os.Bundle
+import android.util.Log
 import android.view.LayoutInflater
+import android.view.Menu
+import android.view.MenuInflater
+import android.view.MenuItem
 import android.view.View
 import android.view.ViewGroup
 import androidx.appcompat.app.AppCompatActivity
+import androidx.compose.ui.platform.ViewCompositionStrategy
+import androidx.core.view.MenuHost
+import androidx.core.view.MenuProvider
 import androidx.fragment.app.Fragment
-import com.google.android.material.tabs.TabLayoutMediator
-import com.google.samples.apps.sunflower.adapters.MY_GARDEN_PAGE_INDEX
-import com.google.samples.apps.sunflower.adapters.PLANT_LIST_PAGE_INDEX
-import com.google.samples.apps.sunflower.adapters.SunflowerPagerAdapter
+import androidx.fragment.app.viewModels
+import androidx.navigation.fragment.findNavController
+import com.google.accompanist.themeadapter.material.MdcTheme
+import com.google.samples.apps.sunflower.compose.home.HomeScreen
+import com.google.samples.apps.sunflower.compose.home.SunflowerPage
+import com.google.samples.apps.sunflower.data.Plant
 import com.google.samples.apps.sunflower.databinding.FragmentViewPagerBinding
+import com.google.samples.apps.sunflower.viewmodels.PlantListViewModel
 import dagger.hilt.android.AndroidEntryPoint
 
 @AndroidEntryPoint
 class HomeViewPagerFragment : Fragment() {
 
+    private val viewModel: PlantListViewModel by viewModels()
+
+    private val menuProvider = object : MenuProvider {
+        override fun onCreateMenu(menu: Menu, menuInflater: MenuInflater) {
+            menuInflater.inflate(R.menu.menu_plant_list, menu)
+        }
+
+        override fun onMenuItemSelected(menuItem: MenuItem): Boolean {
+            return when (menuItem.itemId) {
+                R.id.filter_zone -> {
+                    viewModel.updateData()
+                    true
+                }
+                else -> false
+            }
+        }
+    }
+
     override fun onCreateView(
         inflater: LayoutInflater,
         container: ViewGroup?,
         savedInstanceState: Bundle?
     ): View {
         val binding = FragmentViewPagerBinding.inflate(inflater, container, false)
-        val tabLayout = binding.tabs
-        val viewPager = binding.viewPager
-
-        viewPager.adapter = SunflowerPagerAdapter(this)
-
-        // Set the icon and text for each tab
-        TabLayoutMediator(tabLayout, viewPager) { tab, position ->
-            tab.setIcon(getTabIcon(position))
-            tab.text = getTabTitle(position)
-        }.attach()
-
-        (activity as AppCompatActivity).setSupportActionBar(binding.toolbar)
-
-        return binding.root
-    }
-
-    private fun getTabIcon(position: Int): Int {
-        return when (position) {
-            MY_GARDEN_PAGE_INDEX -> R.drawable.garden_tab_selector
-            PLANT_LIST_PAGE_INDEX -> R.drawable.plant_list_tab_selector
-            else -> throw IndexOutOfBoundsException()
+        val menuHost: MenuHost = requireActivity()
+        (requireActivity() as AppCompatActivity).setSupportActionBar(binding.toolbar)
+        binding.composeView.apply {
+            setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)
+            setContent {
+                MdcTheme {
+                    HomeScreen(
+                        onPlantClick = {
+                            navigateToPlant(it)
+                        }, onPageChange = { page ->
+                            Log.d("HomeViewPagerFragment", "Page changed to $page")
+                            when (page) {
+                                SunflowerPage.MY_GARDEN -> menuHost.removeMenuProvider(menuProvider)
+                                SunflowerPage.PLANT_LIST -> menuHost.addMenuProvider(
+                                    menuProvider,
+                                    viewLifecycleOwner
+                                )
+                            }
+                        }
+                    )
+                }
+            }
         }
+        return binding.root
     }
 
-    private fun getTabTitle(position: Int): String? {
-        return when (position) {
-            MY_GARDEN_PAGE_INDEX -> getString(R.string.my_garden_title)
-            PLANT_LIST_PAGE_INDEX -> getString(R.string.plant_list_title)
-            else -> null
-        }
+    private fun navigateToPlant(plant: Plant) {
+        val direction =
+            HomeViewPagerFragmentDirections.actionViewPagerFragmentToPlantDetailFragment(plant.plantId)
+        findNavController().navigate(direction)
     }
-}
+}

app/src/main/java/com/google/samples/apps/sunflower/PlantListFragment.kt

@@ -30,7 +30,6 @@ import androidx.fragment.app.viewModels
 import androidx.navigation.fragment.findNavController
 import com.google.accompanist.themeadapter.material.MdcTheme
 import com.google.samples.apps.sunflower.compose.plantlist.PlantListScreen
-import com.google.samples.apps.sunflower.data.Plant
 import com.google.samples.apps.sunflower.viewmodels.PlantListViewModel
 import dagger.hilt.android.AndroidEntryPoint
 
@@ -50,9 +49,11 @@ class PlantListFragment : Fragment() {
             setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)
             setContent {
                 MdcTheme {
-                    PlantListScreen {
-                        navigateToPlant(it)
-                    }
+                    PlantListScreen(
+                        onPlantClick = {
+                            navigateToPlant(plantId = it.plantId)
+                        }
+                    )
                 }
             }
         }
@@ -72,10 +73,10 @@ class PlantListFragment : Fragment() {
         }
     }
 
-    private fun navigateToPlant(plant: Plant) {
+    private fun navigateToPlant(plantId: String) {
         val direction =
             HomeViewPagerFragmentDirections.actionViewPagerFragmentToPlantDetailFragment(
-                plant.plantId
+                plantId
             )
         findNavController().navigate(direction)
     }

app/src/main/java/com/google/samples/apps/sunflower/compose/gallery/GalleryScreen.kt

@@ -69,20 +69,7 @@ private fun GalleryScreen(
 ) {
     Scaffold(
         topBar = {
-            TopAppBar(
-                title = {
-                    Text(stringResource(id = R.string.gallery_title))
-                },
-                Modifier.statusBarsPadding(),
-                navigationIcon = {
-                    IconButton(onClick = { onUpClick() }) {
-                        Icon(
-                            Icons.Filled.ArrowBack,
-                            contentDescription = null
-                        )
-                    }
-                },
-            )
+            GalleryTopBar(onUpClick = onUpClick)
         },
     ) { padding ->
         val pagingItems: LazyPagingItems<UnsplashPhoto> = plantPictures.collectAsLazyPagingItems()
@@ -109,6 +96,27 @@ private fun GalleryScreen(
     }
 }
 
+@Composable
+private fun GalleryTopBar(
+    onUpClick: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    TopAppBar(
+        title = {
+            Text(stringResource(id = R.string.gallery_title))
+        },
+        modifier = modifier.statusBarsPadding(),
+        navigationIcon = {
+            IconButton(onClick = onUpClick) {
+                Icon(
+                    Icons.Filled.ArrowBack,
+                    contentDescription = null
+                )
+            }
+        },
+    )
+}
+
 @Preview
 @Composable
 private fun GalleryScreenPreview(

app/src/main/java/com/google/samples/apps/sunflower/compose/garden/GardenScreen.kt

@@ -64,13 +64,15 @@ import java.util.*
 
 @Composable
 fun GardenScreen(
+    modifier: Modifier = Modifier,
     viewModel: GardenPlantingListViewModel = viewModel(),
     onAddPlantClick: () -> Unit,
     onPlantClick: (PlantAndGardenPlantings) -> Unit
 ) {
     val gardenPlants by viewModel.plantAndGardenPlantings.collectAsState(initial = emptyList())
     GardenScreen(
         gardenPlants = gardenPlants,
+        modifier = modifier,
         onAddPlantClick = onAddPlantClick,
         onPlantClick = onPlantClick
     )
@@ -79,26 +81,29 @@ fun GardenScreen(
 @Composable
 fun GardenScreen(
     gardenPlants: List<PlantAndGardenPlantings>,
+    modifier: Modifier = Modifier,
     onAddPlantClick: () -> Unit = {},
     onPlantClick: (PlantAndGardenPlantings) -> Unit = {}
 ) {
     if (gardenPlants.isEmpty()) {
-        EmptyGarden(onAddPlantClick)
+        EmptyGarden(onAddPlantClick, modifier)
     } else {
-        GardenList(gardenPlants, onPlantClick = onPlantClick)
+        GardenList(gardenPlants = gardenPlants, onPlantClick = onPlantClick, modifier = modifier)
     }
 }
 
 @Composable
 private fun GardenList(
     gardenPlants: List<PlantAndGardenPlantings>,
-    onPlantClick: (PlantAndGardenPlantings) -> Unit
+    onPlantClick: (PlantAndGardenPlantings) -> Unit,
+    modifier: Modifier = Modifier,
 ) {
     // Call reportFullyDrawn when the garden list has been rendered
     val gridState = rememberLazyGridState()
     ReportDrawnWhen { gridState.layoutInfo.totalItemsCount > 0 }
     LazyVerticalGrid(
         columns = GridCells.Fixed(2),
+        modifier,
         state = gridState,
         contentPadding = PaddingValues(
             horizontal = dimensionResource(id = R.dimen.card_side_margin),
@@ -203,11 +208,12 @@ private fun GardenListItem(
 }
 
 @Composable
-private fun EmptyGarden(onAddPlantClick: () -> Unit) {
+private fun EmptyGarden(onAddPlantClick: () -> Unit, modifier: Modifier = Modifier) {
     // Calls reportFullyDrawn when this composable is composed.
     ReportDrawn()
 
     Column(
+        modifier,
         horizontalAlignment = Alignment.CenterHorizontally,
         verticalArrangement = Arrangement.Center
     ) {