Refactor/#305 refactor screens and fix bugs

app/build.gradle.kts

@@ -14,7 +14,7 @@ android {
 
     defaultConfig {
         applicationId = "com.moscow.tudee"
-        minSdk = 26
+        minSdk = 21
         targetSdk = 35
         versionCode = 1
         versionName = "1.0"

app/src/main/java/com/moscow/tudee/presentation/component/AddEditTask.kt

@@ -33,6 +33,7 @@ import com.moscow.tudee.domain.entity.Task.Priority
 import com.moscow.tudee.presentation.component.bottomSheet.TudeeBottomSheet
 import com.moscow.tudee.presentation.designSystem.theme.Theme
 import com.moscow.tudee.presentation.model.CategoryUi
+import com.moscow.tudee.presentation.screen.category.component.CategoryCard
 import com.moscow.tudee.presentation.util.getPredefinedIconRes
 import kotlin.math.max
 
@@ -219,6 +220,9 @@ fun TaskBottomSheet(
                                         label = category.titleRes?.let { stringResource(category.titleRes) }
                                             ?: category.title,
                                         selected = selectedCategory?.id == category.id,
+                                        isPredefined = category.isPredefined,
+                                        iconTint = Color.Unspecified,
+                                        count = -1,
                                         modifier = Modifier
                                             .fillMaxWidth()
                                             .clickable {

app/src/main/java/com/moscow/tudee/presentation/component/EmptyScreen.kt

@@ -31,7 +31,8 @@ import com.moscow.tudee.presentation.designSystem.theme.TudeeTheme
 @Composable
 fun EmptyScreen(
     modifier: Modifier = Modifier,
-    title: String = stringResource(R.string.no_tasks_here)
+    title: String = stringResource(R.string.no_tasks_here),
+    description: String = stringResource(R.string.tap_the_button_to_add_your_first_one)
 ) {
     Box(
         modifier = modifier,
@@ -62,6 +63,47 @@ fun EmptyScreen(
             )
         }
         MessageBox(
+            title = title,
+            modifier = Modifier.padding(bottom = 90.dp, end = 147.dp),
+            description = description
+        )
+    }
+}
+
+@Composable
+fun CategoryEmptyScreen(
+    modifier: Modifier = Modifier,
+    title: String = stringResource(R.string.no_tasks_here)
+) {
+    Box(
+        modifier = modifier,
+        contentAlignment = Alignment.BottomEnd,
+    ) {
+        Box(
+            modifier = Modifier
+                .padding(top = 12.dp, end = 18.dp)
+                .height(149.dp)
+                .width(148.dp)
+        ) {
+            Image(
+                painter = painterResource(R.drawable.circle_background),
+                contentDescription = "circle background",
+                contentScale = ContentScale.Crop,
+                modifier = Modifier
+                    .fillMaxSize()
+                    .padding(end = 5.dp)
+            )
+            Image(
+                painter = painterResource(R.drawable.im_robot_normal),
+                contentDescription = "normal robot",
+                modifier = Modifier.padding(top = 45.dp, start = 42.dp)
+            )
+            ColumnOfDots(
+                modifier = Modifier
+                    .padding(top = 65.dp, start = 19.dp)
+            )
+        }
+        MessageBoxTitleOnly(
             title = title,
             modifier = Modifier.padding(bottom = 90.dp, end = 147.dp)
         )
@@ -95,6 +137,7 @@ fun ColumnOfDots(modifier: Modifier = Modifier) {
 @Composable
 fun MessageBox(
     title: String,
+    description: String,
     modifier: Modifier = Modifier,
 ) {
     Column(
@@ -111,21 +154,49 @@ fun MessageBox(
                 Theme.colors.surfaceHigh,
                 RoundedCornerShape(topEnd = 16.dp, topStart = 16.dp, bottomStart = 16.dp)
             )
-            .padding(vertical = 12.dp, horizontal = 8.dp)
+            .padding(vertical = 8.dp, horizontal = 12.dp)
     ) {
         Text(
             text = title,
             style = Theme.textStyle.title.small,
             color = Theme.colors.body
         )
         Text(
-            text = stringResource(R.string.tap_the_button_to_add_your_first_one),
+            text = description,
             style = Theme.textStyle.body.small,
             color = Theme.colors.hint
         )
     }
 }
 
+@Composable
+fun MessageBoxTitleOnly(
+    title: String,
+    modifier: Modifier = Modifier
+) {
+    Column(
+        horizontalAlignment = Alignment.Start,
+        modifier = modifier
+            .shadow(
+                4.dp,
+                RoundedCornerShape(topEnd = 16.dp, topStart = 16.dp, bottomStart = 16.dp),
+                ambientColor = Theme.colors.body,
+                spotColor = Theme.colors.hint
+            )
+            .background(
+                Theme.colors.surfaceHigh,
+                RoundedCornerShape(topEnd = 16.dp, topStart = 16.dp, bottomStart = 16.dp)
+            )
+            .padding(vertical = 8.dp, horizontal = 12.dp)
+    ) {
+        Text(
+            text = title,
+            style = Theme.textStyle.title.small,
+            color = Theme.colors.body
+        )
+    }
+}
+
 @Preview(apiLevel = 33, uiMode = UI_MODE_NIGHT_NO)
 @Preview(apiLevel = 33, uiMode = UI_MODE_NIGHT_YES)
 @Composable
@@ -136,7 +207,6 @@ private fun EmptyScreenPreview() {
             modifier = Modifier.background(Theme.colors.surface)
         )
     }
-
 }
 
 @Preview
@@ -145,7 +215,6 @@ private fun ColumnOfDotsPreview() {
     TudeeTheme {
         ColumnOfDots()
     }
-
 }
 
 @Preview(apiLevel = 33)
@@ -154,7 +223,18 @@ private fun MessageBoxPreview() {
     TudeeTheme {
         MessageBox(
             title = "blablabla",
+            description = "nnnnnnnnnnnnnnnnn"
         )
     }
+}
 
-}
+@Preview(apiLevel = 33)
+@Composable
+private fun CategoryEmptyScreenPreview() {
+    TudeeTheme {
+        CategoryEmptyScreen(
+            title = "No tasks in this category",
+            modifier = Modifier.background(Theme.colors.surface)
+        )
+    }
+}

app/src/main/java/com/moscow/tudee/presentation/component/TaskCard.kt

@@ -7,19 +7,23 @@ import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 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.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Icon
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.style.TextOverflow
@@ -62,13 +66,40 @@ fun TaskCard(
                 rememberAsyncImagePainter(category.iconUrl)
             }
 
-            Image(
-                painter = iconPainter,
-                contentDescription = stringResource(R.string.task_card_icon),
-                modifier = Modifier
-                    .size(56.dp)
-                    .padding(12.dp)
-            )
+            AnimatedVisibility(
+                visible = category.isPredefined,
+                enter = fadeIn(),
+                exit = fadeOut()
+            ) {
+                Image(
+                    painter = iconPainter,
+                    contentDescription = stringResource(R.string.task_card_icon),
+                    modifier = Modifier
+                        .size(56.dp)
+                        .padding(12.dp)
+                )
+            }
+
+            AnimatedVisibility(
+                visible = !category.isPredefined,
+                enter = fadeIn(),
+                exit = fadeOut()
+            ) {
+                Box(
+                    modifier = Modifier
+                        .padding(4.dp)
+                        .size(56.dp),
+                    contentAlignment = Alignment.Center
+                ) {
+                    Image(
+                        painter = iconPainter,
+                        contentDescription = stringResource(R.string.category_icon),
+                        contentScale = ContentScale.Crop,
+                        modifier = Modifier
+                            .size(32.dp)
+                    )
+                }
+            }
 
             Spacer(modifier = Modifier.weight(1f))
 

app/src/main/java/com/moscow/tudee/presentation/screen/category/categoryTasksScreen/CategoryTasksScreen.kt

@@ -1,7 +1,6 @@
 package com.moscow.tudee.presentation.screen.category.categoryTasksScreen
 
 import android.net.Uri
-import android.text.TextUtils.substring
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
@@ -23,7 +22,7 @@ import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.moscow.tudee.R
 import com.moscow.tudee.domain.entity.Task
 import com.moscow.tudee.presentation.base.ObserveAsEvent
-import com.moscow.tudee.presentation.component.EmptyScreen
+import com.moscow.tudee.presentation.component.CategoryEmptyScreen
 import com.moscow.tudee.presentation.component.TaskCard
 import com.moscow.tudee.presentation.component.TopBar
 import com.moscow.tudee.presentation.designSystem.theme.Theme
@@ -35,7 +34,6 @@ import com.moscow.tudee.presentation.screen.category.component.CategorySnackBar
 import com.moscow.tudee.presentation.screen.category.component.CategoryTabs
 import com.moscow.tudee.presentation.screen.category.component.DeleteCategoryBottomSheet
 import com.moscow.tudee.presentation.screen.category.component.TabItem
-import kotlinx.datetime.LocalDate
 import kotlinx.datetime.LocalDateTime
 import org.koin.androidx.compose.koinViewModel
 import org.koin.core.parameter.parametersOf
@@ -112,7 +110,7 @@ private fun TasksTopBar(
             modifier = Modifier
                 .background(Theme.colors.surfaceHigh)
                 .statusBarsPadding(),
-            title = uiState.category.title,
+            title = uiState.category.titleRes?.let { stringResource(uiState.category.titleRes) } ?: uiState.category.title ,
             startIcon = painterResource(id = R.drawable.ic_arrow_head_back),
             endIcon = if (uiState.category.isPredefined) null else painterResource(id = R.drawable.ic_pencil_edit),
             onEndClick = listener::onShowEditCategoryBottomSheet,
@@ -140,7 +138,12 @@ private fun TasksList(uiState: CategoriesScreenState, modifier: Modifier = Modif
                     .padding(10.dp),
                 contentAlignment = androidx.compose.ui.Alignment.Center
             ) {
-                EmptyScreen()
+                CategoryEmptyScreen(
+                    title = stringResource(
+                        R.string.no_tasks_in_reading_category,
+                        uiState.category.titleRes?.let { stringResource(uiState.category.titleRes) } ?: uiState.category.title
+                    )
+                )
             }
         } else {
             LazyColumn(
@@ -166,7 +169,7 @@ private fun TasksList(uiState: CategoriesScreenState, modifier: Modifier = Modif
     }
 }
 
-private fun formatDate(date : LocalDateTime): String{
+private fun formatDate(date: LocalDateTime): String {
     val currentDate = date.toString()
     return currentDate.substring(startIndex = 0, endIndex = currentDate.indexOf('T'))
 }

app/src/main/java/com/moscow/tudee/presentation/screen/category/component/CategoryCard.kt

@@ -1,6 +1,5 @@
 package com.moscow.tudee.presentation.screen.category.component
 
-import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.animateContentSize
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
@@ -87,7 +86,6 @@ fun CategoryCard(
                         contentScale = ContentScale.Crop,
                         modifier = Modifier
                             .fillMaxSize()
-                            .padding(8.dp)
                             .clip(CircleShape)
                     )
                 }

app/src/main/res/values-ar/strings.xml

@@ -122,4 +122,5 @@
     <string name="budgeting">ميزانية</string>
     <string name="self_care">عناية شخصية</string>
     <string name="event">حدث</string>
+    <string name="no_tasks_in_reading_category">لا توجد مهام في فئة %1$s!</string>
 </resources>

app/src/main/res/values/strings.xml

@@ -120,4 +120,5 @@
     <string name="budgeting">budgeting</string>
     <string name="self_care">self-care</string>
     <string name="event">event</string>
+    <string name="no_tasks_in_reading_category">No tasks in %1$s category!</string>
 </resources>