From d534fa8b4cb363842d021ba049fc3ec586f13032 Mon Sep 17 00:00:00 2001
From: JackEblan <jackeblan115@gmail.com>
Date: Fri, 20 Sep 2024 16:07:52 +0800
Subject: [PATCH] Shorten Animated Countdown timer

---
 .../feature/question/screen/QuestionScreen.kt | 37 ++++++++++++++++++-
 1 file changed, 35 insertions(+), 2 deletions(-)

diff --git a/feature/question/src/main/kotlin/com/eblan/socialworkreviewer/feature/question/screen/QuestionScreen.kt b/feature/question/src/main/kotlin/com/eblan/socialworkreviewer/feature/question/screen/QuestionScreen.kt
index 5b09c20..9b8b9ac 100644
--- a/feature/question/src/main/kotlin/com/eblan/socialworkreviewer/feature/question/screen/QuestionScreen.kt
+++ b/feature/question/src/main/kotlin/com/eblan/socialworkreviewer/feature/question/screen/QuestionScreen.kt
@@ -366,7 +366,15 @@ private fun QuestionScreenTopBar(
 
         Spacer(modifier = Modifier.width(5.dp))
 
-        Text(text = "$questionsWithSelectedChoicesSize", fontWeight = FontWeight.Bold)
+        AnimatedContent(
+            targetState = questionsWithSelectedChoicesSize,
+            transitionSpec = {
+                slideInVertically { it } togetherWith slideOutVertically { -it }
+            },
+            label = "",
+        ) { state ->
+            Text(text = "$state", fontWeight = FontWeight.Bold)
+        }
 
         if (countDownTime != null && countDownTime.isFinished.not()) {
             Spacer(modifier = Modifier.width(20.dp))
@@ -375,7 +383,7 @@ private fun QuestionScreenTopBar(
 
             Spacer(modifier = Modifier.width(5.dp))
 
-            Text(text = countDownTime.minutes, fontWeight = FontWeight.Bold)
+            AnimatedCountDownTimerText(text = countDownTime.minutes, fontWeight = FontWeight.Bold)
         }
     }
 }
@@ -522,6 +530,31 @@ private fun QuestionChoicesSelection(
     }
 }
 
+@Composable
+private fun AnimatedCountDownTimerText(
+    modifier: Modifier = Modifier,
+    text: String,
+    fontWeight: FontWeight? = null,
+) {
+    Row {
+        text.indices.forEach { i ->
+            AnimatedContent(
+                targetState = text[i],
+                transitionSpec = {
+                    slideInVertically { it } togetherWith slideOutVertically { -it }
+                },
+                label = "",
+            ) { char ->
+                Text(
+                    text = "$char",
+                    modifier = modifier,
+                    fontWeight = fontWeight,
+                )
+            }
+        }
+    }
+}
+
 @Composable
 private fun EmptyState(
     modifier: Modifier = Modifier,