Add a new count challenge screen

app/src/main/java/app/plugbrain/android/ui/challenges/ChallengeActivity.kt

@@ -1,65 +1,44 @@
 package app.plugbrain.android.ui.challenges
 
-import android.content.Intent
 import android.os.Bundle
 import android.widget.Toast
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Scaffold
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
-import androidx.compose.ui.Modifier
-import app.plugbrain.android.BuildConfig
-import app.plugbrain.android.ui.challenges.compose.ArithChallengeScreen
-import app.plugbrain.android.ui.challenges.compose.ChallengeTopBar
+import app.plugbrain.android.ui.challenges.compose.CountChallengeScreen
 import app.plugbrain.android.ui.challenges.presentation.ArithChallengeViewModel
 import app.plugbrain.android.ui.theme.MathlockAppTheme
-import app.plugbrain.android.ui.timer.TimerActivity
 import org.koin.androidx.viewmodel.ext.android.viewModel
 
 class ChallengeActivity : ComponentActivity() {
   private val challengeViewModel: ArithChallengeViewModel by viewModel()
 
   override fun onResume() {
     super.onResume()
-    challengeViewModel.generateChallenge()
+    challengeViewModel.generateCountChallenge()
   }
 
   override fun onCreate(savedInstanceState: Bundle?) {
     super.onCreate(savedInstanceState)
     enableEdgeToEdge()
     setContent {
       MathlockAppTheme {
-        val challenge by challengeViewModel.mathChallenge.collectAsState()
-        Scaffold(
-          topBar = {
-            if (BuildConfig.DEBUG) { // The refresh button works only on DEBUG mode!
-              ChallengeTopBar(onRefreshClicked = {
-                startActivity(Intent(this@ChallengeActivity, TimerActivity::class.java))
-              })
-            }
-          },
-          modifier = Modifier.fillMaxSize(),
-        ) { innerPadding ->
-          challenge?.let {
-            ArithChallengeScreen(
-              modifier = Modifier.padding(innerPadding),
-              mathChallenge = it,
-            ) { response ->
-              if (it.checkAnswer(response)) {
-                challengeViewModel.unblockApps()
-                finishAffinity()
-              } else {
-                Toast.makeText(
-                  this@ChallengeActivity,
-                  "Wrong Answer, try again!",
-                  Toast.LENGTH_LONG,
-                ).show()
-              }
-            }
+        val countValue by challengeViewModel.countChallenge.collectAsState()
+
+        CountChallengeScreen(
+          countValue,
+        ) { filledValue ->
+          if (countValue == filledValue) {
+            challengeViewModel.unblockApps()
+            finishAffinity()
+          } else {
+            Toast.makeText(
+              this@ChallengeActivity,
+              "Wrong Answer, try again!",
+              Toast.LENGTH_LONG,
+            ).show()
           }
         }
       }

app/src/main/java/app/plugbrain/android/ui/challenges/compose/CountChallengeScreen.kt

@@ -0,0 +1,86 @@
+package app.plugbrain.android.ui.challenges.compose
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material3.Button
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextField
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun CountChallengeScreen(
+  number: Int,
+  checkAnswer: (Int) -> Unit,
+) {
+  var userInput by remember { mutableStateOf("") }
+
+  Column(
+    modifier = Modifier
+      .fillMaxSize()
+      .padding(16.dp),
+    horizontalAlignment = Alignment.CenterHorizontally,
+    verticalArrangement = Arrangement.spacedBy(16.dp),
+  ) {
+    Text(
+      text = "How many objects do you see?",
+      style = MaterialTheme.typography.headlineSmall,
+    )
+
+    LazyRow(
+      horizontalArrangement = Arrangement.spacedBy(8.dp),
+      modifier = Modifier
+        .padding(vertical = 8.dp),
+    ) {
+      items(number) {
+        Box(
+          modifier = Modifier
+            .size(16.dp)
+            .background(
+              color = Color.Red,
+              shape = CircleShape,
+            ),
+        )
+      }
+    }
+
+    TextField(
+      value = userInput,
+      onValueChange = { userInput = it },
+      keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
+      singleLine = true,
+      modifier = Modifier.fillMaxWidth(),
+    )
+
+    Button(
+      onClick = { checkAnswer(userInput.toInt()) },
+    ) {
+      Text(">", style = MaterialTheme.typography.headlineLarge)
+    }
+  }
+}
+
+@Preview
+@Composable
+private fun CountChallengeScreenPreview() {
+  CountChallengeScreen(10, {})
+}

app/src/main/java/app/plugbrain/android/ui/challenges/presentation/ArithChallengeViewModel.kt

@@ -20,7 +20,14 @@ class ArithChallengeViewModel(
   private val _mathChallenge: MutableStateFlow<MathChallenge?> = MutableStateFlow(null)
   val mathChallenge: StateFlow<MathChallenge?> = _mathChallenge
 
-  fun generateChallenge() {
+  private val _countChallenge: MutableStateFlow<Int> = MutableStateFlow(1)
+  val countChallenge: StateFlow<Int> = _countChallenge
+
+  fun generateCountChallenge() {
+    _countChallenge.value = (1..10).random()
+  }
+
+  fun generateArithChallenge() {
     viewModelScope.launch {
       decreaseDifficulty()
       _mathChallenge.value = mathChallengeRepository.generateProgressiveChallenge().first()