feat(settings-ui): init general settings

flixclusiveorg · Nov 25, 2024 · 0019f96 · 0019f96
1 parent 4018f0f
commit 0019f96
Show file tree

Hide file tree

Showing 16 changed files with 1,118 additions and 3 deletions.
diff --git a/.idea/gradle.xml b/.idea/gradle.xml
diff --git a/feature/mobile/settings/build.gradle.kts b/feature/mobile/settings/build.gradle.kts
@@ -10,8 +10,11 @@ android {
 }
 
 dependencies {
-    implementation(projects.data.user)
+    implementation(projects.core.datastore)
     implementation(projects.core.ui.mobile)
+    implementation(projects.data.searchHistory)
+    implementation(projects.data.user)
+    implementation(projects.domain.provider)
 
     implementation(libs.compose.adaptive)
     implementation(libs.compose.adaptive.layout)

diff --git a/...e/mobile/settings/src/main/kotlin/com/flixclusive/feature/mobile/settings/SettingsItem.kt b/...e/mobile/settings/src/main/kotlin/com/flixclusive/feature/mobile/settings/SettingsItem.kt
@@ -0,0 +1,30 @@
+package com.flixclusive.feature.mobile.settings
+
+import androidx.compose.runtime.Composable
+
+internal const val KEY_PREFERRED_SERVER_DIALOG = "isPreferredServerDialogOpen"
+internal const val KEY_SUBTITLE_LANGUAGE_DIALOG = "isSubtitleLanguageDialogOpen"
+internal const val KEY_SUBTITLE_COLOR_DIALOG = "isSubtitleColorDialogOpen"
+internal const val KEY_SUBTITLE_BACKGROUND_COLOR_DIALOG = "isSubtitleBackgroundDialogOpen"
+internal const val KEY_SUBTITLE_SIZE_DIALOG = "isSubtitleSizeDialogOpen"
+internal const val KEY_SUBTITLE_FONT_STYLE_DIALOG = "isSubtitleFontStyleDialogOpen"
+internal const val KEY_SUBTITLE_EDGE_TYPE_DIALOG = "isSubtitleEdgeTypeDialogOpen"
+internal const val KEY_PLAYER_QUALITY_DIALOG = "isPlayerQualityDialogOpen"
+internal const val KEY_PLAYER_SEEK_INCREMENT_MS_DIALOG = "isPlayerSeekIncrementDialogOpen"
+internal const val KEY_PLAYER_RESIZE_MODE_DIALOG = "isPlayerResizeModeDialogOpen"
+internal const val KEY_PLAYER_BUFFER_LENGTH_DIALOG = "isPlayerBufferLengthOpen"
+internal const val KEY_PLAYER_BUFFER_SIZE_DIALOG = "isPlayerBufferSizeDialogOpen"
+internal const val KEY_PLAYER_DISK_CACHE_DIALOG = "isPlayerDiskCacheDialogOpen"
+internal const val KEY_DOH_DIALOG = "isDoHDialogOpen"
+internal const val KEY_SEARCH_HISTORY_NOTICE_DIALOG = "isSearchHistoryNoticeDialogOpen"
+internal const val KEY_AUDIO_LANGUAGE_DIALOG = "isAudioLanguageDialogOpen"
+internal const val KEY_DECODER_PRIORITY_DIALOG = "isDecoderPriorityDialogOpen"
+
+internal data class SettingsItem(
+    val title: String,
+    val description: String? = null,
+    val enabled: Boolean = true,
+    val dialogKey: String? = null,
+    val onClick: (() -> Unit)? = null,
+    val content: @Composable () -> Unit = {},
+)
diff --git a/...tings/src/main/kotlin/com/flixclusive/feature/mobile/settings/component/BaseItemButton.kt b/...tings/src/main/kotlin/com/flixclusive/feature/mobile/settings/component/BaseItemButton.kt
@@ -0,0 +1,98 @@
+package com.flixclusive.feature.mobile.settings.component
+
+import androidx.compose.animation.animateColorAsState
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.getValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.flixclusive.core.ui.common.util.onMediumEmphasis
+
+@Composable
+internal fun BaseItemButton(
+    title: String,
+    description: String?,
+    enabled: Boolean = true,
+    onClick: () -> Unit,
+    content: @Composable () -> Unit,
+) {
+    val color by animateColorAsState(
+        targetValue = if (enabled) Color.White else Color.Gray,
+        label = ""
+    )
+
+    CompositionLocalProvider(
+        LocalContentColor provides color
+    ) {
+        Box(
+            modifier = Modifier
+                .clickable(
+                    enabled = enabled,
+                    onClick = onClick
+                )
+        ) {
+            Row(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .heightIn(min = 60.dp)
+                    .padding(
+                        horizontal = 15.dp,
+                        vertical = 8.dp
+                    ),
+                verticalAlignment = Alignment.CenterVertically
+            ) {
+                Column(
+                    verticalArrangement = Arrangement.spacedBy(
+                        space = 3.dp,
+                        alignment = Alignment.CenterVertically
+                    ),
+                    modifier = Modifier
+                        .weight(1F)
+                        .padding(end = 15.dp)
+                ) {
+                    Text(
+                        text = title,
+                        style = MaterialTheme.typography.titleSmall.copy(
+                            fontWeight = FontWeight.Normal,
+                            fontSize = 16.sp
+                        ),
+                        maxLines = 2,
+                        overflow = TextOverflow.Ellipsis,
+                        modifier = Modifier
+                            .fillMaxWidth()
+                    )
+
+                    description?.let {
+                        Text(
+                            text = it,
+                            style = MaterialTheme.typography.labelMedium.copy(
+                                fontWeight = FontWeight.Normal,
+                                fontSize = 12.sp,
+                                color = LocalContentColor.current.onMediumEmphasis()
+                            ),
+                            modifier = Modifier.fillMaxWidth()
+                        )
+                    }
+                }
+
+                content()
+            }
+        }
+    }
+}
diff --git a/...ttings/src/main/kotlin/com/flixclusive/feature/mobile/settings/component/BaseSubScreen.kt b/...ttings/src/main/kotlin/com/flixclusive/feature/mobile/settings/component/BaseSubScreen.kt
@@ -1,10 +1,81 @@
 package com.flixclusive.feature.mobile.settings.component
 
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.LazyListScope
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.flixclusive.core.theme.FlixclusiveTheme
+import com.flixclusive.core.ui.common.util.onMediumEmphasis
 
 @Composable
 internal fun BaseSubScreen(
-    label: String
+    title: String,
+    description: String,
+    content: LazyListScope.() -> Unit
 ) {
+    LazyColumn {
+        item {
+            SubScreenHeader(
+                title = title,
+                description = description
+            )
+        }
 
+        content.invoke(this@LazyColumn)
+    }
+}
+
+@Composable
+internal fun SubScreenHeader(
+    title: String,
+    description: String,
+) {
+    Column(
+        verticalArrangement = Arrangement.spacedBy(15.dp)
+    ) {
+        Text(
+            text = title,
+            style = MaterialTheme.typography.headlineLarge.copy(
+                fontSize = 24.sp,
+                fontWeight = FontWeight.Black
+            )
+        )
+
+        Text(
+            text = description,
+            style = MaterialTheme.typography.labelLarge.copy(
+                fontWeight = FontWeight.Medium,
+                color = LocalContentColor.current.onMediumEmphasis()
+            )
+        )
+    }
+}
+
+@Preview
+@Composable
+private fun BaseSubScreenPreview() {
+    FlixclusiveTheme {
+        Surface(
+            modifier = Modifier
+                .fillMaxSize()
+        ) {
+            BaseSubScreen(
+                title = "General",
+                description = """
+                    This contains all the general settings that are not related any of the specified groups on the settings navigation.
+                """.trimIndent()
+            ) {}
+        }
+    }
 }
diff --git a/...ttings/src/main/kotlin/com/flixclusive/feature/mobile/settings/component/SettingsGroup.kt b/...ttings/src/main/kotlin/com/flixclusive/feature/mobile/settings/component/SettingsGroup.kt
@@ -0,0 +1,57 @@
+package com.flixclusive.feature.mobile.settings.component
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.surfaceColorAtElevation
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import com.flixclusive.core.ui.common.util.onMediumEmphasis
+import com.flixclusive.feature.mobile.settings.SettingsItem
+
+@Composable
+internal fun SettingsGroup(
+    items: List<SettingsItem>,
+    onItemClick: (SettingsItem) -> Unit = {},
+) {
+    Box(
+        modifier = Modifier
+            .background(
+                color = MaterialTheme.colorScheme.surfaceColorAtElevation(3.dp),
+                shape = RoundedCornerShape(10.dp)
+            )
+    ) {
+        Column {
+            Spacer(modifier = Modifier.padding(vertical = 5.dp))
+
+            items.forEachIndexed { i, item ->
+                BaseItemButton(
+                    title = item.title,
+                    description = item.description?.replace("_", " "),
+                    content = item.content,
+                    enabled = item.enabled,
+                    onClick = {
+                        onItemClick(item)
+                    }
+                )
+
+                if (i < items.lastIndex)
+                    HorizontalDivider(
+                        modifier = Modifier
+                            .padding(horizontal = 10.dp),
+                        thickness = 0.5.dp,
+                        color = LocalContentColor.current.onMediumEmphasis(emphasis = 0.15F)
+                    )
+            }
+
+            Spacer(modifier = Modifier.padding(vertical = 5.dp))
+        }
+    }
+}