From 4d929ddd96e2aae9256267f170385aa519aa7db4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9o?= <43091603+glazk0@users.noreply.github.com>
Date: Wed, 12 Apr 2023 20:49:16 +0200
Subject: [PATCH] Try fix

---
 ui/Puzzle.tsx | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/ui/Puzzle.tsx b/ui/Puzzle.tsx
index 3ef8a6c..0e63c06 100644
--- a/ui/Puzzle.tsx
+++ b/ui/Puzzle.tsx
@@ -8,6 +8,7 @@ import { useForm } from 'react-hook-form';
 import Button from './Button';
 import Input from './Input';
 import ToHTML from './ToHTML';
+import { useState } from 'react';
 
 type PuzzleData = {
   answer: string;
@@ -16,7 +17,8 @@ type PuzzleData = {
 };
 
 type Granted = {
-  [key: string]: number;
+  tries: number;
+  score?: number;
 };
 
 export default function Puzzle({ puzzle }: { puzzle: PuzzleType }) {
@@ -24,6 +26,8 @@ export default function Puzzle({ puzzle }: { puzzle: PuzzleType }) {
     notFound();
   }
 
+  const [granted, setGranted] = useState<Granted | null>(null);
+
   const {
     register,
     handleSubmit,
@@ -57,8 +61,8 @@ export default function Puzzle({ puzzle }: { puzzle: PuzzleType }) {
       }
     });
 
-    if (res.ok) {
-      alert('Réponse correcte !');
+    if (res.ok || res.status === 406) {
+      setGranted(await res.json());
     }
   }
 
@@ -76,7 +80,7 @@ export default function Puzzle({ puzzle }: { puzzle: PuzzleType }) {
         onSubmit={handleSubmit(onSubmit)}
         encType="multipart/form-data"
       >
-        <div className="flex flex-col space-x-0 sm:flex-row sm:space-x-6">
+        <div className="flex flex-col items-center justify-center space-x-0 sm:flex-row sm:space-x-6">
           <Input
             className="w-full"
             label="Réponse"
@@ -85,7 +89,12 @@ export default function Puzzle({ puzzle }: { puzzle: PuzzleType }) {
             required
             {...register('answer')}
           />
-
+          {granted && (
+            <div className="flex flex-col">
+              <p className="text-sm text-muted">Tentatives actuelles : {granted.tries}</p>
+              {granted.score && <p className="text-sm text-muted">Score : {granted.score}</p>}
+            </div>
+          )}
           {/* <Input
             className="h-16 w-full sm:w-1/3"
             label="Code"