From c86cd7b6e3c956a914bed4e8dde012a0e902837d Mon Sep 17 00:00:00 2001
From: edwardbrodski <brodskiedward@gmail.com>
Date: Thu, 21 Sep 2023 23:06:46 +0100
Subject: [PATCH] state has no need to be a callback as it is re rendered on
 boardChange. Basically you are adding an unnecessary step

---
 src/TicTacToe/Root.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/TicTacToe/Root.tsx b/src/TicTacToe/Root.tsx
index 472c86e..406907e 100644
--- a/src/TicTacToe/Root.tsx
+++ b/src/TicTacToe/Root.tsx
@@ -104,7 +104,7 @@ function TicTacToe() {
           const callback = () => {
             playTurn(index);
           };
-          return <TicTacToeCell getState={getState} callback={callback} />;
+          return <TicTacToeCell state={gridState[index]} callback={callback} />;
         })}
       </div>
     </div>
@@ -112,21 +112,21 @@ function TicTacToe() {
 }
 
 interface CellProps {
-  getState: () => number;
+  state: number;
   callback: () => void;
 }
 
-function TicTacToeCell({ getState, callback }: CellProps) {
+function TicTacToeCell({ state, callback }: CellProps) {
   function handleClick() {
     callback();
   }
 
   return (
     <div
-      className={`TicTacToeCell ${getStateClass(getState())}`}
+      className={`TicTacToeCell ${getStateClass(state)}`}
       onClick={handleClick}
     >
-      <p>{getStateChar(getState())}</p>
+      <p>{getStateChar(state)}</p>
     </div>
   );
 }