fix: restore tictactoe with correct content

This commit is contained in:
Carlos
2026-07-02 15:32:35 +02:00
parent 6e1c5a847e
commit 5b08ece7df
2 changed files with 9 additions and 39 deletions
@@ -1,6 +1,6 @@
import { useState } from 'react';
export default function Home() {
export default function TicTacToe() {
const [board, setBoard] = useState(Array(9).fill(null));
const [xIsNext, setXIsNext] = useState(true);
const winner = calculateWinner(board);
@@ -18,14 +18,9 @@ export default function Home() {
function calculateWinner(squares) {
const lines = [
[0, 1, 2],
[3, 4, 5],
[6, 7, 8],
[0, 3, 6],
[1, 4, 7],
[2, 5, 8],
[0, 4, 8],
[2, 4, 6],
[0, 1, 2], [3, 4, 5], [6, 7, 8],
[0, 3, 6], [1, 4, 7], [2, 5, 8],
[0, 4, 8], [2, 4, 6],
];
for (let [a, b, c] of lines) {
if (squares[a] && squares[a] === squares[b] && squares[a] === squares[c]) {
@@ -36,36 +31,14 @@ export default function Home() {
}
const renderSquare = (i) => (
<button
className="square"
onClick={() => handleClick(i)}
>
<button className="square" onClick={() => handleClick(i)}>
{board[i]}
</button>
);
const statusStyle = {
marginBottom: '1rem',
fontSize: '1.2rem',
};
const boardStyle = {
display: 'grid',
gridTemplateColumns: 'repeat(3, 1fr)',
gap: '4px',
width: '300px',
margin: '0 auto',
};
const squareStyle = {
background: '#fff',
border: '1px solid #999',
fontSize: '2rem',
width: '100%',
height: '80px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
cursor: 'pointer',
};
const statusStyle = { marginBottom: '1rem', fontSize: '1.2rem' };
const boardStyle = { display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: '4px', width: '300px', margin: '0 auto' };
const squareStyle = { background: '#fff', border: '1px solid #999', fontSize: '2rem', width: '100%', height: '80px', display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer' };
return (
<div style={{ padding: '2rem', fontFamily: 'sans-serif' }}>
@@ -79,10 +52,7 @@ export default function Home() {
))}
</div>
{winner && (
<button onClick={() => {
setBoard(Array(9).fill(null));
setXIsNext(true);
}}>
<button onClick={() => { setBoard(Array(9).fill(null)); setXIsNext(true); }}>
Play Again
</button>
)}