UI Tweaks

testomania/src/main/java/com/earth/testomania/presentation/AboutBottomSheet.kt

@@ -1,12 +1,17 @@
+@file:OptIn(ExperimentalMaterialApi::class)
+
 package com.earth.testomania.presentation
 
 import android.content.Context
 import android.content.Intent
 import android.net.Uri
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
+import androidx.compose.material.ExperimentalMaterialApi
+import androidx.compose.material.ModalBottomSheetState
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
@@ -21,12 +26,17 @@ import com.earth.testomania.core.developers
 import com.ramcosta.composedestinations.annotation.Destination
 import kiwi.orbit.compose.ui.controls.ChoiceTile
 import kiwi.orbit.compose.ui.controls.Icon
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.launch
 
 const val ABOUT_ROUT = "home/about"
 
 @Destination(route = ABOUT_ROUT)
 @Composable
-fun AboutBottomSheet() {
+fun AboutBottomSheet(
+    modalBottomSheetState: ModalBottomSheetState,
+    scope: CoroutineScope
+) {
 
     val context = LocalContext.current
     val appGithubUrl = stringResource(id = R.string.app_github_url)
@@ -72,6 +82,25 @@ fun AboutBottomSheet() {
     developers.forEach {
         AboutDeveloper(it)
     }
+
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .padding(bottom = 10.dp),
+        contentAlignment = Alignment.Center
+    ) {
+        Icon(
+            modifier = Modifier
+                .size(30.dp)
+                .clickable {
+                    scope.launch {
+                        modalBottomSheetState.hide()
+                    }
+                },
+            painter = painterResource(id = R.drawable.ic_orbit_chevron_down),
+            contentDescription = "",
+        )
+    }
 }
 
 @Composable

testomania/src/main/java/com/earth/testomania/presentation/home/HomeScreen.kt

@@ -63,7 +63,7 @@ fun HomeScreen(
         sheetState = modalBottomSheetState,
         scrimColor = Color.Transparent,
         sheetContent = {
-            AboutBottomSheet()
+            AboutBottomSheet(modalBottomSheetState, scope)
         }
     ) {
         Scaffold(
@@ -143,12 +143,19 @@ fun CardButton(
 ) {
     val scope = rememberCoroutineScope()
     val comingSoonStr = stringResource(id = R.string.coming_soon)
+    val dismissStr = stringResource(id = R.string.dismiss)
 
     Card(modifier = Modifier.size(125.dp), shape = RoundedCornerShape(10.dp), onClick = {
+
+        dismissCurrentSnackbar(scaffoldState)
+
         when (destinationInfo.destination.route) {
             SKILLZ_ROUTE, DUMMY_ROUTE -> {
                 scope.launch {
-                    scaffoldState.snackbarHostState.showSnackbar(comingSoonStr)
+                    scaffoldState.snackbarHostState.showSnackbar(
+                        message = comingSoonStr,
+                        actionLabel = dismissStr,
+                    )
                 }
                 return@Card
             }
@@ -179,3 +186,7 @@ fun CardButton(
         }
     }
 }
+
+private fun dismissCurrentSnackbar(scaffoldState: ScaffoldState) {
+    scaffoldState.snackbarHostState.currentSnackbarData?.dismiss()
+}

testomania/src/main/java/com/earth/testomania/technical/domain/model/TechCategory.kt

@@ -8,7 +8,7 @@ enum class TechCategory(val category: String, val illustration: Int) {
     PHP("PHP", R.drawable.il_html),
     Networking("Networking", R.drawable.il_networking),
     Cloud("Cloud", R.drawable.il_cloud),
-    Docker("Docker", R.drawable.il_docker),
+    Docker("Docker", R.drawable.il_kubernetes),
     Kubernetes("Kubernetes", R.drawable.il_kubernetes),
     HTML("HTML", R.drawable.il_html),
     SQL("SQL", R.drawable.il_sql),

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

@@ -18,4 +18,5 @@
     <string name="navigation_finish">Finish</string>
     <string name="navigation_next">Next/Skip</string>
     <string name="coming_soon">Coming soon...</string>
+    <string name="dismiss">Dismiss</string>
 </resources>