feat: écran de résultats avec statistiques et résumé des réponses fausses

sharedUI/src/commonMain/kotlin/com/livrets/ui/ResultsScreen.kt

@@ -1,14 +1,112 @@
 package com.livrets.ui
 
-import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.safeDrawing
+import androidx.compose.foundation.layout.windowInsetsPadding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material3.Button
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedButton
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
 import com.livrets.game.GameResult
 
 @Composable
-fun ResultsScreen(result: GameResult, onReplay: () -> Unit, onHome: () -> Unit) {
-    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) { Text("Résultats") }
+fun ResultsScreen(
+    result: GameResult,
+    onReplay: () -> Unit,
+    onHome: () -> Unit,
+) {
+    val wrong = result.records.filterNot { it.isCorrect }
+    val green = Color(0xFF2E7D32)
+
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .windowInsetsPadding(WindowInsets.safeDrawing)
+            .padding(24.dp),
+    ) {
+        Text("Partie terminée", style = MaterialTheme.typography.headlineMedium)
+        Spacer(Modifier.height(16.dp))
+
+        Text(
+            text = "${result.correctCount} / ${result.records.size}",
+            style = MaterialTheme.typography.displayLarge,
+        )
+        Text(
+            text = "Réussite : ${(result.successRate * 100).toInt()} %",
+            style = MaterialTheme.typography.titleMedium,
+        )
+        Text(
+            text = "Temps moyen de réponse : ${result.averageResponseMs / 1000.0} s",
+            style = MaterialTheme.typography.titleMedium,
+        )
+
+        Spacer(Modifier.height(16.dp))
+        Text(
+            text = "Réponses fausses (${wrong.size})",
+            style = MaterialTheme.typography.titleLarge,
+        )
+
+        if (wrong.isEmpty()) {
+            Text(
+                text = "Aucune erreur, parfait !",
+                style = MaterialTheme.typography.bodyLarge,
+                modifier = Modifier.padding(vertical = 16.dp),
+            )
+        } else {
+            LazyColumn(modifier = Modifier.weight(1f).padding(vertical = 8.dp)) {
+                items(wrong) { record ->
+                    Row(
+                        modifier = Modifier.fillMaxWidth().padding(vertical = 6.dp),
+                        verticalAlignment = Alignment.CenterVertically,
+                    ) {
+                        Text(
+                            text = record.question.toString(),
+                            modifier = Modifier.weight(1f),
+                            style = MaterialTheme.typography.titleMedium,
+                        )
+                        Column(horizontalAlignment = Alignment.End) {
+                            Text(
+                                text = if (record.givenAnswer == null) "Temps écoulé"
+                                else "Votre réponse : ${record.givenAnswer}",
+                                color = MaterialTheme.colorScheme.error,
+                                style = MaterialTheme.typography.bodyMedium,
+                            )
+                            Text(
+                                text = "Bonne réponse : ${record.correctAnswer}",
+                                color = green,
+                                style = MaterialTheme.typography.bodyMedium,
+                            )
+                        }
+                    }
+                    HorizontalDivider()
+                }
+            }
+        }
+
+        Spacer(Modifier.height(16.dp))
+        Row(horizontalArrangement = Arrangement.spacedBy(16.dp)) {
+            Button(onClick = onReplay, modifier = Modifier.weight(1f).height(52.dp)) {
+                Text("Rejouer")
+            }
+            OutlinedButton(onClick = onHome, modifier = Modifier.weight(1f).height(52.dp)) {
+                Text("Accueil")
+            }
+        }
+    }
 }