Merge pull request #57 from YAPP-Github/feature/MZ-176-ledger-filter

Feature/mz 176 ledger filter
YAPP-Github · Jan 12, 2024 · 7c62975 · 7c62975
2 parents 3d0787e + b721de2
commit 7c62975
Show file tree

Hide file tree

Showing 18 changed files with 334 additions and 6 deletions.
diff --git a/core/designsystem/src/main/java/com/susu/core/designsystem/component/button/RefreshButton.kt b/core/designsystem/src/main/java/com/susu/core/designsystem/component/button/RefreshButton.kt
@@ -0,0 +1,47 @@
+package com.susu.core.designsystem.component.button
+
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Icon
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.susu.core.designsystem.R
+import com.susu.core.designsystem.theme.Gray30
+import com.susu.core.designsystem.theme.SusuTheme
+import com.susu.core.ui.extension.susuClickable
+
+@Composable
+fun RefreshButton(
+    modifier: Modifier = Modifier,
+    onClick: () -> Unit = {},
+) {
+    Icon(
+        modifier = modifier
+            .border(
+                width = 1.dp,
+                color = Gray30,
+                shape = RoundedCornerShape(size = 100.dp),
+            )
+            .size(44.dp)
+            .clip(RoundedCornerShape(size = 100.dp))
+            .susuClickable(onClick = onClick)
+            .padding(SusuTheme.spacing.spacing_xs),
+        painter = painterResource(id = R.drawable.ic_refresh),
+        contentDescription = stringResource(R.string.content_description_refresh),
+    )
+}
+
+@Preview(showBackground = true)
+@Composable
+fun RefreshButtonPreview() {
+    SusuTheme {
+        RefreshButton()
+    }
+}
diff --git a/...src/main/java/com/susu/core/designsystem/component/container/SusuRecentSearchContainer.kt b/...src/main/java/com/susu/core/designsystem/component/container/SusuRecentSearchContainer.kt
@@ -59,7 +59,7 @@ fun SusuRecentSearchContainer(
                     .clip(CircleShape)
                     .susuClickable(onClick = onClickCloseIcon),
                 painter = painterResource(id = R.drawable.ic_recent_search_close),
-                contentDescription = stringResource(R.string.content_description_close_icon),
+                contentDescription = stringResource(com.susu.core.ui.R.string.content_description_close_icon),
             )
         }
     }

diff --git a/...src/main/java/com/susu/core/designsystem/component/textfieldbutton/SusuTextFieldButton.kt b/...src/main/java/com/susu/core/designsystem/component/textfieldbutton/SusuTextFieldButton.kt
@@ -346,7 +346,7 @@ private fun InnerButtons(
                 .clip(CircleShape)
                 .size(closeIconSize)
                 .susuClickable(onClick = onClickCloseIcon),
-            painter = painterResource(id = R.drawable.ic_close),
+            painter = painterResource(id = com.susu.core.ui.R.drawable.ic_close),
             contentDescription = "",
         )
     }

diff --git a/core/designsystem/src/main/java/com/susu/core/designsystem/theme/Spacing.kt b/core/designsystem/src/main/java/com/susu/core/designsystem/theme/Spacing.kt
@@ -19,6 +19,7 @@ internal val Spacing = SusuSpacing(
     spacing_xxl = 32.dp,
     spacing_xxxl = 36.dp,
     spacing_xxxxl = 40.dp,
+    spacing_xxxxxxl = 48.dp,
 )
 
 @Suppress("ConstructorParameterNaming")
@@ -37,6 +38,7 @@ data class SusuSpacing(
     val spacing_xxl: Dp,
     val spacing_xxxl: Dp,
     val spacing_xxxxl: Dp,
+    val spacing_xxxxxxl: Dp,
 )
 
 val LocalSpacing = staticCompositionLocalOf {
@@ -54,5 +56,6 @@ val LocalSpacing = staticCompositionLocalOf {
         spacing_xxl = Dp.Unspecified,
         spacing_xxxl = Dp.Unspecified,
         spacing_xxxxl = Dp.Unspecified,
+        spacing_xxxxxxl = Dp.Unspecified,
     )
 }
diff --git a/core/designsystem/src/main/res/drawable/ic_refresh.xml b/core/designsystem/src/main/res/drawable/ic_refresh.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M12,20C9.767,20 7.875,19.225 6.325,17.675C4.775,16.125 4,14.233 4,12C4,9.767 4.775,7.875 6.325,6.325C7.875,4.775 9.767,4 12,4C13.15,4 14.25,4.237 15.3,4.712C16.35,5.187 17.25,5.866 18,6.75V5C18,4.717 18.096,4.479 18.288,4.288C18.48,4.097 18.717,4.001 19,4C19.283,4 19.521,4.096 19.713,4.288C19.905,4.48 20.001,4.717 20,5V10C20,10.283 19.904,10.521 19.712,10.713C19.52,10.905 19.283,11.001 19,11H14C13.717,11 13.479,10.904 13.288,10.712C13.097,10.52 13.001,10.283 13,10C13,9.717 13.096,9.479 13.288,9.288C13.48,9.097 13.717,9.001 14,9H17.2C16.667,8.067 15.938,7.333 15.013,6.8C14.088,6.267 13.084,6 12,6C10.333,6 8.917,6.583 7.75,7.75C6.583,8.917 6,10.333 6,12C6,13.667 6.583,15.083 7.75,16.25C8.917,17.417 10.333,18 12,18C13.133,18 14.171,17.713 15.113,17.138C16.055,16.563 16.784,15.792 17.3,14.825C17.433,14.592 17.621,14.429 17.863,14.338C18.105,14.247 18.351,14.242 18.6,14.325C18.867,14.408 19.058,14.583 19.175,14.85C19.292,15.117 19.283,15.367 19.15,15.6C18.467,16.933 17.492,18 16.225,18.8C14.958,19.6 13.55,20 12,20Z"
+      android:fillColor="#000000"/>
+</vector>
diff --git a/core/designsystem/src/main/res/values/strings.xml b/core/designsystem/src/main/res/values/strings.xml
@@ -8,8 +8,8 @@
     <string name="money_unit">원</string>
     <string name="money_unit_format">%s원</string>
     <string name="content_description_search_icon">검색 아이콘</string>
-    <string name="content_description_close_icon">닫기 아이콘</string>
     <string name="content_description_back_icon">뒤로가기 아이콘</string>
     <string name="content_description_logo_image">로고 이미지</string>
     <string name="content_description_notification_icon">알림 아이콘</string>
+    <string name="content_description_refresh">새로고침</string>
 </resources>
diff --git a/core/ui/src/main/java/com/susu/core/ui/util/Date.kt b/core/ui/src/main/java/com/susu/core/ui/util/Date.kt
@@ -0,0 +1,12 @@
+package com.susu.core.ui.util
+
+import java.time.LocalDateTime
+import java.time.format.DateTimeFormatter
+
+val currentDate = LocalDateTime.now()
+
+@Suppress("detekt:FunctionNaming")
+fun LocalDateTime.to_yyyy_dot_MM_dot_dd(): String {
+    val formatter = DateTimeFormatter.ofPattern("yyyy.MM.dd")
+    return this.format(formatter)
+}
diff --git a/...system/src/main/res/drawable/ic_close.xml → core/ui/src/main/res/drawable/ic_close.xml b/...system/src/main/res/drawable/ic_close.xml → core/ui/src/main/res/drawable/ic_close.xml
diff --git a/core/ui/src/main/res/values/strings.xml b/core/ui/src/main/res/values/strings.xml
@@ -18,10 +18,12 @@
     <string name="word_category">카테고리</string>
     <string name="word_date">날짜</string>
     <string name="content_description_add_button">더하기 버튼</string>
+    <string name="content_description_close_icon">닫기 아이콘</string>
     <string name="word_input_yourself">직접 입력</string>
     <string name="word_male">남성</string>
     <string name="word_female">여성</string>
     <string name="word_birth">출생년도</string>
     <string name="word_next">다음</string>
     <string name="word_done">완료</string>
+    <string name="word_apply_filter">필터 적용하기</string>
 </resources>
diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainNavigator.kt
@@ -17,6 +17,7 @@ import com.susu.feature.received.navigation.ReceivedRoute
 import com.susu.feature.received.navigation.navigateLedgerAdd
 import com.susu.feature.received.navigation.navigateLedgerDetail
 import com.susu.feature.received.navigation.navigateLedgerEdit
+import com.susu.feature.received.navigation.navigateLedgerFilter
 import com.susu.feature.received.navigation.navigateLedgerSearch
 import com.susu.feature.received.navigation.navigateReceived
 import com.susu.feature.sent.navigation.SentRoute
@@ -39,7 +40,7 @@ internal class MainNavigator(
     val statusBarColor: Color
         @Composable
         get() = when (currentDestination?.route) {
-            in listOf(ReceivedRoute.ledgerSearchRoute) -> SusuTheme.colorScheme.background10
+            in listOf(ReceivedRoute.ledgerSearchRoute, ReceivedRoute.ledgerFilterRoute) -> SusuTheme.colorScheme.background10
             else -> SusuTheme.colorScheme.background15
         }
 
@@ -97,6 +98,10 @@ internal class MainNavigator(
         navController.navigateLedgerEdit()
     }
 
+    fun navigateLedgerFilter() {
+        navController.navigateLedgerFilter()
+    }
+
     fun navigateLedgerAdd() {
         navController.navigateLedgerAdd()
     }

diff --git a/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt b/feature/navigator/src/main/java/com/susu/feature/navigator/MainScreen.kt
@@ -70,6 +70,7 @@ internal fun MainScreen(
                     navigateLedgerSearch = navigator::navigateLedgerSearch,
                     navigateLedgerDetail = navigator::navigateLedgerDetail,
                     navigateLedgerEdit = navigator::navigateLedgerEdit,
+                    navigateLedgerFilter = navigator::navigateLedgerFilter,
                     navigateLedgerAdd = navigator::navigateLedgerAdd,
                 )
 

diff --git a/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailScreen.kt b/feature/received/src/main/java/com/susu/feature/received/ledgerdetail/LedgerDetailScreen.kt
@@ -186,7 +186,7 @@ fun LedgerDetailScreen(
 
 @Preview
 @Composable
-fun ReceivedScreenPreview() {
+fun LedgerDetailScreenPreview() {
     SusuTheme {
         LedgerDetailScreen()
     }

diff --git a/feature/received/src/main/java/com/susu/feature/received/ledgeredit/LedgerEditScreen.kt b/feature/received/src/main/java/com/susu/feature/received/ledgeredit/LedgerEditScreen.kt
@@ -170,7 +170,7 @@ fun LedgerEditScreen() {
 
 @Preview
 @Composable
-fun ReceivedScreenPreview() {
+fun LedgerEditScreenPreview() {
     SusuTheme {
         LedgerEditScreen()
     }

diff --git a/feature/received/src/main/java/com/susu/feature/received/ledgerfilter/LedgerFilterScreen.kt b/feature/received/src/main/java/com/susu/feature/received/ledgerfilter/LedgerFilterScreen.kt
@@ -0,0 +1,185 @@
+package com.susu.feature.received.ledgerfilter
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+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.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.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.susu.core.designsystem.component.appbar.SusuDefaultAppBar
+import com.susu.core.designsystem.component.appbar.icon.BackIcon
+import com.susu.core.designsystem.component.button.FilledButtonColor
+import com.susu.core.designsystem.component.button.LinedButtonColor
+import com.susu.core.designsystem.component.button.RefreshButton
+import com.susu.core.designsystem.component.button.SmallButtonStyle
+import com.susu.core.designsystem.component.button.SusuFilledButton
+import com.susu.core.designsystem.component.button.SusuLinedButton
+import com.susu.core.designsystem.component.button.XSmallButtonStyle
+import com.susu.core.designsystem.theme.Gray10
+import com.susu.core.designsystem.theme.SusuTheme
+import com.susu.core.ui.extension.susuClickable
+import com.susu.feature.received.R
+import com.susu.feature.received.ledgerfilter.component.DateText
+
+@Composable
+fun LedgerFilterRoute(
+    @Suppress("unused")
+    popBackStack: () -> Unit,
+) {
+    LedgerFilterScreen(
+        onClickBackIcon = popBackStack,
+    )
+}
+
+@Composable
+fun LedgerFilterScreen(
+    onClickBackIcon: () -> Unit = {},
+) {
+    Column(
+        modifier = Modifier
+            .background(SusuTheme.colorScheme.background10)
+            .fillMaxSize(),
+    ) {
+        SusuDefaultAppBar(
+            leftIcon = {
+                BackIcon(onClickBackIcon)
+            },
+            title = stringResource(id = com.susu.core.ui.R.string.word_filter),
+        )
+
+        Column(
+            modifier = Modifier.padding(
+                top = SusuTheme.spacing.spacing_xl,
+                start = SusuTheme.spacing.spacing_m,
+                end = SusuTheme.spacing.spacing_m,
+                bottom = SusuTheme.spacing.spacing_xxs,
+            ),
+        ) {
+            Text(text = stringResource(R.string.ledger_filter_screen_event_category), style = SusuTheme.typography.title_xs)
+            Spacer(modifier = Modifier.size(SusuTheme.spacing.spacing_m))
+            Row(
+                horizontalArrangement = Arrangement.spacedBy(SusuTheme.spacing.spacing_xxs),
+            ) {
+                SusuLinedButton(
+                    color = LinedButtonColor.Black,
+                    style = XSmallButtonStyle.height28,
+                    isActive = false,
+                    text = "결혼식",
+                )
+
+                SusuLinedButton(
+                    color = LinedButtonColor.Black,
+                    style = XSmallButtonStyle.height28,
+                    isActive = false,
+                    text = "돌잔치",
+                )
+
+                SusuLinedButton(
+                    color = LinedButtonColor.Black,
+                    style = XSmallButtonStyle.height28,
+                    isActive = false,
+                    text = "장례식",
+                )
+
+                SusuLinedButton(
+                    color = LinedButtonColor.Black,
+                    style = XSmallButtonStyle.height28,
+                    isActive = true,
+                    text = "생일 기념일",
+                )
+            }
+
+            Spacer(modifier = Modifier.size(SusuTheme.spacing.spacing_xxxxxxl))
+            Text(
+                text = stringResource(id = com.susu.core.ui.R.string.word_date),
+                style = SusuTheme.typography.title_xs,
+            )
+            Spacer(modifier = Modifier.size(SusuTheme.spacing.spacing_m))
+
+            Row(
+                verticalAlignment = Alignment.CenterVertically,
+            ) {
+                DateText()
+
+                Spacer(modifier = Modifier.size(SusuTheme.spacing.spacing_xxxxs))
+
+                Text(
+                    text = stringResource(R.string.ledger_filter_screen_from),
+                    style = SusuTheme.typography.title_xxs,
+                )
+
+                Spacer(modifier = Modifier.size(SusuTheme.spacing.spacing_m))
+
+                DateText()
+
+                Spacer(modifier = Modifier.size(SusuTheme.spacing.spacing_xxxxs))
+
+                Text(
+                    text = stringResource(R.string.ledger_filter_screen_until),
+                    style = SusuTheme.typography.title_xxs,
+                )
+            }
+
+            Spacer(modifier = Modifier.weight(1f))
+
+            Column(
+                verticalArrangement = Arrangement.spacedBy(SusuTheme.spacing.spacing_xxs),
+            ) {
+                SusuFilledButton(
+                    color = FilledButtonColor.Orange,
+                    style = XSmallButtonStyle.height28,
+                    text = "결혼식",
+                    isClickable = false,
+                    rightIcon = {
+                        Icon(
+                            modifier = Modifier
+                                .clip(CircleShape)
+                                .size(12.dp)
+                                .susuClickable { /* TODO */ },
+                            painter = painterResource(id = com.susu.core.ui.R.drawable.ic_close),
+                            contentDescription = stringResource(id = com.susu.core.ui.R.string.content_description_close_icon),
+                            tint = Gray10,
+                        )
+                    },
+                )
+
+                Row(
+                    modifier = Modifier.fillMaxWidth(),
+                    horizontalArrangement = Arrangement.spacedBy(SusuTheme.spacing.spacing_m),
+                ) {
+                    RefreshButton()
+
+                    SusuFilledButton(
+                        modifier = Modifier.fillMaxWidth(),
+                        color = FilledButtonColor.Black,
+                        style = SmallButtonStyle.height48,
+                        isActive = true,
+                        text = stringResource(com.susu.core.ui.R.string.word_apply_filter),
+                    )
+                }
+            }
+        }
+    }
+}
+
+@Preview
+@Composable
+fun LedgerFilterScreenPreview() {
+    SusuTheme {
+        LedgerFilterScreen()
+    }
+}