[UI/#51] 필터링 재설정 UI 구현

core/src/main/java/com/terning/core/designsystem/component/button/ChangeFilterButton.kt

@@ -0,0 +1,84 @@
+package com.terning.core.designsystem.component.button
+
+import androidx.annotation.StringRes
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.interaction.MutableInteractionSource
+import androidx.compose.foundation.interaction.collectIsPressedAsState
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.ripple.LocalRippleTheme
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import com.terning.core.designsystem.theme.Grey400
+import com.terning.core.designsystem.theme.TerningMain
+import com.terning.core.designsystem.theme.TerningSub1
+import com.terning.core.designsystem.theme.TerningSub5
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.designsystem.theme.White
+import com.terning.core.util.NoRippleTheme
+
+@Composable
+fun ChangeFilterButton(
+    isSelected: Boolean,
+    @StringRes text: Int,
+    cornerRadius: Dp,
+    paddingVertical: Dp,
+    onButtonClick: () -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    val interactionSource = remember { MutableInteractionSource() }
+    val isPressed by interactionSource.collectIsPressedAsState()
+    val backgroundColor = when {
+        !isSelected && !isPressed -> White
+        !isSelected && isPressed -> TerningSub5
+        else -> TerningMain
+    }
+    val textColor = when {
+        !isSelected -> Grey400
+        else -> White
+    }
+    val borderColor = when {
+        !isSelected && !isPressed -> TerningMain
+        !isSelected && isPressed -> TerningSub1
+        else -> TerningMain
+    }
+
+    CompositionLocalProvider(LocalRippleTheme provides NoRippleTheme) {
+        Button(
+            contentPadding = PaddingValues(vertical = paddingVertical),
+            modifier = modifier
+                .fillMaxWidth()
+                .wrapContentHeight(),
+            interactionSource = interactionSource,
+            colors = ButtonDefaults.buttonColors(
+                containerColor = backgroundColor,
+                contentColor = textColor,
+            ),
+            border = BorderStroke(
+                width = 1.dp,
+                color = borderColor
+            ),
+            shape = RoundedCornerShape(cornerRadius),
+            onClick = { onButtonClick() }
+        ) {
+            Text(
+                text = stringResource(id = text),
+                style = TerningTheme.typography.button3,
+                textAlign = TextAlign.Center,
+            )
+        }
+    }
+}

feature/src/main/java/com/terning/feature/home/changefilter/ChangeFilterRoute.kt

@@ -0,0 +1,148 @@
+package com.terning.feature.home.changefilter
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Scaffold
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import androidx.hilt.navigation.compose.hiltViewModel
+import androidx.navigation.NavController
+import com.terning.core.designsystem.component.button.RectangleButton
+import com.terning.core.designsystem.component.datepicker.DatePickerUI
+import com.terning.core.designsystem.component.topappbar.BackButtonTopAppBar
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.feature.R
+import com.terning.feature.home.changefilter.component.ChangeFilteringRadioGroup
+import com.terning.feature.home.changefilter.component.FilteringMainTitleText
+import com.terning.feature.home.changefilter.component.FilteringSubTitleText
+import com.terning.feature.home.home.HomeViewModel
+import com.terning.feature.home.home.model.InternFilterData
+import com.terning.feature.home.home.model.UserNameState
+import com.terning.feature.home.home.navigation.navigateHome
+import java.util.Calendar
+
+val currentYear = Calendar.getInstance().get(Calendar.YEAR)
+val currentMonth = Calendar.getInstance().get(Calendar.MONTH)
+
+@Composable
+fun ChangeFilterRoute(
+    navController: NavController,
+) {
+    ChangeFilterScreen(navController)
+}
+
+@Composable
+fun ChangeFilterScreen(
+    navController: NavController,
+    viewModel: HomeViewModel = hiltViewModel(),
+) {
+    Scaffold(
+        topBar = {
+            BackButtonTopAppBar(
+                title = stringResource(id = R.string.change_filter_top_bar_title),
+                onBackButtonClick = { navController.popBackStack() },
+                modifier = Modifier
+                    .shadow(elevation = 2.dp)
+            )
+        }
+    ) { paddingValues ->
+        Column(
+            modifier = Modifier
+                .padding(
+                    top = paddingValues.calculateTopPadding(),
+                )
+        ) {
+            ShowTitle(
+                mainTitle = stringResource(id = R.string.change_filter_grade_main),
+                subTitle = stringResource(id = R.string.filtering_status1_sub),
+                modifier = Modifier.padding(
+                    top = 31.dp,
+                    start = 24.dp,
+                    end = 24.dp
+                )
+            )
+            ChangeFilteringRadioGroup(
+                filterType = 0,
+                internFilterData = viewModel.userName.internFilter,
+                onButtonClick = { viewModel.setGrade(it) }
+            )
+
+            UserNameState(
+                userName = "남지우자랑스러운티엘이되",
+                internFilter = InternFilterData(
+                    grade = 4,
+                    workingPeriod = 1,
+                    startYear = 2024,
+                    startMonth = 7,
+                )
+            )
+
+            ShowTitle(
+                mainTitle = stringResource(id = R.string.filtering_status2_title),
+                subTitle = stringResource(id = R.string.filtering_status2_sub),
+                modifier = Modifier.padding(
+                    top = 39.dp,
+                    start = 24.dp,
+                    end = 24.dp
+                )
+            )
+            ChangeFilteringRadioGroup(
+                filterType = 1,
+                internFilterData = viewModel.userName.internFilter,
+                onButtonClick = { viewModel.setWorkingPeriod(it) }
+            )
+
+            ShowTitle(
+                mainTitle = stringResource(id = R.string.filtering_status3_title),
+                subTitle = stringResource(id = R.string.filtering_status3_sub),
+                modifier = Modifier.padding(
+                    top = 39.dp,
+                    start = 24.dp,
+                    end = 24.dp
+                )
+            )
+
+            Spacer(modifier = Modifier.weight(1f))
+            DatePickerUI(
+                chosenYear = currentYear,
+                chosenMonth = currentMonth,
+            )
+            Spacer(modifier = Modifier.weight(1f))
+
+            RectangleButton(
+                style = TerningTheme.typography.button0,
+                paddingVertical = 19.dp,
+                text = R.string.change_filter_save,
+                onButtonClick = {
+                    navController.navigateHome()
+                }
+            )
+        }
+    }
+}
+
+@Composable
+private fun ShowTitle(
+    mainTitle: String,
+    subTitle: String,
+    modifier: Modifier = Modifier,
+) {
+    FilteringMainTitleText(
+        text = mainTitle,
+        modifier = modifier.padding()
+    )
+    FilteringSubTitleText(
+        text = subTitle,
+        modifier = Modifier
+            .padding(
+                top = 3.dp,
+                bottom = 13.dp,
+                start = 24.dp,
+                end = 24.dp
+            )
+    )
+}

feature/src/main/java/com/terning/feature/home/changefilter/component/ChangeFilteringRadioGroup.kt

@@ -0,0 +1,81 @@
+package com.terning.feature.home.changefilter.component
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.foundation.lazy.grid.GridCells
+import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.foundation.lazy.grid.itemsIndexed
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableIntStateOf
+import androidx.compose.runtime.mutableStateListOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import com.terning.core.designsystem.component.button.ChangeFilterButton
+import com.terning.feature.R
+import com.terning.feature.home.home.model.InternFilterData
+
+@Composable
+fun ChangeFilteringRadioGroup(
+    filterType: Int,
+    internFilterData: InternFilterData?,
+    onButtonClick: (Int) -> Unit,
+    modifier: Modifier = Modifier,
+) {
+    val options = if (filterType == 0) {
+        listOf(
+            R.string.filtering_status1_button1,
+            R.string.filtering_status1_button2,
+            R.string.filtering_status1_button3,
+            R.string.filtering_status1_button4,
+        )
+    } else {
+        listOf(
+            R.string.filtering_status2_button1,
+            R.string.filtering_status2_button2,
+            R.string.filtering_status2_button3,
+        )
+    }
+
+    val selectedIndex = remember { mutableIntStateOf(0) }
+    var selectedButton = remember { mutableStateListOf(false, false, false, false) }
+
+    if (filterType == 0) {
+        selectedButton[
+            internFilterData?.grade ?: 0
+        ] = true
+    } else {
+        selectedButton[
+            internFilterData?.workingPeriod ?: 0
+        ] = true
+    }
+
+    LazyVerticalGrid(
+        columns = GridCells.Fixed(options.size),
+        horizontalArrangement = Arrangement.spacedBy(12.dp),
+        modifier = modifier
+            .fillMaxWidth()
+            .wrapContentHeight()
+            .padding(horizontal = 24.dp)
+
+    ) {
+        itemsIndexed(options) { index, option ->
+            ChangeFilterButton(
+                isSelected = selectedButton[index],
+                modifier = Modifier
+                    .wrapContentHeight(),
+                text = options[index],
+                cornerRadius = 10.dp,
+                paddingVertical = 10.dp,
+                onButtonClick = {
+                    selectedIndex.intValue = option
+                    selectedButton.indices.forEach { i -> selectedButton[i] = false }
+                    selectedButton[index] = true
+                    onButtonClick(index)
+                }
+            )
+        }
+    }
+}

feature/src/main/java/com/terning/feature/home/changefilter/navigation/ChangeFilterNavigation.kt

@@ -0,0 +1,30 @@
+package com.terning.feature.home.changefilter.navigation
+
+import androidx.navigation.NavController
+import androidx.navigation.NavGraphBuilder
+import androidx.navigation.NavHostController
+import androidx.navigation.NavOptions
+import androidx.navigation.compose.composable
+import com.terning.core.navigation.Route
+import com.terning.feature.home.changefilter.ChangeFilterRoute
+import kotlinx.serialization.Serializable
+
+fun NavController.navigateChangeFilter(navOptions: NavOptions? = null) {
+    navigate(
+        route = ChangeFilter,
+        navOptions = navOptions
+    )
+}
+
+fun NavGraphBuilder.changeFilterNavGraph(
+    navHostController: NavHostController
+) {
+    composable<ChangeFilter> {
+        ChangeFilterRoute(
+            navController = navHostController
+        )
+    }
+}
+
+@Serializable
+data object ChangeFilter : Route