From e56fb2e87e3ce8513339e38c1b70dcba01032fb3 Mon Sep 17 00:00:00 2001
From: tapframe <85391825+tapframe@users.noreply.github.com>
Date: Thu, 16 Jul 2026 13:50:33 +0530
Subject: [PATCH] feat: reveall spoiler comments by tapping

---
 .../details/components/CommentDetailSheet.kt  | 34 ++++++++++++-------
 .../components/DetailCommentsSection.kt       | 18 +++++-----
 2 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/CommentDetailSheet.kt b/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/CommentDetailSheet.kt
index e2cadb54..f43f2e14 100644
--- a/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/CommentDetailSheet.kt
+++ b/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/CommentDetailSheet.kt
@@ -27,6 +27,8 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.rememberModalBottomSheetState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
@@ -35,6 +37,7 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.nuvio.app.core.ui.NuvioModalBottomSheet
+import com.nuvio.app.core.ui.nuvio
 import com.nuvio.app.features.trakt.TraktCommentReview
 import nuvio.composeapp.generated.resources.*
 import org.jetbrains.compose.resources.stringResource
@@ -53,6 +56,10 @@ fun CommentDetailSheet(
 ) {
     val sheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
     val scrollState = rememberScrollState()
+    val isSpoilerRevealed = rememberSaveable(comment.id) {
+        mutableStateOf(!comment.hasSpoilerContent)
+    }
+    val isSpoilerHidden = comment.hasSpoilerContent && !isSpoilerRevealed.value
 
     LaunchedEffect(comment.id) {
         scrollState.scrollTo(0)
@@ -151,17 +158,9 @@ fun CommentDetailSheet(
                 }
             }
 
-            if (comment.review || comment.hasSpoilerContent) {
+            if (comment.review) {
                 Spacer(modifier = Modifier.height(12.dp))
-
-                Row(horizontalArrangement = Arrangement.spacedBy(6.dp)) {
-                    if (comment.review) {
-                        CommentDetailChip(text = stringResource(Res.string.detail_comments_badge_review))
-                    }
-                    if (comment.hasSpoilerContent) {
-                        CommentDetailChip(text = stringResource(Res.string.detail_comments_badge_spoiler))
-                    }
-                }
+                CommentDetailChip(text = stringResource(Res.string.detail_comments_badge_review))
             }
 
             Spacer(modifier = Modifier.height(16.dp))
@@ -173,13 +172,24 @@ fun CommentDetailSheet(
                     .verticalScroll(scrollState),
             ) {
                 Text(
-                    text = if (comment.hasSpoilerContent) {
+                    text = if (isSpoilerHidden) {
                         stringResource(Res.string.detail_comments_spoiler_hidden_sheet)
                     } else {
                         comment.comment
                     },
                     style = MaterialTheme.typography.bodyLarge.copy(lineHeight = 24.sp),
-                    color = MaterialTheme.colorScheme.onSurface,
+                    color = if (isSpoilerHidden) {
+                        MaterialTheme.nuvio.colors.warning
+                    } else {
+                        MaterialTheme.colorScheme.onSurface
+                    },
+                    modifier = Modifier.then(
+                        if (isSpoilerHidden) {
+                            Modifier.clickable { isSpoilerRevealed.value = true }
+                        } else {
+                            Modifier
+                        },
+                    ),
                 )
             }
 
diff --git a/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/DetailCommentsSection.kt b/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/DetailCommentsSection.kt
index 277a7975..44e47c3c 100644
--- a/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/DetailCommentsSection.kt
+++ b/composeApp/src/commonMain/kotlin/com/nuvio/app/features/details/components/DetailCommentsSection.kt
@@ -40,6 +40,7 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.nuvio.app.core.ui.nuvio
 import com.nuvio.app.core.ui.nuvioHorizontalScrollBleed
 import com.nuvio.app.core.ui.withDuplicateSafeLazyKeys
 import com.nuvio.app.features.trakt.TraktCommentReview
@@ -214,21 +215,18 @@ private fun CommentCard(
                     fontWeight = FontWeight.SemiBold,
                 )
 
-                if (review.review || review.hasSpoilerContent) {
-                    Row(horizontalArrangement = Arrangement.spacedBy(6.dp)) {
-                        if (review.review) {
-                            CommentChip(text = stringResource(Res.string.detail_comments_badge_review))
-                        }
-                        if (review.hasSpoilerContent) {
-                            CommentChip(text = stringResource(Res.string.detail_comments_badge_spoiler))
-                        }
-                    }
+                if (review.review) {
+                    CommentChip(text = stringResource(Res.string.detail_comments_badge_review))
                 }
 
                 Text(
                     text = bodyText,
                     style = MaterialTheme.typography.bodyMedium.copy(lineHeight = 20.sp),
-                    color = MaterialTheme.colorScheme.onSurfaceVariant,
+                    color = if (review.hasSpoilerContent) {
+                        MaterialTheme.nuvio.colors.warning
+                    } else {
+                        MaterialTheme.colorScheme.onSurfaceVariant
+                    },
                     maxLines = 5,
                     overflow = TextOverflow.Ellipsis,
                     modifier = Modifier.weight(1f, fill = false),