[ADD/#32] 공고 정렬 바텀시트 구현

core/src/main/java/com/terning/core/designsystem/component/bottomsheet/SortBy.kt

@@ -0,0 +1,12 @@
+package com.terning.core.designsystem.component.bottomsheet
+
+import androidx.annotation.StringRes
+import com.terning.core.R
+
+enum class SortBy(@StringRes val type: Int) {
+    EARLIEST(R.string.sort_by_earliest),
+    SHORTEST(R.string.sort_by_shortest),
+    LONGEST(R.string.sort_by_longest),
+    SCRAP(R.string.sort_by_scrap),
+    VIEW_COUNT(R.string.sort_by_view_count),
+}

core/src/main/java/com/terning/core/designsystem/component/bottomsheet/SortingBottomSheet.kt

@@ -0,0 +1,92 @@
+package com.terning.core.designsystem.component.bottomsheet
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.Text
+import androidx.compose.material3.rememberModalBottomSheetState
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
+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 com.terning.core.R
+import com.terning.core.designsystem.theme.Black
+import com.terning.core.designsystem.theme.Grey200
+import com.terning.core.designsystem.theme.Grey400
+import com.terning.core.designsystem.theme.TerningMain
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.extension.noRippleClickable
+import kotlinx.coroutines.launch
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+fun SortingBottomSheet(
+    modifier: Modifier = Modifier,
+    onDismiss: () -> Unit,
+    currentSortBy: Int,
+    newSortBy: MutableState<Int> = mutableStateOf(currentSortBy),
+) {
+    val scope = rememberCoroutineScope()
+    val sheetState = rememberModalBottomSheetState()
+    var currentSortBy by remember { mutableStateOf(currentSortBy) }
+
+    TerningBasicBottomSheet(
+        content = {
+            Text(
+                text = stringResource(id = R.string.sort_bottom_sheet_title),
+                style = TerningTheme.typography.title2,
+                color = Black,
+                modifier = modifier
+                    .padding(start = 27.dp, bottom = 16.dp)
+            )
+
+            HorizontalDivider(
+                thickness = 1.dp,
+                color = Grey200,
+                modifier = modifier.padding(horizontal = 24.dp)
+            )
+
+            LazyColumn(
+                modifier = modifier
+                    .padding(top = 12.dp, bottom = 19.dp)
+                    .padding(horizontal = 24.dp),
+                verticalArrangement = Arrangement.spacedBy(8.dp)
+            ) {
+                items(5) { sortIndex ->
+                    Text(
+                        text = stringResource(id = SortBy.entries[sortIndex].type),
+                        style = TerningTheme.typography.button3,
+                        color = if (currentSortBy == sortIndex) TerningMain else Grey400,
+                        textAlign = TextAlign.Start,
+                        modifier = modifier
+                            .fillMaxWidth()
+                            .padding(start = 3.dp)
+                            .padding(vertical = 12.dp)
+                            .noRippleClickable {
+                                newSortBy.value = sortIndex
+                                scope
+                                    .launch { sheetState.hide() }
+                                    .invokeOnCompletion {
+                                        if (!sheetState.isVisible) {
+                                            onDismiss()
+                                        }
+                                    }
+                            }
+                    )
+                }
+            }
+        },
+        onDismissRequest = { onDismiss() },
+        sheetState = sheetState
+    )
+}

core/src/main/java/com/terning/core/designsystem/component/bottomsheet/TerningBasicBottomSheet.kt

@@ -1,27 +1,27 @@
 package com.terning.core.designsystem.component.bottomsheet
 
-import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.SheetState
 import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import com.terning.core.designsystem.theme.White
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun TerningBasicBottomSheet(
     modifier: Modifier = Modifier,
     content: @Composable () -> Unit,
-    onDismissRequest: () -> Unit
+    onDismissRequest: () -> Unit,
+    sheetState: SheetState = rememberModalBottomSheetState()
 ) {
-    val sheetState = rememberModalBottomSheetState()
-
     ModalBottomSheet(
         onDismissRequest = {
             onDismissRequest()
         },
         sheetState = sheetState,
-        modifier = modifier.navigationBarsPadding()
+        containerColor = White,
     ) {
         content()
     }

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

@@ -0,0 +1,55 @@
+package com.terning.core.designsystem.component.button
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
+import com.terning.core.R
+import com.terning.core.designsystem.theme.Black
+import com.terning.core.designsystem.theme.TerningTheme
+import com.terning.core.extension.noRippleClickable
+
+@Composable
+fun SortingButton(
+    sortBy: Int = 0,
+    modifier: Modifier = Modifier,
+    onCLick: () -> Unit,
+) {
+    Row(
+        modifier = modifier
+            .noRippleClickable { onCLick() }
+    ) {
+        Text(
+            text = stringResource(
+                id = when (sortBy) {
+                    1 -> R.string.sort_by_shortest
+                    2 -> R.string.sort_by_longest
+                    3 -> R.string.sort_by_scrap
+                    4 -> R.string.sort_by_view_count
+                    else -> R.string.sort_by_earliest
+                }
+            ),
+            style = TerningTheme.typography.button3,
+            color = Black,
+            modifier = modifier
+                .padding(
+                    top = 6.dp,
+                    bottom = 5.dp,
+                    start = 12.dp,
+                )
+        )
+        Image(
+            painter = painterResource(id = R.drawable.ic_down),
+            contentDescription = stringResource(id = R.string.sort_button_description),
+            modifier = modifier
+                .padding(vertical = 5.dp)
+                .padding(end = 2.dp)
+        )
+    }
+}

core/src/main/res/drawable/ic_down.xml

@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="18dp"
+    android:height="18dp"
+    android:viewportWidth="18"
+    android:viewportHeight="18">
+  <path
+      android:pathData="M5,7L9,11L13,7"
+      android:strokeLineJoin="round"
+      android:strokeWidth="1.5"
+      android:fillColor="#00000000"
+      android:strokeColor="#000000"
+      android:strokeLineCap="round"/>
+</vector>

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

@@ -11,4 +11,13 @@
     <!-- button-->
     <string name="button_preview">button</string>
 
+    <!-- 정렬 버튼 + 바텀시트 -->
+    <string name="sort_by_earliest">채용 마감 이른순</string>
+    <string name="sort_by_shortest">짧은 근무 기간순</string>
+    <string name="sort_by_longest">긴 근무 기간순</string>
+    <string name="sort_by_scrap">스크랩 많은순</string>
+    <string name="sort_by_view_count">조회수 많은순</string>
+    <string name="sort_button_description">정렬 기준</string>
+    <string name="sort_bottom_sheet_title">공고 정렬 순서</string>
+
 </resources>

feature/src/main/java/com/terning/feature/onboarding/signup/component/SignUpBottomSheet.kt

@@ -9,6 +9,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -25,6 +26,7 @@ import com.terning.core.designsystem.theme.TerningTheme
 import com.terning.core.extension.noRippleClickable
 import com.terning.feature.R
 
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun SignUpBottomSheet(
     modifier: Modifier = Modifier,