Inlining some hooks that weren't actually being shared

client/src/App.js

@@ -1,4 +1,4 @@
-import React, { useState, useRef } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { CSSTransition } from 'react-transition-group';
 import styles from './App.module.css';
 import GamePanel from './components/screens/GamePanel';
@@ -8,8 +8,7 @@ import Lobby from './components/screens/Lobby';
 import RoundSummary from './components/screens/RoundSummary';
 import ApiInfo from './components/util/ApiInfo';
 import { ERROR, IN_ROUND, POST_GAME, POST_ROUND, PRE_GAME, PRE_ROUND } from './domain/GameState';
-import { useGameState } from './domain/gameStore';
-import useDirectGameLinks from './hooks/useDirectGameLinks';
+import { dispatch, useGameState } from './domain/gameStore';
 
 const needsHeaderFooter = {
   [PRE_GAME]: true,
@@ -58,6 +57,11 @@ const Footer = ({ show }) => {
   );
 }
 
+const paramRouter = {
+  join: dispatch.goToLobby,
+  summary: gameId => dispatch.goToSummary(gameId, false),
+}
+
 const State = ({ show, children, setTransitioning }) => {
   const transitionRef = useRef(null);
 
@@ -82,7 +86,18 @@ const State = ({ show, children, setTransitioning }) => {
 export default () => {
   const [transitioning, setTransitioning] = useState(true);
   const gameState = useGameState();
-  useDirectGameLinks();
+  useEffect(() => {
+    const url = new URL(window.location.href);
+    for (let [param, value] of url.searchParams.entries()) {
+      const route = paramRouter[param];
+      if (route) {
+        url.searchParams.delete(param);
+        window.history.replaceState({}, document.title, url.href);
+        route(value);
+        break;
+      }
+    }
+  }, []);
   const needsHF = needsHeaderFooter[gameState];
 
   return (

client/src/components/util/ApiInfo.jsx

@@ -1,8 +1,9 @@
-import React from "react";
-import useApiHealth from "../../hooks/useApiHealth";
+import React, { useEffect, useState } from "react";
+import { getStatus } from "../../domain/apiMethods";
 
 export default () => {
-  const data = useApiHealth();
+  const [data, setData] = useState(null);
+  useEffect(() => { getStatus().then(setData) }, []);
   
   if (data === null) {
     return <p>Connecting to back-end...</p>

client/src/components/util/DelayedButton.jsx

@@ -1,5 +1,25 @@
-import React, { useState } from "react";
-import useCountdown from "../../hooks/useCountdown";
+import React, { useEffect, useRef, useState } from "react";
+
+const useCountdown = (seconds, onEnd) => {
+  const [finished, setFinished] = useState(false);
+  const [remaining, setRemaining] = useState(seconds);
+  const [paused, setPaused] = useState(false);
+  const remainingMut = useRef(seconds);
+
+  useEffect(() => {
+    const timer = setInterval(() =>{ if (!paused) { setRemaining(remainingMut.current -= 1) }}, 1000);
+    return () => clearInterval(timer);
+  }, [paused]);
+
+  useEffect(() => {
+    if (!finished && remaining <= 0) {
+      onEnd();
+      setFinished(true);
+    }
+  }, [finished, remaining, onEnd])
+
+  return [remaining, () => setPaused(!paused)];
+}
 
 const CountdownButton = ({ 
   onCancelled, 

client/src/hooks/useApiHealth.jsx

@@ -1,8 +0,0 @@
-import { useState, useEffect } from "react";
-import { getStatus } from "../domain/apiMethods";
-
-export default () => {
-  const [data, setData] = useState(null);
-  useEffect(() => { getStatus().then(setData) }, []);
-  return data;
-}

client/src/hooks/useCountdown.jsx

@@ -1,22 +0,0 @@
-import { useEffect, useState, useRef } from "react";
-
-export default (seconds, onEnd) => {
-  const [finished, setFinished] = useState(false);
-  const [remaining, setRemaining] = useState(seconds);
-  const [paused, setPaused] = useState(false);
-  const remainingMut = useRef(seconds);
-
-  useEffect(() => {
-    const timer = setInterval(() =>{ if (!paused) { setRemaining(remainingMut.current -= 1) }}, 1000);
-    return () => clearInterval(timer);
-  }, [paused]);
-
-  useEffect(() => {
-    if (!finished && remaining <= 0) {
-      onEnd();
-      setFinished(true);
-    }
-  }, [finished, remaining, onEnd])
-
-  return [remaining, () => setPaused(!paused)];
-}

client/src/hooks/useDirectGameLinks.jsx

@@ -1,22 +0,0 @@
-import { useEffect } from "react";
-import { dispatch } from "../domain/gameStore";
-
-const paramRouter = {
-  join: dispatch.goToLobby,
-  summary: gameId => dispatch.goToSummary(gameId, false),
-}
-
-export default () => {
-  useEffect(() => {
-    const url = new URL(window.location.href);
-    for (let [param, value] of url.searchParams.entries()) {
-      const route = paramRouter[param];
-      if (route) {
-        url.searchParams.delete(param);
-        window.history.replaceState({}, document.title, url.href);
-        route(value);
-        break;
-      }
-    }
-  }, []);
-}