Merge pull request #31 from everymeals/feature/base

SsongSik · web-flow · commit b3622cc161e6 · 2023-07-27T18:40:11.000+09:00
[feature/base] BaseViewModel 및 State Hoisting 패턴 적용
diff --git a/presentation/src/main/java/com/everymeal/presentation/base/BaseViewModel.kt b/presentation/src/main/java/com/everymeal/presentation/base/BaseViewModel.kt
@@ -0,0 +1,44 @@
+package com.everymeal.presentation.base
+
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.viewModelScope
+import kotlinx.coroutines.channels.Channel
+import kotlinx.coroutines.flow.*
+import kotlinx.coroutines.launch
+
+abstract class BaseViewModel<S : ViewState, A : ViewSideEffect, E : ViewEvent>(
+    initialState: S
+) : ViewModel() {
+
+    abstract fun handleEvents(event: E)
+
+    private val _viewState: MutableStateFlow<S> = MutableStateFlow<S>(initialState)
+    val viewState = _viewState.asStateFlow()
+
+    private val currentState: S
+        get() = _viewState.value
+
+    private val _effect: Channel<A> = Channel()
+    val effect = _effect.receiveAsFlow()
+
+    private val _event: MutableSharedFlow<E> = MutableSharedFlow()
+
+    protected fun updateState(reducer: S.() -> S) {
+        val newState = currentState.reducer()
+        _viewState.value = newState
+    }
+
+    protected fun sendEffect(vararg builder: () -> A) {
+        for (effectValue in builder) {
+            viewModelScope.launch { _effect.send(effectValue()) }
+        }
+    }
+
+    open fun setEvent(event : E) {
+        deliverEvent(event)
+    }
+
+    private fun deliverEvent(event : E) = viewModelScope.launch {
+        handleEvents(event)
+    }
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/base/LoadState.kt b/presentation/src/main/java/com/everymeal/presentation/base/LoadState.kt
@@ -0,0 +1,7 @@
+package com.everymeal.presentation.base
+
+enum class LoadState {
+    SUCCESS,
+    LOADING,
+    ERROR
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/base/ViewEvent.kt b/presentation/src/main/java/com/everymeal/presentation/base/ViewEvent.kt
@@ -0,0 +1,4 @@
+package com.everymeal.presentation.base
+
+interface ViewEvent {
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/base/ViewSideEffect.kt b/presentation/src/main/java/com/everymeal/presentation/base/ViewSideEffect.kt
@@ -0,0 +1,4 @@
+package com.everymeal.presentation.base
+
+interface ViewSideEffect {
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/base/ViewState.kt b/presentation/src/main/java/com/everymeal/presentation/base/ViewState.kt
@@ -0,0 +1,4 @@
+package com.everymeal.presentation.base
+
+interface ViewState {
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/components/EveryMealButton.kt b/presentation/src/main/java/com/everymeal/presentation/components/EveryMealButton.kt
@@ -18,6 +18,7 @@ import androidx.compose.ui.unit.sp
 import com.everymeal.presentation.R
 import com.everymeal.presentation.ui.theme.Gray200
 import com.everymeal.presentation.ui.theme.Main100
+import com.everymeal.presentation.ui.theme.Main800
 
 @Composable
 fun EveryMealMainButton(
@@ -30,7 +31,10 @@ fun EveryMealMainButton(
             .fillMaxWidth()
             .padding(vertical = 16.dp),
         shape = RoundedCornerShape(12.dp),
-        colors = ButtonDefaults.buttonColors(containerColor = if(enabled) Main100 else Gray200),
+        colors = ButtonDefaults.buttonColors(
+            containerColor = if(enabled) Main100 else Gray200,
+            contentColor = Main800
+        ),
         enabled = enabled,
         onClick = onClick,
     ) {
diff --git a/presentation/src/main/java/com/everymeal/presentation/ui/signup/UnivSelectContract.kt b/presentation/src/main/java/com/everymeal/presentation/ui/signup/UnivSelectContract.kt
@@ -0,0 +1,36 @@
+package com.everymeal.presentation.ui.signup
+
+import com.everymeal.presentation.base.LoadState
+import com.everymeal.presentation.base.ViewEvent
+import com.everymeal.presentation.base.ViewSideEffect
+import com.everymeal.presentation.base.ViewState
+
+class UnivSelectContract {
+
+    /*
+    대학교 불러오기 LoadState
+    대학교 선택하기 State Hoisting
+     */
+    data class UnivSelectState(
+        val univSelectLoadState: LoadState = LoadState.SUCCESS,
+        val selectedUniv: String = ""
+    ) : ViewState
+
+    /*
+    선택하기 버튼 ViewEvent
+    대학교 선택하기 ViewEvent
+     */
+    sealed class UnivSelectEvent : ViewEvent {
+        object SelectButtonClicked : UnivSelectEvent()
+        data class SelectedUniv(
+            val selectedUniv: String
+        ) : UnivSelectEvent()
+    }
+
+    /*
+    메인 화면으로 이동 ViewSideEffect
+     */
+    sealed class UnivSelectEffect : ViewSideEffect {
+        object MoveToMain: UnivSelectEffect()
+    }
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/ui/signup/UnivSelectScreen.kt b/presentation/src/main/java/com/everymeal/presentation/ui/signup/UnivSelectScreen.kt
@@ -1,7 +1,10 @@
 package com.everymeal.presentation.ui.signup
 
+import android.annotation.SuppressLint
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -17,6 +20,10 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Icon
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
@@ -30,13 +37,15 @@ 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 androidx.hilt.navigation.compose.hiltViewModel
 import com.everymeal.presentation.R
 import com.everymeal.presentation.components.EveryMealMainButton
 import com.everymeal.presentation.ui.theme.EveryMeal_AndroidTheme
 import com.everymeal.presentation.ui.theme.Gray100
 import com.everymeal.presentation.ui.theme.Gray300
 import com.everymeal.presentation.ui.theme.Gray500
 import com.everymeal.presentation.ui.theme.Gray800
+import com.everymeal.presentation.ui.theme.Paddings
 
 data class Item(
     val Image: Int,
@@ -45,8 +54,11 @@ data class Item(
 
 @Composable
 fun UnivSelectScreen(
-    onSelectClick : () -> Unit
+    viewModel: UnivSelectViewModel = hiltViewModel(),
+    onUnivSelectClick : () -> Unit,
 ) {
+    val viewState by viewModel.viewState.collectAsState()
+
     val items = listOf(
         Item(Image = R.drawable.image_myongji, name = "명지대"),
         Item(Image = R.drawable.image_sungsin, name = "성신여대"),
@@ -62,7 +74,7 @@ fun UnivSelectScreen(
         Column(
             modifier = Modifier
                 .fillMaxSize()
-                .padding(horizontal = 24.dp)
+                .padding(horizontal = Paddings.extra)
         ) {
             Spacer(modifier = Modifier.padding(58.dp))
             Text(
@@ -78,14 +90,21 @@ fun UnivSelectScreen(
                 modifier = Modifier.weight(1f),
             ) {
                 items(items.size) { index ->
-                    UnivSelectItem(item = items[index])
+                    val item = items[index]
+                    val isSelected = viewState.selectedUniv == item.name
+                    UnivSelectItem(
+                        item = item,
+                        isSelected = isSelected,
+                    ) {
+                        viewModel.setEvent(UnivSelectContract.UnivSelectEvent.SelectedUniv(item.name))
+                    }
                 }
             }
             Row(
                 modifier = Modifier
                     .fillMaxWidth()
                     .background(Gray300, RoundedCornerShape(100.dp))
-                    .padding(horizontal = 24.dp, vertical = 14.dp),
+                    .padding(horizontal = Paddings.extra, vertical = 14.dp),
                 verticalAlignment = Alignment.CenterVertically,
             ) {
                 Icon(
@@ -115,21 +134,36 @@ fun UnivSelectScreen(
             }
             EveryMealMainButton(
                 text = stringResource(R.string.select),
-                enabled = false,
+                enabled = viewState.selectedUniv.isNotEmpty(),
             ) {
-                onSelectClick()
+                viewModel.setEvent(UnivSelectContract.UnivSelectEvent.SelectButtonClicked)
+            }
+        }
+    }
+
+    LaunchedEffect(key1 = viewModel.effect) {
+        viewModel.effect.collect { effect ->
+            when(effect) {
+                UnivSelectContract.UnivSelectEffect.MoveToMain -> {
+                    onUnivSelectClick()
+                }
             }
         }
     }
 }
 
+@SuppressLint("RememberReturnType")
 @Composable
-fun UnivSelectItem(item: Item) {
+fun UnivSelectItem(item: Item, isSelected: Boolean, onSelectClick: (Item) -> Unit) {
     Column(
         modifier = Modifier
-            .padding(8.dp)
-            .clip(RoundedCornerShape(8.dp))
-            .background(Gray100)
+            .clickable(
+                indication = null,
+                interactionSource = remember { MutableInteractionSource() }
+            ) { onSelectClick(item) }
+            .padding(Paddings.medium)
+            .clip(RoundedCornerShape(Paddings.medium))
+            .background(if (isSelected) Gray500 else Gray100)
             .fillMaxSize(),
         horizontalAlignment = Alignment.CenterHorizontally,
         verticalArrangement = Arrangement.Center
@@ -152,7 +186,9 @@ fun UnivSelectItem(item: Item) {
 @Composable
 fun UnivSelectScreenPreview() {
     EveryMeal_AndroidTheme {
-        UnivSelectScreen{ }
+        UnivSelectScreen {
+
+        }
     }
 }
 
@@ -161,8 +197,12 @@ fun UnivSelectScreenPreview() {
 fun UnivSelectScreenItemPreview() {
     EveryMeal_AndroidTheme {
         UnivSelectItem(item = Item(
-            Image = R.drawable.image_myongji,
-            name = "명지대학교"
-        ))
+                Image = R.drawable.image_myongji,
+                name = "명지대학교"
+            ),
+            false
+        ) {
+
+        }
     }
 }
diff --git a/presentation/src/main/java/com/everymeal/presentation/ui/signup/UnivSelectViewModel.kt b/presentation/src/main/java/com/everymeal/presentation/ui/signup/UnivSelectViewModel.kt
@@ -0,0 +1,29 @@
+package com.everymeal.presentation.ui.signup
+
+import com.everymeal.presentation.base.BaseViewModel
+import com.everymeal.presentation.ui.signup.UnivSelectContract.UnivSelectEvent
+import com.everymeal.presentation.ui.signup.UnivSelectContract.UnivSelectEffect
+import com.everymeal.presentation.ui.signup.UnivSelectContract.UnivSelectState
+import dagger.hilt.android.lifecycle.HiltViewModel
+import javax.inject.Inject
+
+@HiltViewModel
+class UnivSelectViewModel @Inject constructor(
+
+): BaseViewModel<UnivSelectState, UnivSelectEffect, UnivSelectEvent>(
+    UnivSelectState()
+) {
+
+    override fun handleEvents(event: UnivSelectEvent) {
+        when(event) {
+            is UnivSelectEvent.SelectButtonClicked -> {
+                sendEffect({ UnivSelectEffect.MoveToMain })
+            }
+            is UnivSelectEvent.SelectedUniv -> {
+                updateState { copy(
+                    selectedUniv = event.selectedUniv
+                ) }
+            }
+        }
+    }
+}
diff --git a/presentation/src/main/java/com/everymeal/presentation/ui/theme/Color.kt b/presentation/src/main/java/com/everymeal/presentation/ui/theme/Color.kt
@@ -16,4 +16,5 @@ val Gray300 = Color(0xFFF2F4F6)
 val Gray500 = Color(0xFFB0B8C1)
 var Gray800 = Color(0xFF4E5968)
 
-val Main100 = Color(0xFFFF4848)
+val Main100 = Color(0xFFFF4848)
+val Main800 = Color(0xFFCC3939)
