borderRadius, français et update packages

package.json

@@ -1,7 +1,7 @@
 {
   "name": "jeu-solitaire",
   "private": true,
-  "version": "1.0.0",
+  "version": "1.0.1",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -13,10 +13,10 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@types/react": "^18.2.74",
-    "@types/react-dom": "^18.2.23",
+    "@types/react": "^18.2.78",
+    "@types/react-dom": "^18.2.25",
     "@vitejs/plugin-react": "^4.2.1",
-    "typescript": "^5.4.3",
-    "vite": "^5.2.7"
+    "typescript": "^5.4.5",
+    "vite": "^5.2.8"
   }
 }

src/game/board.component.tsx

@@ -20,7 +20,7 @@ export const BoardComponent = ({ gameNode, setGameNode }: BoardComponentArgs) =>
         {
             gameNode.board?.id === 0 &&
                 <div>
-                    <p>Selectionner une bille à enlever pour démarrer une partie depuis une configuration.</p>
+                    <p>Selectionner une bille à enlever pour démarrer une partie.</p>
                     <p>Les billes avec un arrière plan vert sont des configurations ayant une solution.</p>
                 </div>
         }
@@ -53,12 +53,12 @@ export const BoardComponent = ({ gameNode, setGameNode }: BoardComponentArgs) =>
                 onClick={() => {
                     const newGameNode = playRandomTurn(gameNode)
                     setGameNode(newGameNode)
-                }}>Play random turn</button>
+                }}>Jouer un tour au hasard</button>
             <button
                 disabled={gameNode.board?.id === 0}
                 onClick={() => {
                     findSolutionFunc(playRandomTurn, gameNode, setGameNode)
-                }}>Try find solution</button>
+                }}>Essayer de trouver une solution</button>
         </div>
     </>)
 }

src/game/component/cell.component.tsx

@@ -22,7 +22,8 @@ function CellComponent({ cellIndex, cell, possibleMoves, selectedCell, setSelect
             onClick={() => onCellClick(gameNode, setGameNode, cell, possibleMoves, setSelectedCell, selectedCell)}
             style={{
                 backgroundColor: getCellBackgroundColor(gameNode, cell, possibleMoves),
-                border: getBorder(cell, selectedCell)
+                border: getBorder(cell, selectedCell),
+                borderRadius: getBorderRadius(cell)
             }}
         >
             {cell.isPlayable() ? 
@@ -97,4 +98,20 @@ function getBorder(cell: Cell, selectedCell?: Cell) {
     return undefined
 }
 
+function getBorderRadius(cell: Cell) {
+    if (cell.x == 0 && cell.y == 0) {
+        return "100% 0 0 0"
+    }
+    if (cell.x == 0 && cell.y == 6) {
+        return "0 100% 0 0"
+    }
+    if (cell.x == 6 && cell.y == 0) {
+        return "0 0 0 100%"
+    }
+    if (cell.x == 6 && cell.y == 6) {
+        return "0 0 100% 0"
+    }
+    return "0"
+}
+
 export default CellComponent;