divide viewmodel

composeApp/build.gradle.kts

@@ -17,17 +17,14 @@ kotlin {
             implementation(project(":core:syncer"))
             implementation(project(":core:platform"))
 
-            implementation(project(":feature:common"))
-            implementation(project(":feature:drawer"))
-            implementation(project(":feature:message"))
-            implementation(project(":feature:home"))
-            implementation(project(":feature:player"))
-            implementation(project(":feature:customtab"))
+            implementation(project(":ui:common"))
+            implementation(project(":ui:components"))
 
             implementation(libs.koin.core.viewmodel)
             implementation(libs.koin.compose.viewmodel)
 
             implementation(libs.navigation.compose)
+            implementation(libs.reorderable)
         }
 
         androidMain.dependencies {

composeApp/src/androidMain/kotlin/com/andannn/melodify/MainActivity.kt

@@ -24,12 +24,12 @@ import androidx.core.splashscreen.SplashScreen.Companion.installSplashScreen
 import androidx.lifecycle.Lifecycle
 import androidx.lifecycle.lifecycleScope
 import androidx.lifecycle.repeatOnLifecycle
-import com.andannn.melodify.feature.common.dialog.ConnectFailedAlertDialog
-import com.andannn.melodify.feature.common.theme.MelodifyTheme
+import com.andannn.melodify.ui.common.dialog.ConnectFailedAlertDialog
+import com.andannn.melodify.ui.common.theme.MelodifyTheme
 import android.graphics.Color
 import com.andannn.melodify.core.syncer.MediaLibrarySyncer
 import com.andannn.melodify.core.syncer.SyncJobService
-import com.andannn.melodify.feature.drawer.DrawerController
+import com.andannn.melodify.ui.components.drawer.DrawerController
 import io.github.aakira.napier.Napier
 import kotlinx.coroutines.flow.onEach
 import kotlinx.coroutines.launch

composeApp/src/androidMain/kotlin/com/andannn/melodify/Modules.android.kt

@@ -1,9 +1,9 @@
 package com.andannn.melodify
 
-import com.andannn.melodify.feature.drawer.DrawerController
-import com.andannn.melodify.feature.drawer.DrawerControllerImpl
-import com.andannn.melodify.feature.message.MessageController
-import com.andannn.melodify.feature.message.MessageControllerImpl
+import com.andannn.melodify.ui.components.drawer.DrawerController
+import com.andannn.melodify.ui.components.drawer.DrawerControllerImpl
+import com.andannn.melodify.ui.components.message.MessageController
+import com.andannn.melodify.ui.components.message.MessageControllerImpl
 import org.koin.core.module.Module
 import org.koin.core.module.dsl.scopedOf
 import org.koin.dsl.bind

composeApp/src/commonMain/kotlin/com/andannn/melodify/MelodifyAppState.kt

@@ -10,12 +10,12 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.rememberNavController
-import com.andannn.melodify.feature.common.util.getUiRetainedScope
-import com.andannn.melodify.feature.drawer.DrawerController
-import com.andannn.melodify.feature.message.MessageController
-import com.andannn.melodify.feature.message.dialog.Dialog
-import com.andannn.melodify.feature.message.dialog.InteractionResult
-import com.andannn.melodify.feature.message.dialog.navigateToDialog
+import com.andannn.melodify.ui.components.drawer.DrawerController
+import com.andannn.melodify.ui.components.message.MessageController
+import com.andannn.melodify.ui.components.message.dialog.Dialog
+import com.andannn.melodify.ui.components.message.dialog.InteractionResult
+import com.andannn.melodify.navigation.routes.navigateToDialog
+import com.andannn.melodify.ui.common.util.getUiRetainedScope
 import io.github.aakira.napier.Napier
 import kotlinx.coroutines.CancellationException
 import kotlinx.coroutines.CoroutineScope

composeApp/src/commonMain/kotlin/com/andannn/melodify/MelodifyMobileApp.kt

@@ -18,25 +18,18 @@ import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import com.andannn.melodify.feature.customtab.CustomTabSelector
-import com.andannn.melodify.feature.drawer.BottomDrawerContainer
-import com.andannn.melodify.feature.player.PlayerAreaView
-import com.andannn.melodify.feature.player.PlayerStateViewModel
-import com.andannn.melodify.feature.player.PlayerUiState
 import com.andannn.melodify.navigation.MelodifyNavHost
-import melodify.feature.common.generated.resources.Res
-import melodify.feature.common.generated.resources.library_title
+import com.andannn.melodify.ui.components.drawer.BottomDrawerContainer
+import com.andannn.melodify.ui.components.tabselector.CustomTabSelector
+import com.andannn.melodify.ui.components.playcontrol.ui.PlayerAreaView
+import melodify.ui.common.generated.resources.Res
+import melodify.ui.common.generated.resources.library_title
 import org.jetbrains.compose.resources.stringResource
-import org.koin.compose.viewmodel.koinViewModel
-import org.koin.core.parameter.parametersOf
 
 @Composable
 fun MelodifyMobileApp(
     modifier: Modifier = Modifier,
     appState: MelodifyAppState = rememberAppState(),
-    playerStateViewModel: PlayerStateViewModel = koinViewModel {
-        parametersOf(appState.drawerController)
-    },
 ) {
     ModalDrawer(
         drawerState = appState.drawerState,
@@ -57,13 +50,7 @@ fun MelodifyMobileApp(
                 onDialogResult = appState::onDialogResult,
             )
 
-            val playerUiState by playerStateViewModel.playerUiStateFlow.collectAsState()
-            if (playerUiState is PlayerUiState.Active) {
-                PlayerAreaView(
-                    state = playerUiState as PlayerUiState.Active,
-                    onEvent = playerStateViewModel::onEvent,
-                )
-            }
+            PlayerAreaView()
 
             val drawerController = appState.drawerController
             val bottomSheetModel by drawerController.bottomSheetModel.collectAsState(null)

composeApp/src/commonMain/kotlin/com/andannn/melodify/Modules.kt

@@ -3,8 +3,6 @@ package com.andannn.melodify
 import com.andannn.melodify.core.data.di.dataModule
 import com.andannn.melodify.core.platform.platformModule
 import com.andannn.melodify.core.syncer.di.syncerModule
-import com.andannn.melodify.feature.home.di.homeFeatureModule
-import com.andannn.melodify.feature.player.di.playerFeatureModule
 import org.koin.core.module.Module
 
 expect val uiScopedModule: Module
@@ -15,7 +13,4 @@ val modules: List<Module> = listOf(
     dataModule,
     syncerModule,
     platformModule,
-
-    homeFeatureModule,
-    playerFeatureModule,
 )

composeApp/src/commonMain/kotlin/com/andannn/melodify/navigation/MelodifyNavHost.kt

@@ -4,13 +4,13 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
-import com.andannn.melodify.feature.customtab.navigation.customTabSetting
-import com.andannn.melodify.feature.customtab.navigation.navigateToCustomTabSetting
-import com.andannn.melodify.feature.home.navigation.HOME_ROUTE
-import com.andannn.melodify.feature.home.navigation.homeScreen
-import com.andannn.melodify.feature.message.dialog.Dialog
-import com.andannn.melodify.feature.message.dialog.InteractionResult
-import com.andannn.melodify.feature.message.dialog.melodifyDialog
+import com.andannn.melodify.ui.components.message.dialog.Dialog
+import com.andannn.melodify.ui.components.message.dialog.InteractionResult
+import com.andannn.melodify.navigation.routes.melodifyDialog
+import com.andannn.melodify.navigation.routes.HOME_ROUTE
+import com.andannn.melodify.navigation.routes.customTabSetting
+import com.andannn.melodify.navigation.routes.homeScreen
+import com.andannn.melodify.navigation.routes.navigateToCustomTabSetting
 
 @Composable
 fun MelodifyNavHost(

feature/customtab/src/commonMain/kotlin/com/andannn.melodify/feature/customtab/CustomTabSettingScreen.kt → composeApp/src/commonMain/kotlin/com/andannn/melodify/navigation/routes/CustomTabSettingRoute.kt

@@ -1,4 +1,5 @@
-package com.andannn.melodify.feature.customtab
+package com.andannn.melodify.navigation.routes
+
 
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.animation.animateColorAsState
@@ -44,13 +45,34 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.style.TextDecoration
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
+import androidx.navigation.NavController
+import androidx.navigation.NavGraphBuilder
+import androidx.navigation.compose.composable
 import com.andannn.melodify.core.data.model.CustomTab
-import com.andannn.melodify.feature.common.util.getCategoryResource
-import com.andannn.melodify.feature.common.util.rememberSwapListState
+import com.andannn.melodify.ui.common.util.getCategoryResource
+import com.andannn.melodify.ui.common.util.rememberSwapListState
+import com.andannn.melodify.ui.components.tabselector.CustomTabSettingViewStateHolder
+import com.andannn.melodify.ui.components.tabselector.TabUiState
+import com.andannn.melodify.ui.components.tabselector.UiEvent
+import com.andannn.melodify.ui.components.tabselector.rememberCustomTabSettingViewStateHolder
 import kotlinx.collections.immutable.toImmutableList
 import org.jetbrains.compose.resources.stringResource
 import sh.calvin.reorderable.ReorderableItem
 
+const val CUSTOM_TAB_SETTING_ROUTE = "custom_tab_setting_route"
+
+fun NavController.navigateToCustomTabSetting() {
+    this.navigate(CUSTOM_TAB_SETTING_ROUTE)
+}
+
+fun NavGraphBuilder.customTabSetting(onBackPressed: () -> Unit) {
+    composable(
+        route = CUSTOM_TAB_SETTING_ROUTE,
+    ) {
+        CustomTabSettingScreen(onBackPressed = onBackPressed)
+    }
+}
+
 @Composable
 internal fun CustomTabSettingScreen(
     stateHolder: CustomTabSettingViewStateHolder = rememberCustomTabSettingViewStateHolder(),

feature/message/src/commonMain/kotlin/com/andannn/melodify/feature/message/dialog/DialogNavigation.kt → composeApp/src/commonMain/kotlin/com/andannn/melodify/navigation/routes/DialogNavigation.kt

@@ -1,4 +1,4 @@
-package com.andannn.melodify.feature.message.dialog
+package com.andannn.melodify.navigation.routes
 
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -9,15 +9,17 @@ import androidx.navigation.NavController
 import androidx.navigation.NavGraphBuilder
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.dialog
-import com.andannn.melodify.feature.message.dialog.ui.AlertMessageDialog
-import com.andannn.melodify.feature.message.dialog.ui.NewPlayListDialog
+import com.andannn.melodify.ui.components.message.dialog.Dialog
+import com.andannn.melodify.ui.components.message.dialog.InteractionResult
+import com.andannn.melodify.ui.components.message.dialog.ui.AlertMessageDialog
+import com.andannn.melodify.ui.components.message.dialog.ui.NewPlayListDialog
 import kotlinx.coroutines.flow.distinctUntilChanged
 import kotlinx.coroutines.flow.map
 
 internal const val DIALOG_ROUTE_PREFIX = "alert_dialog_route_"
 
 fun NavController.navigateToDialog(dialog: Dialog) {
-    this.navigate("$DIALOG_ROUTE_PREFIX${dialog.id}")
+    this.navigate("${DIALOG_ROUTE_PREFIX}${dialog.id}")
 }
 
 fun NavGraphBuilder.melodifyDialog(
@@ -27,7 +29,7 @@ fun NavGraphBuilder.melodifyDialog(
     onResult: (Dialog, InteractionResult) -> Unit
 ) {
     dialog(
-        route = "$DIALOG_ROUTE_PREFIX${dialog.id}",
+        route = "${DIALOG_ROUTE_PREFIX}${dialog.id}",
         dialogProperties = dialog.dialogProperties
     ) { entry ->
         var interaction by remember {

composeApp/src/commonMain/kotlin/com/andannn/melodify/navigation/routes/HomeRoute.kt

@@ -0,0 +1,118 @@
+package com.andannn.melodify.navigation.routes
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.rounded.Settings
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.material3.TopAppBarDefaults.enterAlwaysScrollBehavior
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.input.nestedscroll.nestedScroll
+import androidx.navigation.NavGraphBuilder
+import androidx.navigation.compose.composable
+import com.andannn.melodify.ui.components.tab.ReactiveTab
+import com.andannn.melodify.ui.components.tab.TabUiStateHolder
+import com.andannn.melodify.ui.components.tab.rememberTabUiStateHolder
+import com.andannn.melodify.ui.components.tabcontent.TabContent
+import com.andannn.melodify.ui.components.tabcontent.TabContentStateHolder
+import com.andannn.melodify.ui.components.tabcontent.rememberTabContentStateHolder
+
+const val HOME_ROUTE = "home_route"
+
+fun NavGraphBuilder.homeScreen(
+    onNavigateCustomTabSetting: () -> Unit
+) {
+    composable(route = HOME_ROUTE) {
+        HomeRoute(
+            onNavigateCustomTabSetting = onNavigateCustomTabSetting,
+        )
+    }
+}
+
+@Composable
+fun HomeRoute(
+    modifier: Modifier = Modifier,
+    onNavigateCustomTabSetting: () -> Unit = {},
+) {
+    HomeScreen(
+        modifier = modifier,
+        onSettingButtonClick = onNavigateCustomTabSetting
+    )
+}
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+private fun HomeScreen(
+    modifier: Modifier = Modifier,
+    onSettingButtonClick: () -> Unit = {},
+) {
+    val scrollBehavior = enterAlwaysScrollBehavior()
+    val scope = rememberCoroutineScope()
+    val tabUiStateHolder = rememberTabUiStateHolder(
+        scope = scope
+    )
+    val tabContentStateHolder = rememberTabContentStateHolder(
+        scope = scope,
+        selectedTab = tabUiStateHolder.state.selectedTab
+    )
+
+    Scaffold(
+        modifier = modifier,
+        topBar = {
+            TopAppBar(
+                colors =
+                TopAppBarDefaults.centerAlignedTopAppBarColors().run {
+                    copy(scrolledContainerColor = containerColor)
+                },
+                title = {
+                    Text(text = "Melodify")
+                },
+                actions = {
+                    IconButton(
+                        onClick = onSettingButtonClick,
+                        content = {
+                            Icon(Icons.Rounded.Settings, contentDescription = "")
+                        }
+                    )
+                },
+                scrollBehavior = scrollBehavior,
+            )
+        },
+    ) { padding ->
+        TabWithContent(
+            modifier = Modifier.padding(padding)
+                .nestedScroll(scrollBehavior.nestedScrollConnection)
+                .fillMaxSize(),
+            tabUiStateHolder = tabUiStateHolder,
+            tabContentStateHolder = tabContentStateHolder
+        )
+    }
+}
+
+@Composable
+fun TabWithContent(
+    modifier: Modifier = Modifier,
+    tabUiStateHolder: TabUiStateHolder,
+    tabContentStateHolder: TabContentStateHolder,
+) {
+    Column(
+        modifier = modifier
+    ) {
+        ReactiveTab(
+            stateHolder = tabUiStateHolder
+        )
+
+        TabContent(
+            stateHolder = tabContentStateHolder
+        )
+    }
+}