From d761d0706ab21cc6148a72b59f4a30275483cb45 Mon Sep 17 00:00:00 2001
From: Pierre Ferreira <p.ferreira1@outlook.fr>
Date: Thu, 23 Nov 2023 14:38:31 +0100
Subject: [PATCH] ajout de la coloration des lignes suite au clique de
 l'utilisateur :art:

---
 .../src/Components/AccordionIndice.tsx        | 95 ++++++++++++-------
 1 file changed, 61 insertions(+), 34 deletions(-)

diff --git a/cryptide_project/src/Components/AccordionIndice.tsx b/cryptide_project/src/Components/AccordionIndice.tsx
index 0ed7959..d1f657d 100644
--- a/cryptide_project/src/Components/AccordionIndice.tsx
+++ b/cryptide_project/src/Components/AccordionIndice.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 
 /* Style */
 import '../Style/Global.css';
@@ -19,42 +19,69 @@ import Case from './CheckCase';
 
 
 interface AccordionIndiceComponentProps<T extends Indice> {
-    instance: (new (...args: any[]) => T) | (Function & { prototype: T });
+instance: (new (...args: any[]) => T) | (Function & { prototype: T });
     head: string;
     lang: string;
 }
 
 const AccordionIndice: React.FC<AccordionIndiceComponentProps<any>> = ({ instance, head, lang }) => {
-    const indices = Stub.GenerateIndice();
-    return (
-        <>
-            <Accordion defaultActiveKey={['0']} alwaysOpen style={{width:'100%'}}>
-                <Accordion.Item eventKey="0">
-                    <Accordion.Header>{head}</Accordion.Header>
-                    <Accordion.Body>
-                        <Table striped bordered hover>
-                            <thead>
-                                <tr>
-                                    <th>Indice</th>
-                                    <th>Déduction</th>
-                                </tr>
-                            </thead>
-                            <tbody>
-                                {indices
-                                    .filter((i) => i instanceof instance)
-                                    .map((indice, index) => (
-                                        <tr key={index}>
-                                            <td>{indice.ToString(lang)}</td>
-                                            <td><Case/></td>
-                                        </tr>
-                                    ))}
-                            </tbody>
-                        </Table>
-                    </Accordion.Body>
-                </Accordion.Item>
-            </Accordion>
-        </>
-    );
-}
+const indices = Stub.GenerateIndice();
+const [selectedRows, setSelectedRows] = useState<number[]>([]);
+
+
+const handleRowClick = (index: number) => {
+
+    const newSelectedRows = [...selectedRows];
+
+    const selectedIndex = newSelectedRows.indexOf(index);
+    if (selectedIndex === -1) {
+        newSelectedRows.push(index);
+    } else {
+        newSelectedRows.splice(selectedIndex, 1);
+    }
+
+    console.log('New Selected Rows:', newSelectedRows);
+    setSelectedRows(newSelectedRows);
+};
+
+return (
+    <>
+    <Accordion defaultActiveKey={['0']} alwaysOpen style={{ width: '100%' }}>
+        <Accordion.Item eventKey="0">
+        <Accordion.Header>{head}</Accordion.Header>
+        <Accordion.Body>
+            <Table striped bordered hover>
+            <thead>
+                <tr>
+                    <th>Indice</th>
+                </tr>
+            </thead>
+            <tbody>
+                {indices
+                .filter((i) => i instanceof instance)
+                .map((indice, index) => (
+                    <tr
+                        key={index}
+                        onClick={() => handleRowClick(index)}
+                        style={{
+                            cursor: 'pointer',
+                        }}>
+                        <td
+                            style={{
+                                border: selectedRows.includes(index) ? '1px solid red' : 'none',
+                                backgroundColor: selectedRows.includes(index) ? '#FF9191' : 'white',
+                            }}>
+                            {indice.ToString(lang)}
+                        </td>
+                    </tr>
+                ))}
+            </tbody>
+            </Table>
+        </Accordion.Body>
+        </Accordion.Item>
+    </Accordion>
+    </>
+);
+};
 
-export default AccordionIndice;
+export default AccordionIndice;
\ No newline at end of file