Mercurial
annotate react_games/src/Connectfour/main.tsx @ 279:b3b547563ec7
Add Google connector service and agent wiki
Implement the C/Seobeo Google Drive and Gmail connector with encrypted OAuth storage, Zenbu authentication, browser testing, AI tool discovery, chunked HTTP decoding, and Bazel coverage. Consolidate repository guidance into progressive wiki documentation and enforce arena-first allocation for new first-party C code.
Co-authored-by: Copilot <[email protected]>
Copilot-Session: 84c338fd-0939-4bb3-b7f3-1062eb213e5d
| author | MrJuneJune <me@mrjunejune.com> |
|---|---|
| date | Mon, 17 Aug 2026 22:22:36 -0700 |
| parents | fb9bcd3145cb |
| children |
| rev | line source |
|---|---|
|
37
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
1 import { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
2 useReducer, createContext, useContext, memo, Dispatch |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
3 } from 'react' |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
4 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
5 enum P { R = '🔴', Y = '🟡', _ = '' } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
6 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
7 type Board = P[][] // 6 rows × 7 cols |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
8 type Status = 'PLAYING' | 'TIE' | 'R_WON' | 'Y_WON' |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
9 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
10 type Action = |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
11 | { type: 'DROP'; col: number } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
12 | { type: 'RESET' } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
13 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
14 interface State { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
15 board: Board |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
16 turn: P.R | P.Y |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
17 status: Status |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
18 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
19 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
20 const ROWS = 6, COLS = 7 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
21 const emptyBoard = (): Board => |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
22 Array.from({ length: ROWS }, () => Array(COLS).fill(P._)) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
23 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
24 const init: State = { board: emptyBoard(), turn: P.R, status: 'PLAYING' } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
25 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
26 function firstEmptyRow(board: Board, col: number): number | null { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
27 for (let r = ROWS - 1; r >= 0; r--) if (board[r][col] === P._) return r |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
28 return null |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
29 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
30 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
31 function scanWinner(b: Board): Status { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
32 const lines = [ |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
33 [ 1, 0], [0, 1], // vertical, horizontal |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
34 [ 1, 1], [1, -1], // two diagonals |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
35 ] |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
36 for (let r = 0; r < ROWS; r++) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
37 for (let c = 0; c < COLS; c++) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
38 if (b[r][c] !== P._) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
39 for (const [dr, dc] of lines) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
40 if ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
41 b[r + dr]?.[c + dc] === b[r][c] && |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
42 b[r + 2*dr]?.[c + 2*dc] === b[r][c] && |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
43 b[r + 3*dr]?.[c + 3*dc] === b[r][c] |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
44 ) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
45 return b[r][c] === P.R ? 'R_WON' : 'Y_WON' |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
46 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
47 return b.flat().every(p => p !== P._) ? 'TIE' : 'PLAYING' |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
48 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
49 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
50 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
51 function reducer(s: State, a: Action): State { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
52 if (a.type === 'RESET') return init |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
53 if (s.status !== 'PLAYING') return s // game over |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
54 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
55 const row = firstEmptyRow(s.board, a.col) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
56 if (row == null) return s // full column |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
57 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
58 // clone touched row only |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
59 const newRow = [...s.board[row]] |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
60 newRow[a.col] = s.turn |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
61 const newBoard = s.board.map((r, i) => (i === row ? newRow : r)) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
62 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
63 const nextTurn = s.turn === P.R ? P.Y : P.R |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
64 const status = scanWinner(newBoard) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
65 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
66 return { board: newBoard, turn: nextTurn, status } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
67 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
68 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
69 const DispatchCtx = createContext<Dispatch<Action> | null>(null) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
70 const useGameDispatch = () => { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
71 const d = useContext(DispatchCtx) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
72 if (!d) throw new Error('outside provider') |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
73 return d |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
74 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
75 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
76 /* ------- Leaf ------- */ |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
77 interface CellProps { v: P } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
78 const Cell = memo<CellProps>(({ v }) => ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
79 <div style={{ |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
80 width: 52, height: 52, margin: 2, borderRadius: '50%', |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
81 background: '#0e2a5a', display: 'grid', placeItems: 'center', |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
82 fontSize: 30 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
83 }}> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
84 {v} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
85 </div> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
86 )) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
87 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
88 /* ------- Column button ------- */ |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
89 const ColBtn = ({ col }: { col: number }) => { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
90 const dispatch = useGameDispatch() |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
91 return ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
92 <button |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
93 style={{ flex: 1, height: 20, cursor: 'pointer' }} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
94 onClick={() => dispatch({ type: 'DROP', col })} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
95 /> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
96 ) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
97 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
98 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
99 /* ------- Board ------- */ |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
100 const BoardView = memo(({ board }: { board: Board }) => ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
101 <div> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
102 {/* clickable top buttons */} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
103 <div style={{ display: 'flex' }}> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
104 {Array.from({ length: COLS }, (_, c) => <ColBtn key={c} col={c} />)} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
105 </div> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
106 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
107 {/* grid */} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
108 {board.map((row, r) => ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
109 <div key={r} style={{ display: 'flex' }}> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
110 {row.map((v, c) => <Cell key={c} v={v} />)} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
111 </div> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
112 ))} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
113 </div> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
114 )) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
115 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
116 function ConnectFour() { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
117 const [state, dispatch] = useReducer(reducer, init) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
118 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
119 return ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
120 <DispatchCtx.Provider value={dispatch}> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
121 <h2 style={{ textAlign: 'center' }}> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
122 {state.status === 'PLAYING' && `Turn: ${state.turn}`} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
123 {state.status === 'TIE' && 'Tie game'} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
124 {state.status === 'R_WON' && 'Red wins!'} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
125 {state.status === 'Y_WON' && 'Yellow wins!'} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
126 </h2> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
127 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
128 <BoardView board={state.board} /> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
129 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
130 {state.status !== 'PLAYING' && ( |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
131 <button style={{ marginTop: 16 }} onClick={() => dispatch({ type: 'RESET' })}> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
132 Play again |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
133 </button> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
134 )} |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
135 </DispatchCtx.Provider> |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
136 ) |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
137 } |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
138 |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
139 export { |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
140 ConnectFour, |
|
fb9bcd3145cb
[ReactGames] Few games I made using react just to practice few things.
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
141 } |