Change Tag to Chip and create chip choose func

app/src/main/AndroidManifest.xml

@@ -38,6 +38,7 @@
         </activity>
 
         <activity android:name=".activity.MainActivity" />
+
         <service android:name=".service.ForegroundService" />
 
     </application>

app/src/main/kotlin/team/bravepeople/devevent/activity/main/MainActivity.kt

@@ -66,11 +66,12 @@ import team.bravepeople.devevent.theme.MaterialTheme
 import team.bravepeople.devevent.theme.SystemUiController
 import team.bravepeople.devevent.theme.colors
 import team.bravepeople.devevent.theme.defaultFontFamily
+import team.bravepeople.devevent.ui.chip.ChipViewModel
+import team.bravepeople.devevent.ui.chip.FlowTag
 import team.bravepeople.devevent.ui.fancybottombar.FancyBottomBar
 import team.bravepeople.devevent.ui.fancybottombar.FancyColors
 import team.bravepeople.devevent.ui.fancybottombar.FancyItem
 import team.bravepeople.devevent.ui.fancybottombar.FancyOptions
-import team.bravepeople.devevent.ui.tag.FlowTag
 import team.bravepeople.devevent.util.extension.toast
 
 private enum class Tab {
@@ -81,6 +82,7 @@ private enum class Tab {
 class MainActivity : ComponentActivity() {
 
     private var tab by mutableStateOf(Tab.Event)
+    private val chipVm = ChipViewModel.instance
     private val eventVm = EventViewModel.instance
     private val repositoryVm: RepositoryViewModel by viewModels()
 
@@ -116,7 +118,10 @@ class MainActivity : ComponentActivity() {
                         modifier = Modifier
                             .fillMaxWidth()
                             .wrapContentHeight(),
-                        tags = tags
+                        tags = tags,
+                        onClick = {
+                            chipVm.toggleChipSelected(this)
+                        }
                     )
                 }
             )

app/src/main/kotlin/team/bravepeople/devevent/activity/main/event/LazyEvent.kt

@@ -60,14 +60,15 @@ import team.bravepeople.devevent.repo.RepositoryViewModel
 import team.bravepeople.devevent.theme.ColorOrange
 import team.bravepeople.devevent.theme.colors
 import team.bravepeople.devevent.ui.bottomsheet.BottomSheet
-import team.bravepeople.devevent.ui.tag.LazyTag
+import team.bravepeople.devevent.ui.chip.ChipViewModel
+import team.bravepeople.devevent.ui.chip.LazyTag
 import team.bravepeople.devevent.util.Web
 import team.bravepeople.devevent.util.extension.takeIfLength
 import team.bravepeople.devevent.util.extension.takeIfSizeToCategory
 import team.bravepeople.devevent.util.extension.toast
 
+private val chipVm = ChipViewModel.instance
 private val eventVm = EventViewModel.instance
-private var preListFirstVisibleIndex = 0
 
 @Composable
 private fun EmptyEvent() {
@@ -264,6 +265,12 @@ fun LazyEvent(repositoryVm: RepositoryViewModel, search: String, eventFilter: Ev
         else true
     }
     eventEntities = eventEntities.filter { it.contains(search.lowercase()) }
+    if (chipVm.selectedChip.isNotEmpty()) {
+        eventEntities = eventEntities.filter { event ->
+            if (event.category == null) false
+            else chipVm.selectedChip.any { event.category.contains(it) }
+        }
+    }
 
     if (eventFilter == EventFilter.Favorite && eventEntities.isEmpty()) {
         EmptyEvent()

app/src/main/kotlin/team/bravepeople/devevent/ui/chip/ChipViewModel.kt

@@ -0,0 +1,37 @@
+/*
+ * DevEventAndroid © 2021 용감한 친구들. all rights reserved.
+ * DevEventAndroid license is under the MIT.
+ *
+ * [ChipViewModel.kt] created by Ji Sungbin on 21. 6. 30. 오후 8:08.
+ *
+ * Please see: https://github.com/brave-people/Dev-Event-Android/blob/master/LICENSE.
+ */
+
+package team.bravepeople.devevent.ui.chip
+
+import androidx.compose.runtime.State
+import androidx.compose.runtime.mutableStateListOf
+import androidx.compose.runtime.mutableStateOf
+import androidx.lifecycle.ViewModel
+
+class ChipViewModel private constructor() : ViewModel() {
+
+    private val _selectedChip = mutableStateListOf<String>()
+    val selectedChip: List<String> get() = _selectedChip
+
+    fun toggleChipSelected(name: String) {
+        if (_selectedChip.contains(name)) {
+            _selectedChip.remove(name)
+        } else {
+            _selectedChip.add(name)
+        }
+    }
+
+    fun isChipSelected(name: String): State<Boolean> {
+        return mutableStateOf(_selectedChip.contains(name))
+    }
+
+    companion object {
+        val instance by lazy { ChipViewModel() }
+    }
+}

app/src/main/kotlin/team/bravepeople/devevent/ui/tag/LazyTag.kt → app/src/main/kotlin/team/bravepeople/devevent/ui/chip/LazyChip.kt

@@ -2,67 +2,89 @@
  * DevEventAndroid © 2021 용감한 친구들. all rights reserved.
  * DevEventAndroid license is under the MIT.
  *
- * [LazyTag.kt] created by Ji Sungbin on 21. 6. 29. 오전 4:43.
+ * [LazyChip.kt] created by Ji Sungbin on 21. 6. 29. 오전 4:43.
  *
  * Please see: https://github.com/brave-people/Dev-Event-Android/blob/master/LICENSE.
  */
 
-package team.bravepeople.devevent.ui.tag
+package team.bravepeople.devevent.ui.chip
 
+import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.clickable
 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.layout.wrapContentSize
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.core.graphics.ColorUtils
 import team.bravepeople.devevent.ui.flowrow.FlowRow
 import team.bravepeople.devevent.util.ColorUtil
 
+private val vm = ChipViewModel.instance
 
 @Composable
-private fun Tag(name: String) {
+private fun Chip(name: String, onClick: String.() -> Unit) {
     val shape = RoundedCornerShape(5.dp)
     val color = ColorUtil.getRandom()
     val isDarkColor = ColorUtils.calculateLuminance(color) < 0.5
+    val selected = vm.isChipSelected(name).value
 
-    Surface(shape = shape, color = Color(color), elevation = 1.dp) {
+    Surface(
+        shape = shape,
+        color = if (selected) Color(color) else Color.White,
+        elevation = 1.dp,
+        border = BorderStroke(1.dp, Color(color)),
+        modifier = Modifier
+            .wrapContentSize()
+            .clip(shape)
+            .clickable { onClick(name) }
+    ) {
         Text(
             text = name,
-            color = if (isDarkColor) Color.White else Color.Black,
+            color = if (selected) if (isDarkColor) Color.White else Color.Black else Color.Black,
             fontSize = 14.sp,
             modifier = Modifier.padding(top = 4.dp, bottom = 4.dp, start = 8.dp, end = 8.dp)
         )
     }
 }
 
 @Composable
-fun FlowTag(modifier: Modifier, tags: List<String>) {
+fun FlowTag(
+    modifier: Modifier,
+    tags: List<String>,
+    onClick: String.() -> Unit
+) { // used in setting dialog -> chip clickable
     FlowRow(modifier = modifier, verticalGap = 4.dp, horizontalGap = 4.dp) {
         for (tag in tags) {
-            Tag(tag)
+            Chip(tag, onClick)
         }
     }
 }
 
 @Composable
-fun LazyTag(modifier: Modifier, tags: List<String>) {
+fun LazyTag(
+    modifier: Modifier,
+    tags: List<String>
+) { // used in event detail bottomsheet -> chip unclickable
     LazyRow(
         modifier = modifier
             .fillMaxWidth()
             .wrapContentHeight(),
         horizontalArrangement = Arrangement.spacedBy(8.dp)
     ) {
         items(tags) { tagName ->
-            Tag(tagName)
+            Chip(name = tagName, onClick = {})
         }
     }
 }