Custom hook for the app state!

Author: miorel

src/App.tsx

@@ -1,10 +1,10 @@
-import React, { useReducer } from "react";
+import React from "react";
 
 import styles from "./App.module.css";
-import { getInitialState, reducer } from "./appState";
+import useAppState from "./useAppState";
 
 function App() {
-  const [state, dispatch] = useReducer(reducer, null, getInitialState);
+  const [state, dispatch] = useAppState();
 
   let content = null;
   switch (state.phase) {

src/appState.ts src/useAppState.tssrc/appState.ts renamed to src/useAppState.ts

@@ -1,3 +1,5 @@
+import { useReducer, type ActionDispatch } from "react";
+
 import getRandomWord from "./getRandomWord";
 
 export type State =
@@ -53,3 +55,7 @@ export function reducer(state: State, action: Action): State {
 
   return state;
 }
+
+export default function useAppState(): [State, ActionDispatch<[Action]>] {
+  return useReducer(reducer, null, getInitialState);
+}