diff --git a/frontend/components/game/home/Display.tsx b/frontend/components/game/home/Display.tsx index 18403eb7..8698b518 100644 --- a/frontend/components/game/home/Display.tsx +++ b/frontend/components/game/home/Display.tsx @@ -1,19 +1,20 @@ import { Grid } from '@mui/material'; import { createContext, useMemo, useEffect } from 'react'; -import usePlayStateStore, { +import { + usePlayStateStore, stateNothing, stateWaiting, statePlaying, } from '../../../store/game/home/PlayState'; -import ClientSocket from '../../../store/game/ClientSocket'; -import Start from './Start'; -import Play from './Play'; -import Wait from './Wait'; -import Watch from './Watch'; +import { ClientSocket } from '../../../store/game/ClientSocket'; +import { Start } from './Start'; +import { Play } from './Play'; +import { Wait } from './Wait'; +import { Watch } from './Watch'; export const Context = createContext({} as ClientSocket); -const Display = () => { +export const Display = () => { const clientSocket = useMemo(() => { return new ClientSocket('ws://localhost:3001/game'); }, []); @@ -42,5 +43,3 @@ const Display = () => { ); }; - -export default Display; diff --git a/frontend/components/game/home/Layout.tsx b/frontend/components/game/home/Layout.tsx index 0b5f89b2..7ac6b8f0 100644 --- a/frontend/components/game/home/Layout.tsx +++ b/frontend/components/game/home/Layout.tsx @@ -6,7 +6,7 @@ type Props = { children: ReactNode; }; -const Layout: FC = ({ children, title = 'Next.js' }) => { +export const Layout: FC = ({ children, title = 'Next.js' }) => { return (
@@ -17,5 +17,3 @@ const Layout: FC = ({ children, title = 'Next.js' }) => {
); }; - -export default Layout; diff --git a/frontend/components/game/home/Play.tsx b/frontend/components/game/home/Play.tsx index e705c1a7..eec72f90 100644 --- a/frontend/components/game/home/Play.tsx +++ b/frontend/components/game/home/Play.tsx @@ -1,8 +1,8 @@ import { useState, useCallback, useEffect, useContext } from 'react'; -import useOpponentStore from '../../../store/game/home/Opponent'; +import { useOpponentStore } from '../../../store/game/home/Opponent'; import { Context } from './Display'; -const Play = () => { +export const Play = () => { const [score, setScore] = useState(0); const clientSocket = useContext(Context); const { opponent } = useOpponentStore(); @@ -35,5 +35,3 @@ const Play = () => { ); }; - -export default Play; diff --git a/frontend/components/game/home/Start.tsx b/frontend/components/game/home/Start.tsx index 59c2c564..fc52b0b9 100644 --- a/frontend/components/game/home/Start.tsx +++ b/frontend/components/game/home/Start.tsx @@ -1,12 +1,13 @@ import VideogameAssetSharpIcon from '@mui/icons-material/VideogameAssetSharp'; import { Button, Grid, TextField } from '@mui/material'; import React, { useContext, useRef } from 'react'; -import usePlayStateStore, { +import { + usePlayStateStore, stateWaiting, } from '../../../store/game/home/PlayState'; import { Context } from './Display'; -const Start = () => { +export const Start = () => { const playerNameRef = useRef(null); const clientSocket = useContext(Context); const updatePlayState = usePlayStateStore((store) => store.updatePlayState); @@ -39,5 +40,3 @@ const Start = () => { ); }; - -export default Start; diff --git a/frontend/components/game/home/Wait.tsx b/frontend/components/game/home/Wait.tsx index 78883628..10497f7e 100644 --- a/frontend/components/game/home/Wait.tsx +++ b/frontend/components/game/home/Wait.tsx @@ -1,12 +1,13 @@ import { CircularProgress, Grid } from '@mui/material'; import { useContext, useEffect } from 'react'; -import useOpponentStore from '../../../store/game/home/Opponent'; -import usePlayStateStore, { +import { useOpponentStore } from '../../../store/game/home/Opponent'; +import { + usePlayStateStore, statePlaying, } from '../../../store/game/home/PlayState'; import { Context } from './Display'; -const Wait = () => { +export const Wait = () => { const clientSocket = useContext(Context); const updatePlayState = usePlayStateStore((store) => store.updatePlayState); const updateOpponent = useOpponentStore((store) => store.updateOpponent); @@ -27,5 +28,3 @@ const Wait = () => { ); }; - -export default Wait; diff --git a/frontend/components/game/home/Watch.tsx b/frontend/components/game/home/Watch.tsx index c6365a12..527d6e7a 100644 --- a/frontend/components/game/home/Watch.tsx +++ b/frontend/components/game/home/Watch.tsx @@ -9,7 +9,7 @@ type RoomInfo = { playerName2: string; }; -const Watch = () => { +export const Watch = () => { const clientSocket = useContext(Context); const [rooms, setRooms] = useState([]); @@ -49,5 +49,3 @@ const Watch = () => { ); }; - -export default Watch; diff --git a/frontend/pages/game/home/index.tsx b/frontend/pages/game/home/index.tsx index 4829f130..d826d099 100644 --- a/frontend/pages/game/home/index.tsx +++ b/frontend/pages/game/home/index.tsx @@ -1,6 +1,6 @@ import type { NextPage } from 'next'; -import Layout from '../../../components/game/home/Layout'; -import Display from '../../../components/game/home/Display'; +import { Layout } from '../../../components/game/home/Layout'; +import { Display } from '../../../components/game/home/Display'; const Home: NextPage = () => { return ( diff --git a/frontend/store/game/ClientSocket.tsx b/frontend/store/game/ClientSocket.tsx index 7c2f3e5f..7c1a4f46 100644 --- a/frontend/store/game/ClientSocket.tsx +++ b/frontend/store/game/ClientSocket.tsx @@ -20,4 +20,4 @@ class ClientSocket { } } -export default ClientSocket; +export { ClientSocket }; diff --git a/frontend/store/game/home/Opponent.tsx b/frontend/store/game/home/Opponent.tsx index ab899a70..aea40cbc 100644 --- a/frontend/store/game/home/Opponent.tsx +++ b/frontend/store/game/home/Opponent.tsx @@ -5,7 +5,7 @@ type State = { updateOpponent: (payload: string) => void; }; -const useOpponentStore = create((set) => ({ +export const useOpponentStore = create((set) => ({ opponent: '', updateOpponent: (payload) => { set({ @@ -13,5 +13,3 @@ const useOpponentStore = create((set) => ({ }); }, })); - -export default useOpponentStore; diff --git a/frontend/store/game/home/PlayState.tsx b/frontend/store/game/home/PlayState.tsx index c8584c74..37511d26 100644 --- a/frontend/store/game/home/PlayState.tsx +++ b/frontend/store/game/home/PlayState.tsx @@ -14,7 +14,7 @@ type State = { updatePlayState: (payload: PlayState) => void; }; -const usePlayStateStore = create((set) => ({ +export const usePlayStateStore = create((set) => ({ playState: stateNothing, updatePlayState: (payload) => set({ @@ -23,4 +23,3 @@ const usePlayStateStore = create((set) => ({ })); export { stateNothing, stateWaiting, statePlaying, type PlayState }; -export default usePlayStateStore;