From fc4fac66788bf6f2880c07c3a0f4fbc8207d4657 Mon Sep 17 00:00:00 2001 From: Tatiana Date: Sat, 24 Apr 2021 08:39:02 -0700 Subject: [PATCH 1/3] removes temp folder --- frontend/src/temp/BlackCardExample.js | 29 -- frontend/src/temp/CardHandLayoutExample.js | 32 --- frontend/src/temp/CardWrapperExample.js | 43 --- frontend/src/temp/ComponentLibrary.js | 248 ------------------ frontend/src/temp/CzarHandExample.js | 33 --- .../src/temp/DemoHostContext-SettingsMenu.js | 78 ------ frontend/src/temp/GameSettingsExample.js | 16 -- frontend/src/temp/HostScreenExample.js | 8 - frontend/src/temp/HostSettingsMenuDemo.js | 37 --- frontend/src/temp/ModalExample.js | 59 ----- frontend/src/temp/PlayerHandExample.js | 33 --- frontend/src/temp/SettingsMenuExample.js | 38 --- frontend/src/temp/SingleBlackCardExample.js | 23 -- frontend/src/temp/WhiteCardExample.js | 43 --- frontend/src/temp/myContext/context.js | 50 ---- frontend/src/temp/myContext/context.spec.js | 211 --------------- frontend/src/temp/myContext/reducer.js | 31 --- frontend/src/temp/myContext/reducer.spec.js | 63 ----- frontend/src/temp/playerList.js | 56 ---- 19 files changed, 1131 deletions(-) delete mode 100644 frontend/src/temp/BlackCardExample.js delete mode 100644 frontend/src/temp/CardHandLayoutExample.js delete mode 100644 frontend/src/temp/CardWrapperExample.js delete mode 100644 frontend/src/temp/ComponentLibrary.js delete mode 100644 frontend/src/temp/CzarHandExample.js delete mode 100644 frontend/src/temp/DemoHostContext-SettingsMenu.js delete mode 100644 frontend/src/temp/GameSettingsExample.js delete mode 100644 frontend/src/temp/HostScreenExample.js delete mode 100644 frontend/src/temp/HostSettingsMenuDemo.js delete mode 100644 frontend/src/temp/ModalExample.js delete mode 100644 frontend/src/temp/PlayerHandExample.js delete mode 100644 frontend/src/temp/SettingsMenuExample.js delete mode 100644 frontend/src/temp/SingleBlackCardExample.js delete mode 100644 frontend/src/temp/WhiteCardExample.js delete mode 100644 frontend/src/temp/myContext/context.js delete mode 100644 frontend/src/temp/myContext/context.spec.js delete mode 100644 frontend/src/temp/myContext/reducer.js delete mode 100644 frontend/src/temp/myContext/reducer.spec.js delete mode 100644 frontend/src/temp/playerList.js diff --git a/frontend/src/temp/BlackCardExample.js b/frontend/src/temp/BlackCardExample.js deleted file mode 100644 index 39f8c689..00000000 --- a/frontend/src/temp/BlackCardExample.js +++ /dev/null @@ -1,29 +0,0 @@ -import React from 'react'; -import BlackCard from '../components/Cards/BlackCard'; - -const ex1 = "Knock, knock.\n\n(Who's there?)\n\n_."; -const ex2 = "I left Hamilton because I heard about _'s obsession with _."; -const ex3 = 'Hypothesis: _\nExperiment: _\nConclusion: _'; -const ex4 = 'He alone, who owns the _(s), gains the _(s).'; - -function BlackCardExample() { - return ( -
- {ex1} - {ex2} - {ex3} - {ex4} -
- ); -} - -export default BlackCardExample; diff --git a/frontend/src/temp/CardHandLayoutExample.js b/frontend/src/temp/CardHandLayoutExample.js deleted file mode 100644 index 8fb0e6dc..00000000 --- a/frontend/src/temp/CardHandLayoutExample.js +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; -import CardHandLayout from '../components/CardHandLayout/CardHandLayout'; -import WhiteCard from '../components/Cards/WhiteCard'; - -const myTitle = { - top: "YOU'RE THE CZAR,", - bottom: 'PICK A WINNER', -}; - -// Other title example - -// const myTitle = { -// top: 'PLAYER,', -// bottom: 'PICK 2 CARDS', -// }; - -export default function CardLayoutExample() { - return ( - {}} onSubmit={() => {}}> - Grace - Sully - Briggs - Bender - Tati - Applyd - Rubiks - Pkepler - James - Oreo - - ); -} diff --git a/frontend/src/temp/CardWrapperExample.js b/frontend/src/temp/CardWrapperExample.js deleted file mode 100644 index 8381ac9d..00000000 --- a/frontend/src/temp/CardWrapperExample.js +++ /dev/null @@ -1,43 +0,0 @@ -import React from 'react'; -import CardWrapper from '../components/CardWrapper/CardWrapper'; -import WhiteCard from '../components/Cards/WhiteCard'; - -function CardWrapperExample() { - return ( -
-
- - No value passed into selection prop - -
-
- - Winner string passed into selection prop - -
-
- - Positive number passed into selection prop - -
-
- - Group of winning cards - Group of winning cards - Group of winning cards - -
-
- ); -} - -export default CardWrapperExample; diff --git a/frontend/src/temp/ComponentLibrary.js b/frontend/src/temp/ComponentLibrary.js deleted file mode 100644 index abfa23f4..00000000 --- a/frontend/src/temp/ComponentLibrary.js +++ /dev/null @@ -1,248 +0,0 @@ -import React, { useState } from 'react'; - -import Header from '../components/Header/Header'; -import Button from '../components/Buttons/Button'; -import HamburgerMenu from '../components/Buttons/HamburgerMenu/HamburgerMenu'; -import SocketTest from '../components/SocketTest'; -import PlayerList from '../components/PlayerList/PlayerList'; -import DisplayJoinCode from '../components/JoinCode/JoinCode'; -import BlackCardExample from './BlackCardExample'; -import WhiteCardExample from './WhiteCardExample'; -import WelcomeScreen from '../components/screens/WelcomeScreen/WelcomeScreen'; -import CardWrapperExample from './CardWrapperExample'; - -import PlayerJoinScreen from '../components/screens/PlayerJoinScreen/PlayerJoinScreen'; -import Modal from '../components/Modal/Modal'; -import playerList from './playerList'; -import ModalExample from './ModalExample'; -import SingleBlackCardExample from './SingleBlackCardExample.js'; -import PlayerMessageScreen from '../components/screens/PlayerMessageScreen/PlayerMessageScreen'; -import HostLayout from '../components/layouts/HostLayout'; -import SettingsMenuExample from './SettingsMenuExample'; - -export default function ComponentLibrary() { - const [showSocketTest, setShowSocketTest] = useState(false); - const [showPlayerList, setShowPlayerList] = useState(false); - const [showHamburgerMenu, setHamburgerMenu] = useState(false); - const [hamburgerMenuActive, setHamburgerMenuActive] = useState(false); - const [showHeader, setShowHeader] = useState(false); - const [showJoinCode, setJoinCode] = useState(false); - const [showBlackCards, setShowBlackCards] = useState(false); - const [showWhiteCards, setShowWhiteCards] = useState(false); - const [showModal, setShowModal] = useState(false); - const [showPlayerMessageScreen, setShowPlayerMessageScreen] = useState(false); - const [showWelcomeScreen, setShowWelcomeScreen] = useState(false); - const [showHostLayout, setShowHostLayout] = useState(false); - const [showCardWrapper, setShowCardWrapper] = useState(false); - const [showPlayerJoin, setShowPlayerJoin] = useState(true); - - return ( -
-
- - - - - - - - - - - - - - - - - - - - - -
- - {showHeader && ( -
-
-

- WELCOME TO -

-

- CARDS OF CAROUSAL -

-
-
- )} - - {showSocketTest && } - - {showPlayerList && } - - {showJoinCode && } - - {showHamburgerMenu && ( -
- { - setHamburgerMenuActive(!hamburgerMenuActive); - // eslint-disable-next-line no-console - console.log('hamburger menu clicked'); - }} - /> -
- )} - - {showBlackCards && } - - {showWhiteCards && } - {showBlackCards && } - - {showModal && ( - setShowModal(!showModal)}> - setShowModal(!showModal)} /> - - )} - - {showPlayerMessageScreen && ( - - )} - - {showWelcomeScreen && ( - ''} handleHostClick={() => ''} /> - )} - {showHostLayout && ( - - - - -
- } - right={} - modal={} - /> - )} - {showCardWrapper && } - {showPlayerJoin && } - - ); -} diff --git a/frontend/src/temp/CzarHandExample.js b/frontend/src/temp/CzarHandExample.js deleted file mode 100644 index ba971bcb..00000000 --- a/frontend/src/temp/CzarHandExample.js +++ /dev/null @@ -1,33 +0,0 @@ -import React, { useState } from 'react'; -import styled from 'styled-components'; -import CzarHand from '../components/CzarHand/CzarHand'; - -const CzarExampleStyles = styled.div` - overflow-y: scroll; - display: flex; - flex-direction: row; - gap: 16px; -`; -const cards = [ - [ - "Card One has a REALLLLLLLLY long title and it's going to be rendered small asdfasdfasdfasdfasfasdfasfasdfasdfasfasdfasdfasdfasdfasdfasfasfd", - 'Card Two', - 'Card Three', - ], - ['Card Four', 'Card Five', 'Card Six'], - ['Card Seven', 'Card Eight', 'Card Nine'], -]; - -export default function CzarHandExample() { - const [selectedCard, setSelectedCard] = useState(null); - - return ( - - setSelectedCard(selected)} - /> - - ); -} diff --git a/frontend/src/temp/DemoHostContext-SettingsMenu.js b/frontend/src/temp/DemoHostContext-SettingsMenu.js deleted file mode 100644 index b4098983..00000000 --- a/frontend/src/temp/DemoHostContext-SettingsMenu.js +++ /dev/null @@ -1,78 +0,0 @@ -import React, { createContext, useEffect, useReducer } from 'react'; -import PropTypes from 'prop-types'; - -import HostReducer from './HostReducer'; -import socketInstance from '../../socket/socket'; - -const propTypes = { - children: PropTypes.node.isRequired, -}; - -const { emitter } = socketInstance; - -const initialState = { - gameState: 'waiting-for-lobby', - lobbyID: '', - players: { - player1: { - name: 'BENDER', - submittedCards: [], - }, - player2: { - name: 'BRIGGS', - submittedCards: [], - }, - player3: { - name: 'BRANDON', - submittedCards: [], - }, - player4: { - name: 'BRENDA', - submittedCards: [], - }, - player5: { - name: 'BEERCAN', - submittedCards: [], - }, - }, - playerIDs: ['player1', 'player2', 'player3', 'player4', 'player5'], - gameSettings: { maxPlayers: 8, winningScore: 7, selectedPacks: [] }, -}; - -export const HostContext = createContext(); - -function HostProvider({ children }) { - const [state, dispatch] = useReducer(HostReducer, initialState); - - function handleMessage({ event, payload }) { - switch (event) { - case 'player-connected': - return dispatch({ type: 'PLAYER_CONNECTED', payload }); - case 'player-disconnected': - return dispatch({ type: 'PLAYER_DISCONNECTED', payload }); - case 'select-winner': - return dispatch({ type: 'SELECT_WINNER', payload }); - case 'lobby-created': - return dispatch({ type: 'SET_LOBBY_ID', payload }); - default: - return undefined; - } - } - - useEffect(() => { - emitter.on('message', handleMessage); - return () => { - emitter.off('message', handleMessage); - }; - }, []); - - return ( - - {children} - - ); -} - -HostProvider.propTypes = propTypes; - -export default HostProvider; diff --git a/frontend/src/temp/GameSettingsExample.js b/frontend/src/temp/GameSettingsExample.js deleted file mode 100644 index 086bbb78..00000000 --- a/frontend/src/temp/GameSettingsExample.js +++ /dev/null @@ -1,16 +0,0 @@ -import React, { useState } from 'react'; -import GameSettings from '../components/GameSettings/GameSettings'; - -export default function GameSettingsExample() { - const [gameSettings, setGameSettings] = useState({ - maxPlayers: 5, - winningScore: 6, - selectedPacks: [0, 1, 2, 3, 4], - }); - - return ( -
- -
- ); -} diff --git a/frontend/src/temp/HostScreenExample.js b/frontend/src/temp/HostScreenExample.js deleted file mode 100644 index 91a4da49..00000000 --- a/frontend/src/temp/HostScreenExample.js +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react'; -import HostLayout from '../components/layouts/HostLayout'; - -export default function HostScreenExample() { - return ( - left

} right={

right

} modal={

modal

} /> - ); -} diff --git a/frontend/src/temp/HostSettingsMenuDemo.js b/frontend/src/temp/HostSettingsMenuDemo.js deleted file mode 100644 index bbd4e684..00000000 --- a/frontend/src/temp/HostSettingsMenuDemo.js +++ /dev/null @@ -1,37 +0,0 @@ -/* eslint-disable */ -import React from 'react'; - -import './reset.css'; -import './App.css'; - -import PlayerList from './components/PlayerList/PlayerList'; -import DisplayJoinCode from './components/JoinCode/JoinCode'; -import playerList from './temp/playerList'; -import SingleBlackCardExample from './temp/SingleBlackCardExample.js'; -import HostLayout from './components/layouts/HostLayout'; -import HostSettingsMenu from './components/HostSettingsMenu/HostSettingsMenu'; - -function App() { - return ( - - - - - } - right={} - modal={} - /> - ); -} - -export default App; diff --git a/frontend/src/temp/ModalExample.js b/frontend/src/temp/ModalExample.js deleted file mode 100644 index e3f96507..00000000 --- a/frontend/src/temp/ModalExample.js +++ /dev/null @@ -1,59 +0,0 @@ -import PropTypes from 'prop-types'; -import React from 'react'; -import styled from 'styled-components'; - -const Container = styled.div` - position: relative; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 70vw; - height: 70vh; - border-radius: 24px; - padding: 48px; - background: white; - display: flex; - align-items: center; - justify-content: center; - - && h1 { - font-size: 48px; - } - - && p { - font-size: 24px; - padding-bottom: 24px; - } - - && button { - background-color: green; - color: white; - text-transform: uppercase; - border-radius: 12px; - border: none; - outline: none; - padding: 12px; - cursor: pointer; - } -`; - -export default function ModalExample({ toggleModal }) { - return ( - -
-

Modal Example

-

- Velit incididunt nostrud quis mollit ex sunt laboris aute. Magna nisi - eismod non dolor ea. -

- -
-
- ); -} - -ModalExample.propTypes = { - toggleModal: PropTypes.func.isRequired, -}; diff --git a/frontend/src/temp/PlayerHandExample.js b/frontend/src/temp/PlayerHandExample.js deleted file mode 100644 index 21159e9d..00000000 --- a/frontend/src/temp/PlayerHandExample.js +++ /dev/null @@ -1,33 +0,0 @@ -import React, { useState } from 'react'; - -import PlayerHand from '../components/PlayerHand/PlayerHand'; - -const whiteCards = ['Briggs', 'Bender', 'Grace', 'hi', 'bye']; - -function PlayerHandExample() { - const [selectedCards, setSelectedCards] = useState([1, 4]); - return ( -
- { - setSelectedCards(arr); - console.log(arr); - }} - /> -
- ); -} - -export default PlayerHandExample; diff --git a/frontend/src/temp/SettingsMenuExample.js b/frontend/src/temp/SettingsMenuExample.js deleted file mode 100644 index aae10d2f..00000000 --- a/frontend/src/temp/SettingsMenuExample.js +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; -import styled from 'styled-components'; - -const SettingsModal = styled.div` - position: absolute; - top: 0; - right: 0; - bottom: 0; - height: 100%; - width: 25%; - background-color: var(--secondary-background-color); - display: flex; - flex-direction: column; - - .settings-text { - font-size: 3rem; - line-height: 3rem; - margin-bottom: -11px; - color: var(--secondary-text-color); - display: flex; - flex-direction: column-reverse; - flex: 1; - } - - .white-box { - background-color: var(--primary-background-color); - flex: 7; - } -`; - -export default function SettingsMenuExample() { - return ( - -

SETTINGS

-
- - ); -} diff --git a/frontend/src/temp/SingleBlackCardExample.js b/frontend/src/temp/SingleBlackCardExample.js deleted file mode 100644 index eb6cdeb4..00000000 --- a/frontend/src/temp/SingleBlackCardExample.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react'; -import BlackCard from '../components/Cards/BlackCard'; - -const ex1 = "Knock, knock.\n\n(Who's there?)\n\n_."; - -function SingleBlackCardExample() { - return ( -
- {ex1} -
- ); -} - -export default SingleBlackCardExample; diff --git a/frontend/src/temp/WhiteCardExample.js b/frontend/src/temp/WhiteCardExample.js deleted file mode 100644 index afc95219..00000000 --- a/frontend/src/temp/WhiteCardExample.js +++ /dev/null @@ -1,43 +0,0 @@ -import React from 'react'; -import WhiteCard from '../components/Cards/WhiteCard'; - -function WhiteCardExample() { - return ( -
-
- - Stacked card SVG hidden when string too long. Extra text. Extra text. - Extra text. Extra text. Extra text. Extra text. Extra text. - -
-
- I want to do it by myseeeeeeeelf! -
-
- - This card is overflowing and the text is smaller ---- Lorem ipsum - dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor - incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, - quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea - commodo consequat. Duis aute irure dolor in reprehenderit in voluptate - velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint - occaecat cupidatat non proident, sunt in culpa qui officia deserunt - mollit anim id est laborum. - -
-
- A baby that smokes and plays the ukulele -
-
- ); -} - -export default WhiteCardExample; diff --git a/frontend/src/temp/myContext/context.js b/frontend/src/temp/myContext/context.js deleted file mode 100644 index e98d5f88..00000000 --- a/frontend/src/temp/myContext/context.js +++ /dev/null @@ -1,50 +0,0 @@ -import React, { createContext, useReducer, useEffect } from 'react'; -import reducer from './reducer'; -import socketInstance from '../../socket/socket'; - -const { emitter } = socketInstance; - -const initialState = { - lobbyId: '', - socketIsActive: false, - isHosting: false, -}; - -export const StoreContext = createContext(); -// We may want to wrap this in a method so we can pass -// in the initial state instead of defining it here in the future -// eslint-disable-next-line react/prop-types -export function StoreProvider({ children }) { - const [state, dispatch] = useReducer(reducer, initialState); - - function handleMessage({ event, payload }) { - // Development only: log messages to console - if (process.env.NODE_ENV === 'development') { - // eslint-disable-next-line no-console - console.log('Handling message: ', { event, payload }); - } - switch (event) { - case 'lobby-created': - return dispatch({ type: 'LOBBY_CREATED', payload }); - case 'socket-open': - return dispatch({ type: 'SOCKET_OPENED', payload }); - case 'socket-close': - return dispatch({ type: 'SOCKET_CLOSED', payload }); - default: - return undefined; - } - } - - useEffect(() => { - emitter.on('message', handleMessage); - return () => { - emitter.off('message', handleMessage); - }; - }, []); - - return ( - - {children} - - ); -} diff --git a/frontend/src/temp/myContext/context.spec.js b/frontend/src/temp/myContext/context.spec.js deleted file mode 100644 index 4aaa9795..00000000 --- a/frontend/src/temp/myContext/context.spec.js +++ /dev/null @@ -1,211 +0,0 @@ -import React, { useContext } from 'react'; -import { render, screen, act } from '@testing-library/react'; -import socketInstance from '../../socket/socket'; - -import { StoreContext, StoreProvider } from './context'; - -jest.mock('../../socket/socket', () => ({ - emitter: { - on: jest.fn(), - off: jest.fn(), - emit: jest.fn(), - }, -})); - -// Need to do this to reset the implementation of each jest mock function, this needs to be -// called every time we expect to check the values of these, or call an eventHandler -function setupEmitterMocks() { - const eventHandlers = {}; - - socketInstance.emitter.on.mockImplementation((event, cb) => { - eventHandlers[event] = cb; - }); - - socketInstance.emitter.off.mockImplementation((event) => { - eventHandlers[event] = undefined; - }); - - socketInstance.emitter.emit.mockImplementation((event, payload) => { - eventHandlers[event](payload); - }); - - return { - eventHandlers, - }; -} - -describe('context', () => { - it('renders children with our provider', () => { - // Our provider takes in a props.children argument. This tests that children are passed down. - render( - -

Hello world

-
, - ); - - expect(screen.getByText('Hello world')).toBeInTheDocument(); - }); - - it('sets the default values', () => { - // this is a reusable test component that bypasses the context provider used in the app - // so we can test the context with a dummy provider. This is just to test "state" and "dispatch" - const TestComponent = () => { - const { state } = useContext(StoreContext); - - return ( - <> -
{state.lobbyId.toString()}
-
- {state.socketIsActive.toString()} -
-
{state.isHosting.toString()}
- - ); - }; - - render( - - - , - ); - - expect(screen.getByTestId('lobbyId')).toHaveTextContent(''); - expect(screen.getByTestId('socketIsActive')).toHaveTextContent('false'); - expect(screen.getByTestId('isHosting')).toHaveTextContent('false'); - }); - - describe('event handler', () => { - it('calls the "LOBBY_CREATED" reducer when "lobby-created" event is received', () => { - const TestComponent = () => { - const { state } = useContext(StoreContext); - - return ( - <> -
{state.lobbyId.toString()}
-
- {state.socketIsActive.toString()} -
-
{state.isHosting.toString()}
- - ); - }; - - const { eventHandlers } = setupEmitterMocks(); - - render( - - - , - ); - - act(() => { - eventHandlers.message({ - event: 'lobby-created', - payload: { id: '123' }, - }); - }); - - expect(screen.getByTestId('lobbyId')).toHaveTextContent('123'); - }); - - it('calls the "SOCKET_OPENED" reducer when "socket-open" event is received', () => { - function TestComponent() { - const { state } = useContext(StoreContext); - - return ( - <> -
{state.lobbyId.toString()}
-
- {state.socketIsActive.toString()} -
-
{state.isHosting.toString()}
- - ); - } - - const { eventHandlers } = setupEmitterMocks(); - - render( - - - , - ); - - act(() => { - eventHandlers.message({ event: 'socket-open' }); - }); - - expect(screen.getByTestId('socketIsActive')).toHaveTextContent('true'); - }); - - it('calls the "SOCKET_CLOSED" reducer when "socket-closed" event is received', async () => { - function TestComponent() { - const { state } = useContext(StoreContext); - - return ( - <> -
{state.lobbyId.toString()}
-
- {state.socketIsActive.toString()} -
-
{state.isHosting.toString()}
- - ); - } - - const { eventHandlers } = setupEmitterMocks(); - - render( - - - , - ); - - act(() => { - eventHandlers.message({ event: 'socket-open' }); - }); - - // Just to make sure it's been changed to true before checking if it's changed to false - expect(screen.getByTestId('socketIsActive')).toHaveTextContent('true'); - - act(() => { - eventHandlers.message({ event: 'socket-close' }); - }); - - expect(screen.getByTestId('socketIsActive')).toHaveTextContent('false'); - }); - - it('ignores unrecognized events', () => { - function TestComponent() { - const { state } = useContext(StoreContext); - - return ( - <> -
{state.lobbyId.toString()}
-
- {state.socketIsActive.toString()} -
-
{state.isHosting.toString()}
- - ); - } - - const { eventHandlers } = setupEmitterMocks(); - - render( - - - , - ); - - act(() => { - eventHandlers.message({ event: 'socket-wtf' }); - }); - - // Initial state - expect(screen.getByTestId('lobbyId')).toHaveTextContent(''); - expect(screen.getByTestId('socketIsActive')).toHaveTextContent('false'); - expect(screen.getByTestId('isHosting')).toHaveTextContent('false'); - }); - }); -}); diff --git a/frontend/src/temp/myContext/reducer.js b/frontend/src/temp/myContext/reducer.js deleted file mode 100644 index 3d42fb12..00000000 --- a/frontend/src/temp/myContext/reducer.js +++ /dev/null @@ -1,31 +0,0 @@ -// TODO: refactor to use individual functions for each case - -function reducer(state, action) { - const { type, payload } = action; - switch (type) { - case 'LOBBY_CREATED': { - return { - ...state, - lobbyId: payload.id, - }; - } - case 'SOCKET_OPENED': { - return { - ...state, - socketIsActive: true, - }; - } - case 'SOCKET_CLOSED': { - return { - ...state, - socketIsActive: false, - }; - } - default: - return { - ...state, - }; - } -} - -export default reducer; diff --git a/frontend/src/temp/myContext/reducer.spec.js b/frontend/src/temp/myContext/reducer.spec.js deleted file mode 100644 index 5164f1eb..00000000 --- a/frontend/src/temp/myContext/reducer.spec.js +++ /dev/null @@ -1,63 +0,0 @@ -const reducer = require('./reducer').default; - -describe('reducer', () => { - describe('default', () => { - it('returns a copy of state when no case is matched', () => { - const state = { - otherState: 'hello', - lobbyId: undefined, - }; - - const result = reducer(state, { - type: 'SOME_RANDOM', - payload: { id: '1234' }, - }); - expect(result).not.toBe(state); - expect(result).toMatchObject(state); - }); - }); - - describe('LOBBY_CREATED', () => { - it('returns a copy of state with "lobbyId" set to the proper value', () => { - const state = { - otherState: 'hello', - lobbyId: undefined, - }; - - const result = reducer(state, { - type: 'LOBBY_CREATED', - payload: { id: '1234' }, - }); - expect(result).not.toBe(state); - expect(result.lobbyId).toBe('1234'); - }); - }); - - describe('SOCKET_OPENED', () => { - it('returns a copy of state with "socketIsActive" to true', () => { - const state = { - otherState: 'hello', - lobbyId: undefined, - socketIsActive: false, - }; - - const result = reducer(state, { type: 'SOCKET_OPENED', payload: {} }); - expect(result).not.toBe(state); - expect(result.socketIsActive).toBe(true); - }); - }); - - describe('SOCKET_CLOSED', () => { - it('returns a copy of state with "socketIsActive" set to false', () => { - const state = { - otherState: 'hello', - lobbyId: undefined, - socketIsActive: true, - }; - - const result = reducer(state, { type: 'SOCKET_CLOSED', payload: {} }); - expect(result).not.toBe(state); - expect(result.socketIsActive).toBe(false); - }); - }); -}); diff --git a/frontend/src/temp/playerList.js b/frontend/src/temp/playerList.js deleted file mode 100644 index ed14c8b6..00000000 --- a/frontend/src/temp/playerList.js +++ /dev/null @@ -1,56 +0,0 @@ -const playerList = { - players: { - playerID1: { - name: 'Bender', - score: 3, - isCzar: false, - submittedCards: [1, 4], - cards: [], - }, - playerID2: { - name: 'Bacon', - score: 5, - isCzar: true, - submittedCards: [], - cards: [], - }, - playerID3: { - name: 'Briggs', - score: 0, - isCzar: false, - submittedCards: [5, 6], - cards: [], - }, - playerID4: { - name: 'Pedro', - score: 10, - isCzar: false, - submittedCards: [], - cards: [], - }, - playerID5: { - name: 'Foo', - score: 9, - isCzar: false, - submittedCards: [2, 5], - cards: [], - }, - playerID6: { - name: 'Bar', - score: 15, - isCzar: false, - submittedCards: [], - cards: [], - }, - }, - playersIDs: [ - 'playerID1', - 'playerID2', - 'playerID3', - 'playerID4', - 'playerID5', - 'playerID6', - ], -}; - -export default playerList; From 685e526a011f27a6a02d69ecea7315b2f3dc0c0b Mon Sep 17 00:00:00 2001 From: Tatiana Date: Sat, 24 Apr 2021 08:58:32 -0700 Subject: [PATCH 2/3] refactors file directory to make screens, screenControllers, and layouts siblings of the components folder, and updates file paths --- frontend/package-lock.json | 10 +++------- frontend/src/App.js | 6 +++--- .../CardHandLayout/CardHandLayout.js | 4 ++-- .../CardHandLayout/CardHandLayout.spec.js | 0 .../__snapshots__/CardHandLayout.spec.js.snap | 0 .../src/{components => }/layouts/HostLayout.js | 6 +++--- .../{components => }/layouts/HostLayout.spec.js | 0 .../layouts/__snapshots__/HostLayout.spec.js.snap | 0 .../HostScreenController/HostScreenController.js | 2 +- .../HostScreenController.spec.js | 2 +- .../PlayerScreenController.js | 2 +- .../PlayerScreenController.spec.js | 2 +- .../screens/CzarHandScreen/CzarHandScreen.js | 6 +++--- .../screens/CzarHandScreen/CzarHandScreen.spec.js | 2 +- .../__snapshots__/CzarHandScreen.spec.js.snap | 0 .../HostBlackCardScreen/HostBlackCardScreen.js | 10 +++++----- .../HostBlackCardScreen.spec.js | 4 ++-- .../__snapshots__/HostBlackCardScreen.spec.js.snap | 0 .../screens/HostPregameScreen/HostPregameScreen.js | 14 +++++++------- .../HostPregameScreen/HostPregameScreen.spec.js | 4 ++-- .../__snapshots__/HostPregameScreen.spec.js.snap | 0 .../screens/HostWinnerScreen/HostWinnerScreen.js | 12 ++++++------ .../HostWinnerScreen/HostWinnerScreen.spec.js | 2 +- .../__snapshots__/HostWinnerScreen.spec.js.snap | 0 .../screens/PlayerHandScreen/PlayerHandScreen.js | 6 +++--- .../PlayerHandScreen/PlayerHandScreen.spec.js | 2 +- .../__snapshots__/PlayerHandScreen.spec.js.snap | 0 .../screens/PlayerJoinScreen/PlayerJoinScreen.js | 8 ++++---- .../PlayerJoinScreen/PlayerJoinScreen.spec.js | 2 +- .../__snapshots__/PlayerJoinScreen.spec.js.snap | 0 .../PlayerMessageScreen/PlayerMessageScreen.js | 8 ++++---- .../PlayerMessageScreen.spec.js | 2 +- .../screens/WelcomeScreen/WelcomeScreen.js | 6 +++--- .../screens/WelcomeScreen/WelcomeScreen.spec.js | 0 .../__snapshots__/WelcomeScreen.spec.js.snap | 0 .../WinnerSelectScreen/WinnerSelectScreen.js | 12 ++++++------ .../WinnerSelectScreen/WinnerSelectScreen.spec.js | 2 +- .../__snapshots__/WinnerSelectScreen.spec.js.snap | 0 38 files changed, 66 insertions(+), 70 deletions(-) rename frontend/src/{components => layouts}/CardHandLayout/CardHandLayout.js (96%) rename frontend/src/{components => layouts}/CardHandLayout/CardHandLayout.spec.js (100%) rename frontend/src/{components => layouts}/CardHandLayout/__snapshots__/CardHandLayout.spec.js.snap (100%) rename frontend/src/{components => }/layouts/HostLayout.js (93%) rename frontend/src/{components => }/layouts/HostLayout.spec.js (100%) rename frontend/src/{components => }/layouts/__snapshots__/HostLayout.spec.js.snap (100%) rename frontend/src/{components => }/screenControllers/HostScreenController/HostScreenController.js (93%) rename frontend/src/{components => }/screenControllers/HostScreenController/HostScreenController.spec.js (98%) rename frontend/src/{components => }/screenControllers/PlayerScreenController/PlayerScreenController.js (93%) rename frontend/src/{components => }/screenControllers/PlayerScreenController/PlayerScreenController.spec.js (98%) rename frontend/src/{components => }/screens/CzarHandScreen/CzarHandScreen.js (81%) rename frontend/src/{components => }/screens/CzarHandScreen/CzarHandScreen.spec.js (98%) rename frontend/src/{components => }/screens/CzarHandScreen/__snapshots__/CzarHandScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/HostBlackCardScreen/HostBlackCardScreen.js (91%) rename frontend/src/{components => }/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js (98%) rename frontend/src/{components => }/screens/HostBlackCardScreen/__snapshots__/HostBlackCardScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/HostPregameScreen/HostPregameScreen.js (90%) rename frontend/src/{components => }/screens/HostPregameScreen/HostPregameScreen.spec.js (98%) rename frontend/src/{components => }/screens/HostPregameScreen/__snapshots__/HostPregameScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/HostWinnerScreen/HostWinnerScreen.js (90%) rename frontend/src/{components => }/screens/HostWinnerScreen/HostWinnerScreen.spec.js (98%) rename frontend/src/{components => }/screens/HostWinnerScreen/__snapshots__/HostWinnerScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/PlayerHandScreen/PlayerHandScreen.js (84%) rename frontend/src/{components => }/screens/PlayerHandScreen/PlayerHandScreen.spec.js (98%) rename frontend/src/{components => }/screens/PlayerHandScreen/__snapshots__/PlayerHandScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/PlayerJoinScreen/PlayerJoinScreen.js (97%) rename frontend/src/{components => }/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js (98%) rename frontend/src/{components => }/screens/PlayerJoinScreen/__snapshots__/PlayerJoinScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/PlayerMessageScreen/PlayerMessageScreen.js (88%) rename frontend/src/{components => }/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js (97%) rename frontend/src/{components => }/screens/WelcomeScreen/WelcomeScreen.js (97%) rename frontend/src/{components => }/screens/WelcomeScreen/WelcomeScreen.spec.js (100%) rename frontend/src/{components => }/screens/WelcomeScreen/__snapshots__/WelcomeScreen.spec.js.snap (100%) rename frontend/src/{components => }/screens/WinnerSelectScreen/WinnerSelectScreen.js (87%) rename frontend/src/{components => }/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js (98%) rename frontend/src/{components => }/screens/WinnerSelectScreen/__snapshots__/WinnerSelectScreen.spec.js.snap (100%) diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 401877d3..24a856dc 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -1606,7 +1606,6 @@ "jest-resolve": "^26.6.2", "jest-util": "^26.6.2", "jest-worker": "^26.6.2", - "node-notifier": "^8.0.0", "slash": "^3.0.0", "source-map": "^0.6.0", "string-length": "^4.0.1", @@ -9405,7 +9404,6 @@ "@types/node": "*", "anymatch": "^3.0.3", "fb-watchman": "^2.0.0", - "fsevents": "^2.1.2", "graceful-fs": "^4.2.4", "jest-regex-util": "^26.0.0", "jest-serializer": "^26.6.2", @@ -13801,7 +13799,6 @@ "eslint-webpack-plugin": "^2.1.0", "file-loader": "6.1.1", "fs-extra": "^9.0.1", - "fsevents": "^2.1.3", "html-webpack-plugin": "4.5.0", "identity-obj-proxy": "3.0.0", "jest": "26.6.0", @@ -17072,10 +17069,8 @@ "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz", "integrity": "sha512-9P3MWk6SrKjHsGkLT2KHXdQ/9SNkyoJbabxnKOoJepsvJjJG8uYTR3yTPxPQvNDI3w4Nz1xnE0TLHK4RIVe/MQ==", "dependencies": { - "chokidar": "^3.4.1", "graceful-fs": "^4.1.2", - "neo-async": "^2.5.0", - "watchpack-chokidar2": "^2.0.1" + "neo-async": "^2.5.0" }, "optionalDependencies": { "chokidar": "^3.4.1", @@ -17206,6 +17201,7 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", + "hasInstallScript": true, "optional": true, "os": [ "darwin" @@ -17574,7 +17570,6 @@ "anymatch": "^2.0.0", "async-each": "^1.0.1", "braces": "^2.3.2", - "fsevents": "^1.2.7", "glob-parent": "^3.1.0", "inherits": "^2.0.3", "is-binary-path": "^1.0.0", @@ -17675,6 +17670,7 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", + "hasInstallScript": true, "optional": true, "os": [ "darwin" diff --git a/frontend/src/App.js b/frontend/src/App.js index 42b4b0ef..5617ec0c 100644 --- a/frontend/src/App.js +++ b/frontend/src/App.js @@ -3,9 +3,9 @@ import React, { useState } from 'react'; import './reset.css'; import './App.css'; -import WelcomeScreen from './components/screens/WelcomeScreen/WelcomeScreen'; -import HostScreenController from './components/screenControllers/HostScreenController/HostScreenController'; -import PlayerScreenController from './components/screenControllers/PlayerScreenController/PlayerScreenController'; +import WelcomeScreen from './screens/WelcomeScreen/WelcomeScreen'; +import HostScreenController from './screenControllers/HostScreenController/HostScreenController'; +import PlayerScreenController from './screenControllers/PlayerScreenController/PlayerScreenController'; import { PlayerProvider } from './contexts/PlayerContext/PlayerContext'; import HostProvider from './contexts/HostContext/HostContext'; diff --git a/frontend/src/components/CardHandLayout/CardHandLayout.js b/frontend/src/layouts/CardHandLayout/CardHandLayout.js similarity index 96% rename from frontend/src/components/CardHandLayout/CardHandLayout.js rename to frontend/src/layouts/CardHandLayout/CardHandLayout.js index 6ee86f09..86ee3311 100644 --- a/frontend/src/components/CardHandLayout/CardHandLayout.js +++ b/frontend/src/layouts/CardHandLayout/CardHandLayout.js @@ -3,8 +3,8 @@ import styled from 'styled-components'; import PropTypes from 'prop-types'; import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; -import Button from '../Buttons/Button'; -import Header from '../Header/Header'; +import Button from '../../components/Buttons/Button'; +import Header from '../../components/Header/Header'; const propTypes = { title: PropTypes.shape({ diff --git a/frontend/src/components/CardHandLayout/CardHandLayout.spec.js b/frontend/src/layouts/CardHandLayout/CardHandLayout.spec.js similarity index 100% rename from frontend/src/components/CardHandLayout/CardHandLayout.spec.js rename to frontend/src/layouts/CardHandLayout/CardHandLayout.spec.js diff --git a/frontend/src/components/CardHandLayout/__snapshots__/CardHandLayout.spec.js.snap b/frontend/src/layouts/CardHandLayout/__snapshots__/CardHandLayout.spec.js.snap similarity index 100% rename from frontend/src/components/CardHandLayout/__snapshots__/CardHandLayout.spec.js.snap rename to frontend/src/layouts/CardHandLayout/__snapshots__/CardHandLayout.spec.js.snap diff --git a/frontend/src/components/layouts/HostLayout.js b/frontend/src/layouts/HostLayout.js similarity index 93% rename from frontend/src/components/layouts/HostLayout.js rename to frontend/src/layouts/HostLayout.js index f72f8ddb..3763a426 100644 --- a/frontend/src/components/layouts/HostLayout.js +++ b/frontend/src/layouts/HostLayout.js @@ -2,9 +2,9 @@ import React, { useState } from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; -import HamburgerMenu from '../Buttons/HamburgerMenu/HamburgerMenu.js'; -import Header from '../Header/Header.js'; -import Modal from '../Modal/Modal.js'; +import HamburgerMenu from '../components/Buttons/HamburgerMenu/HamburgerMenu.js'; +import Header from '../components/Header/Header.js'; +import Modal from '../components/Modal/Modal.js'; const propTypes = { left: PropTypes.node.isRequired, diff --git a/frontend/src/components/layouts/HostLayout.spec.js b/frontend/src/layouts/HostLayout.spec.js similarity index 100% rename from frontend/src/components/layouts/HostLayout.spec.js rename to frontend/src/layouts/HostLayout.spec.js diff --git a/frontend/src/components/layouts/__snapshots__/HostLayout.spec.js.snap b/frontend/src/layouts/__snapshots__/HostLayout.spec.js.snap similarity index 100% rename from frontend/src/components/layouts/__snapshots__/HostLayout.spec.js.snap rename to frontend/src/layouts/__snapshots__/HostLayout.spec.js.snap diff --git a/frontend/src/components/screenControllers/HostScreenController/HostScreenController.js b/frontend/src/screenControllers/HostScreenController/HostScreenController.js similarity index 93% rename from frontend/src/components/screenControllers/HostScreenController/HostScreenController.js rename to frontend/src/screenControllers/HostScreenController/HostScreenController.js index 79184fb1..47c87ea9 100644 --- a/frontend/src/components/screenControllers/HostScreenController/HostScreenController.js +++ b/frontend/src/screenControllers/HostScreenController/HostScreenController.js @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import HostPregameScreen from '../../screens/HostPregameScreen/HostPregameScreen'; import WinnerSelectScreen from '../../screens/WinnerSelectScreen/WinnerSelectScreen'; import HostBlackCardScreen from '../../screens/HostBlackCardScreen/HostBlackCardScreen'; diff --git a/frontend/src/components/screenControllers/HostScreenController/HostScreenController.spec.js b/frontend/src/screenControllers/HostScreenController/HostScreenController.spec.js similarity index 98% rename from frontend/src/components/screenControllers/HostScreenController/HostScreenController.spec.js rename to frontend/src/screenControllers/HostScreenController/HostScreenController.spec.js index eadd1f97..a0c9bd58 100644 --- a/frontend/src/components/screenControllers/HostScreenController/HostScreenController.spec.js +++ b/frontend/src/screenControllers/HostScreenController/HostScreenController.spec.js @@ -1,6 +1,6 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import HostScreenController from './HostScreenController'; import HostPregameScreen from '../../screens/HostPregameScreen/HostPregameScreen'; diff --git a/frontend/src/components/screenControllers/PlayerScreenController/PlayerScreenController.js b/frontend/src/screenControllers/PlayerScreenController/PlayerScreenController.js similarity index 93% rename from frontend/src/components/screenControllers/PlayerScreenController/PlayerScreenController.js rename to frontend/src/screenControllers/PlayerScreenController/PlayerScreenController.js index dba692c8..611c31ef 100644 --- a/frontend/src/components/screenControllers/PlayerScreenController/PlayerScreenController.js +++ b/frontend/src/screenControllers/PlayerScreenController/PlayerScreenController.js @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; import PlayerJoinScreen from '../../screens/PlayerJoinScreen/PlayerJoinScreen'; import PlayerMessageScreen from '../../screens/PlayerMessageScreen/PlayerMessageScreen'; import PlayerHandScreen from '../../screens/PlayerHandScreen/PlayerHandScreen'; diff --git a/frontend/src/components/screenControllers/PlayerScreenController/PlayerScreenController.spec.js b/frontend/src/screenControllers/PlayerScreenController/PlayerScreenController.spec.js similarity index 98% rename from frontend/src/components/screenControllers/PlayerScreenController/PlayerScreenController.spec.js rename to frontend/src/screenControllers/PlayerScreenController/PlayerScreenController.spec.js index 1a4c6031..d58ce1a0 100644 --- a/frontend/src/components/screenControllers/PlayerScreenController/PlayerScreenController.spec.js +++ b/frontend/src/screenControllers/PlayerScreenController/PlayerScreenController.spec.js @@ -1,6 +1,6 @@ import { render, screen } from '@testing-library/react'; import React from 'react'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; import PlayerScreenController from './PlayerScreenController'; import PlayerJoinScreen from '../../screens/PlayerJoinScreen/PlayerJoinScreen'; diff --git a/frontend/src/components/screens/CzarHandScreen/CzarHandScreen.js b/frontend/src/screens/CzarHandScreen/CzarHandScreen.js similarity index 81% rename from frontend/src/components/screens/CzarHandScreen/CzarHandScreen.js rename to frontend/src/screens/CzarHandScreen/CzarHandScreen.js index 55ecc92e..cc9d3769 100644 --- a/frontend/src/components/screens/CzarHandScreen/CzarHandScreen.js +++ b/frontend/src/screens/CzarHandScreen/CzarHandScreen.js @@ -1,8 +1,8 @@ import React, { useContext, useState } from 'react'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; -import CardHandLayout from '../../CardHandLayout/CardHandLayout'; -import CzarHand from '../../CzarHand/CzarHand'; +import CardHandLayout from '../../layouts/CardHandLayout/CardHandLayout'; +import CzarHand from '../../components/CzarHand/CzarHand'; export default function CzarHandScreen() { const { state, dispatch } = useContext(PlayerContext); diff --git a/frontend/src/components/screens/CzarHandScreen/CzarHandScreen.spec.js b/frontend/src/screens/CzarHandScreen/CzarHandScreen.spec.js similarity index 98% rename from frontend/src/components/screens/CzarHandScreen/CzarHandScreen.spec.js rename to frontend/src/screens/CzarHandScreen/CzarHandScreen.spec.js index 12080c75..357c4fc3 100644 --- a/frontend/src/components/screens/CzarHandScreen/CzarHandScreen.spec.js +++ b/frontend/src/screens/CzarHandScreen/CzarHandScreen.spec.js @@ -3,7 +3,7 @@ import { render, screen, act } from '@testing-library/react'; import renderer from 'react-test-renderer'; import userEvent from '@testing-library/user-event'; import CzarHandScreen from './CzarHandScreen'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; describe('CzarHandScreen', () => { describe('render', () => { diff --git a/frontend/src/components/screens/CzarHandScreen/__snapshots__/CzarHandScreen.spec.js.snap b/frontend/src/screens/CzarHandScreen/__snapshots__/CzarHandScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/CzarHandScreen/__snapshots__/CzarHandScreen.spec.js.snap rename to frontend/src/screens/CzarHandScreen/__snapshots__/CzarHandScreen.spec.js.snap diff --git a/frontend/src/components/screens/HostBlackCardScreen/HostBlackCardScreen.js b/frontend/src/screens/HostBlackCardScreen/HostBlackCardScreen.js similarity index 91% rename from frontend/src/components/screens/HostBlackCardScreen/HostBlackCardScreen.js rename to frontend/src/screens/HostBlackCardScreen/HostBlackCardScreen.js index 50ad33f2..226b7ce1 100644 --- a/frontend/src/components/screens/HostBlackCardScreen/HostBlackCardScreen.js +++ b/frontend/src/screens/HostBlackCardScreen/HostBlackCardScreen.js @@ -1,11 +1,11 @@ import React, { useContext, useEffect } from 'react'; import styled from 'styled-components'; import HostLayout from '../../layouts/HostLayout'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; -import PlayerList from '../../PlayerList/PlayerList'; -import InGameSettingsModal from '../../HostSettingsMenu/InGameSettingsModal.js'; -import JoinCode from '../../JoinCode/JoinCode'; -import BlackCard from '../../Cards/BlackCard'; +import { HostContext } from '../../contexts/HostContext/HostContext'; +import PlayerList from '../../components/PlayerList/PlayerList'; +import InGameSettingsModal from '../../components/HostSettingsMenu/InGameSettingsModal.js'; +import JoinCode from '../../components/JoinCode/JoinCode'; +import BlackCard from '../../components/Cards/BlackCard'; const LeftPanelWrapper = styled.div` display: flex; diff --git a/frontend/src/components/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js b/frontend/src/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js similarity index 98% rename from frontend/src/components/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js rename to frontend/src/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js index 60f7f7d3..1d58ba07 100644 --- a/frontend/src/components/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js +++ b/frontend/src/screens/HostBlackCardScreen/HostBlackCardScreen.spec.js @@ -1,10 +1,10 @@ import React from 'react'; import { render, screen, waitFor } from '@testing-library/react'; import renderer from 'react-test-renderer'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import HostBlackCardScreen from './HostBlackCardScreen'; -jest.mock('../../GameSettings/GameSettings', () => () => ( +jest.mock('../../components/GameSettings/GameSettings', () => () => (
)); diff --git a/frontend/src/components/screens/HostBlackCardScreen/__snapshots__/HostBlackCardScreen.spec.js.snap b/frontend/src/screens/HostBlackCardScreen/__snapshots__/HostBlackCardScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/HostBlackCardScreen/__snapshots__/HostBlackCardScreen.spec.js.snap rename to frontend/src/screens/HostBlackCardScreen/__snapshots__/HostBlackCardScreen.spec.js.snap diff --git a/frontend/src/components/screens/HostPregameScreen/HostPregameScreen.js b/frontend/src/screens/HostPregameScreen/HostPregameScreen.js similarity index 90% rename from frontend/src/components/screens/HostPregameScreen/HostPregameScreen.js rename to frontend/src/screens/HostPregameScreen/HostPregameScreen.js index a4651b94..abd0037c 100644 --- a/frontend/src/components/screens/HostPregameScreen/HostPregameScreen.js +++ b/frontend/src/screens/HostPregameScreen/HostPregameScreen.js @@ -1,13 +1,13 @@ import React, { useContext, useEffect } from 'react'; import styled from 'styled-components'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import HostLayout from '../../layouts/HostLayout'; -import PlayerList from '../../PlayerList/PlayerList'; -import GameSettings from '../../GameSettings/GameSettings'; -import PregameSettingsModal from '../../HostSettingsMenu/PregameSettingsModal'; -import JoinCode from '../../JoinCode/JoinCode'; -import Button from '../../Buttons/Button'; -import LoadingIndicator from '../../LoadingIndicator/LoadingIndicator'; +import PlayerList from '../../components/PlayerList/PlayerList'; +import GameSettings from '../../components/GameSettings/GameSettings'; +import PregameSettingsModal from '../../components/HostSettingsMenu/PregameSettingsModal'; +import JoinCode from '../../components/JoinCode/JoinCode'; +import Button from '../../components/Buttons/Button'; +import LoadingIndicator from '../../components/LoadingIndicator/LoadingIndicator'; const LeftPanelWrapper = styled.div` display: flex; diff --git a/frontend/src/components/screens/HostPregameScreen/HostPregameScreen.spec.js b/frontend/src/screens/HostPregameScreen/HostPregameScreen.spec.js similarity index 98% rename from frontend/src/components/screens/HostPregameScreen/HostPregameScreen.spec.js rename to frontend/src/screens/HostPregameScreen/HostPregameScreen.spec.js index 315c13c6..1c993b3e 100644 --- a/frontend/src/components/screens/HostPregameScreen/HostPregameScreen.spec.js +++ b/frontend/src/screens/HostPregameScreen/HostPregameScreen.spec.js @@ -2,10 +2,10 @@ import React from 'react'; import { render, screen, act } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import renderer from 'react-test-renderer'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import HostPregameScreen from './HostPregameScreen'; -jest.mock('../../GameSettings/GameSettings', () => () => ( +jest.mock('../../components/GameSettings/GameSettings', () => () => (
)); diff --git a/frontend/src/components/screens/HostPregameScreen/__snapshots__/HostPregameScreen.spec.js.snap b/frontend/src/screens/HostPregameScreen/__snapshots__/HostPregameScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/HostPregameScreen/__snapshots__/HostPregameScreen.spec.js.snap rename to frontend/src/screens/HostPregameScreen/__snapshots__/HostPregameScreen.spec.js.snap diff --git a/frontend/src/components/screens/HostWinnerScreen/HostWinnerScreen.js b/frontend/src/screens/HostWinnerScreen/HostWinnerScreen.js similarity index 90% rename from frontend/src/components/screens/HostWinnerScreen/HostWinnerScreen.js rename to frontend/src/screens/HostWinnerScreen/HostWinnerScreen.js index 8030b4a9..eae04dc3 100644 --- a/frontend/src/components/screens/HostWinnerScreen/HostWinnerScreen.js +++ b/frontend/src/screens/HostWinnerScreen/HostWinnerScreen.js @@ -1,12 +1,12 @@ import React, { useContext, useEffect } from 'react'; import styled from 'styled-components'; import HostLayout from '../../layouts/HostLayout'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; -import PlayerList from '../../PlayerList/PlayerList'; -import InGameSettingsModal from '../../HostSettingsMenu/InGameSettingsModal.js'; -import JoinCode from '../../JoinCode/JoinCode'; -import BlackCard from '../../Cards/BlackCard'; -import WhiteCard from '../../Cards/WhiteCard'; +import { HostContext } from '../../contexts/HostContext/HostContext'; +import PlayerList from '../../components/PlayerList/PlayerList'; +import InGameSettingsModal from '../../components/HostSettingsMenu/InGameSettingsModal.js'; +import JoinCode from '../../components/JoinCode/JoinCode'; +import BlackCard from '../../components/Cards/BlackCard'; +import WhiteCard from '../../components/Cards/WhiteCard'; const LeftPanelWrapper = styled.div` display: flex; diff --git a/frontend/src/components/screens/HostWinnerScreen/HostWinnerScreen.spec.js b/frontend/src/screens/HostWinnerScreen/HostWinnerScreen.spec.js similarity index 98% rename from frontend/src/components/screens/HostWinnerScreen/HostWinnerScreen.spec.js rename to frontend/src/screens/HostWinnerScreen/HostWinnerScreen.spec.js index 7d6c4806..37859211 100644 --- a/frontend/src/components/screens/HostWinnerScreen/HostWinnerScreen.spec.js +++ b/frontend/src/screens/HostWinnerScreen/HostWinnerScreen.spec.js @@ -1,7 +1,7 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; import renderer from 'react-test-renderer'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import HostWinnerScreen from './HostWinnerScreen'; describe('Host Winner Screen', () => { diff --git a/frontend/src/components/screens/HostWinnerScreen/__snapshots__/HostWinnerScreen.spec.js.snap b/frontend/src/screens/HostWinnerScreen/__snapshots__/HostWinnerScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/HostWinnerScreen/__snapshots__/HostWinnerScreen.spec.js.snap rename to frontend/src/screens/HostWinnerScreen/__snapshots__/HostWinnerScreen.spec.js.snap diff --git a/frontend/src/components/screens/PlayerHandScreen/PlayerHandScreen.js b/frontend/src/screens/PlayerHandScreen/PlayerHandScreen.js similarity index 84% rename from frontend/src/components/screens/PlayerHandScreen/PlayerHandScreen.js rename to frontend/src/screens/PlayerHandScreen/PlayerHandScreen.js index 2ea3b8dd..77ea57c3 100644 --- a/frontend/src/components/screens/PlayerHandScreen/PlayerHandScreen.js +++ b/frontend/src/screens/PlayerHandScreen/PlayerHandScreen.js @@ -1,8 +1,8 @@ import React, { useState, useContext } from 'react'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; -import CardHandLayout from '../../CardHandLayout/CardHandLayout'; -import PlayerHand from '../../PlayerHand/PlayerHand'; +import CardHandLayout from '../../layouts/CardHandLayout/CardHandLayout'; +import PlayerHand from '../../components/PlayerHand/PlayerHand'; export default function PlayerHandScreen() { const { state, dispatch } = useContext(PlayerContext); diff --git a/frontend/src/components/screens/PlayerHandScreen/PlayerHandScreen.spec.js b/frontend/src/screens/PlayerHandScreen/PlayerHandScreen.spec.js similarity index 98% rename from frontend/src/components/screens/PlayerHandScreen/PlayerHandScreen.spec.js rename to frontend/src/screens/PlayerHandScreen/PlayerHandScreen.spec.js index ff712961..2be7abe0 100644 --- a/frontend/src/components/screens/PlayerHandScreen/PlayerHandScreen.spec.js +++ b/frontend/src/screens/PlayerHandScreen/PlayerHandScreen.spec.js @@ -3,7 +3,7 @@ import { render, screen, act } from '@testing-library/react'; import renderer from 'react-test-renderer'; import userEvent from '@testing-library/user-event'; import PlayerHandScreen from './PlayerHandScreen'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; describe('PlayerHandScreen', () => { describe('render', () => { diff --git a/frontend/src/components/screens/PlayerHandScreen/__snapshots__/PlayerHandScreen.spec.js.snap b/frontend/src/screens/PlayerHandScreen/__snapshots__/PlayerHandScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/PlayerHandScreen/__snapshots__/PlayerHandScreen.spec.js.snap rename to frontend/src/screens/PlayerHandScreen/__snapshots__/PlayerHandScreen.spec.js.snap diff --git a/frontend/src/components/screens/PlayerJoinScreen/PlayerJoinScreen.js b/frontend/src/screens/PlayerJoinScreen/PlayerJoinScreen.js similarity index 97% rename from frontend/src/components/screens/PlayerJoinScreen/PlayerJoinScreen.js rename to frontend/src/screens/PlayerJoinScreen/PlayerJoinScreen.js index 8230ac14..b6264ff6 100644 --- a/frontend/src/components/screens/PlayerJoinScreen/PlayerJoinScreen.js +++ b/frontend/src/screens/PlayerJoinScreen/PlayerJoinScreen.js @@ -1,9 +1,9 @@ import React, { useContext, useState } from 'react'; import styled from 'styled-components'; -import Button from '../../Buttons/Button'; -import Header from '../../Header/Header'; -import Footer from '../../Footer/Footer'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import Button from '../../components/Buttons/Button'; +import Header from '../../components/Header/Header'; +import Footer from '../../components/Footer/Footer'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; const propTypes = {}; diff --git a/frontend/src/components/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js b/frontend/src/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js similarity index 98% rename from frontend/src/components/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js rename to frontend/src/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js index 4d18682e..9953d4f8 100644 --- a/frontend/src/components/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js +++ b/frontend/src/screens/PlayerJoinScreen/PlayerJoinScreen.spec.js @@ -6,7 +6,7 @@ import PlayerJoinScreen from './PlayerJoinScreen'; import { PlayerContext, PlayerProvider, -} from '../../../contexts/PlayerContext/PlayerContext'; +} from '../../contexts/PlayerContext/PlayerContext'; describe('PlayerJoin', () => { describe('render', () => { diff --git a/frontend/src/components/screens/PlayerJoinScreen/__snapshots__/PlayerJoinScreen.spec.js.snap b/frontend/src/screens/PlayerJoinScreen/__snapshots__/PlayerJoinScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/PlayerJoinScreen/__snapshots__/PlayerJoinScreen.spec.js.snap rename to frontend/src/screens/PlayerJoinScreen/__snapshots__/PlayerJoinScreen.spec.js.snap diff --git a/frontend/src/components/screens/PlayerMessageScreen/PlayerMessageScreen.js b/frontend/src/screens/PlayerMessageScreen/PlayerMessageScreen.js similarity index 88% rename from frontend/src/components/screens/PlayerMessageScreen/PlayerMessageScreen.js rename to frontend/src/screens/PlayerMessageScreen/PlayerMessageScreen.js index 14e80e32..8ca0f8f6 100644 --- a/frontend/src/components/screens/PlayerMessageScreen/PlayerMessageScreen.js +++ b/frontend/src/screens/PlayerMessageScreen/PlayerMessageScreen.js @@ -1,10 +1,10 @@ import React, { useContext } from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; -import cardTrioDiagonal from '../../../assets/card-trio-diagonal.svg'; -import blackCardDiagonal from '../../../assets/black-card-diagonal.svg'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; -import LoadingIndicator from '../../LoadingIndicator/LoadingIndicator'; +import cardTrioDiagonal from '../../assets/card-trio-diagonal.svg'; +import blackCardDiagonal from '../../assets/black-card-diagonal.svg'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; +import LoadingIndicator from '../../components/LoadingIndicator/LoadingIndicator'; const propTypes = { bigText: PropTypes.string.isRequired, diff --git a/frontend/src/components/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js b/frontend/src/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js similarity index 97% rename from frontend/src/components/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js rename to frontend/src/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js index 8eccd629..e8248ee1 100644 --- a/frontend/src/components/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js +++ b/frontend/src/screens/PlayerMessageScreen/PlayerMessageScreen.spec.js @@ -1,7 +1,7 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; import PlayerMessageScreen from './PlayerMessageScreen'; -import { PlayerContext } from '../../../contexts/PlayerContext/PlayerContext'; +import { PlayerContext } from '../../contexts/PlayerContext/PlayerContext'; describe('Player message screen', () => { describe('Rendering', () => { diff --git a/frontend/src/components/screens/WelcomeScreen/WelcomeScreen.js b/frontend/src/screens/WelcomeScreen/WelcomeScreen.js similarity index 97% rename from frontend/src/components/screens/WelcomeScreen/WelcomeScreen.js rename to frontend/src/screens/WelcomeScreen/WelcomeScreen.js index 1b5c62a0..63e2a399 100644 --- a/frontend/src/components/screens/WelcomeScreen/WelcomeScreen.js +++ b/frontend/src/screens/WelcomeScreen/WelcomeScreen.js @@ -2,9 +2,9 @@ import React from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; -import Header from '../../Header/Header'; -import Button from '../../Buttons/Button'; -import Footer from '../../Footer/Footer'; +import Header from '../../components/Header/Header'; +import Button from '../../components/Buttons/Button'; +import Footer from '../../components/Footer/Footer'; const propTypes = { handleJoinClick: PropTypes.func.isRequired, diff --git a/frontend/src/components/screens/WelcomeScreen/WelcomeScreen.spec.js b/frontend/src/screens/WelcomeScreen/WelcomeScreen.spec.js similarity index 100% rename from frontend/src/components/screens/WelcomeScreen/WelcomeScreen.spec.js rename to frontend/src/screens/WelcomeScreen/WelcomeScreen.spec.js diff --git a/frontend/src/components/screens/WelcomeScreen/__snapshots__/WelcomeScreen.spec.js.snap b/frontend/src/screens/WelcomeScreen/__snapshots__/WelcomeScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/WelcomeScreen/__snapshots__/WelcomeScreen.spec.js.snap rename to frontend/src/screens/WelcomeScreen/__snapshots__/WelcomeScreen.spec.js.snap diff --git a/frontend/src/components/screens/WinnerSelectScreen/WinnerSelectScreen.js b/frontend/src/screens/WinnerSelectScreen/WinnerSelectScreen.js similarity index 87% rename from frontend/src/components/screens/WinnerSelectScreen/WinnerSelectScreen.js rename to frontend/src/screens/WinnerSelectScreen/WinnerSelectScreen.js index 0fc39e87..b154005e 100644 --- a/frontend/src/components/screens/WinnerSelectScreen/WinnerSelectScreen.js +++ b/frontend/src/screens/WinnerSelectScreen/WinnerSelectScreen.js @@ -2,12 +2,12 @@ import React, { useContext } from 'react'; import styled from 'styled-components'; import HostLayout from '../../layouts/HostLayout'; -import InGameSettingsModal from '../../HostSettingsMenu/InGameSettingsModal'; -import PlayerList from '../../PlayerList/PlayerList'; -import JoinCode from '../../JoinCode/JoinCode'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; -import BlackCard from '../../Cards/BlackCard'; -import WhiteCard from '../../Cards/WhiteCard'; +import InGameSettingsModal from '../../components/HostSettingsMenu/InGameSettingsModal'; +import PlayerList from '../../components/PlayerList/PlayerList'; +import JoinCode from '../../components/JoinCode/JoinCode'; +import { HostContext } from '../../contexts/HostContext/HostContext'; +import BlackCard from '../../components/Cards/BlackCard'; +import WhiteCard from '../../components/Cards/WhiteCard'; const LeftPanelWrapper = styled.div` display: flex; diff --git a/frontend/src/components/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js b/frontend/src/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js similarity index 98% rename from frontend/src/components/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js rename to frontend/src/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js index d4f35877..f0e94fa9 100644 --- a/frontend/src/components/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js +++ b/frontend/src/screens/WinnerSelectScreen/WinnerSelectScreen.spec.js @@ -1,7 +1,7 @@ import React from 'react'; import renderer from 'react-test-renderer'; import { render, screen } from '@testing-library/react'; -import { HostContext } from '../../../contexts/HostContext/HostContext'; +import { HostContext } from '../../contexts/HostContext/HostContext'; import WinnerSelectScreen from './WinnerSelectScreen'; describe('WinnerSelectScreen', () => { diff --git a/frontend/src/components/screens/WinnerSelectScreen/__snapshots__/WinnerSelectScreen.spec.js.snap b/frontend/src/screens/WinnerSelectScreen/__snapshots__/WinnerSelectScreen.spec.js.snap similarity index 100% rename from frontend/src/components/screens/WinnerSelectScreen/__snapshots__/WinnerSelectScreen.spec.js.snap rename to frontend/src/screens/WinnerSelectScreen/__snapshots__/WinnerSelectScreen.spec.js.snap From ee8389b5a1a2aa2ebb6cc08d22638cdbf3734159 Mon Sep 17 00:00:00 2001 From: Tatiana Date: Sat, 24 Apr 2021 09:19:36 -0700 Subject: [PATCH 3/3] remove SocketTest file --- frontend/src/components/SocketTest.js | 88 --------------------------- 1 file changed, 88 deletions(-) delete mode 100644 frontend/src/components/SocketTest.js diff --git a/frontend/src/components/SocketTest.js b/frontend/src/components/SocketTest.js deleted file mode 100644 index 28dd4762..00000000 --- a/frontend/src/components/SocketTest.js +++ /dev/null @@ -1,88 +0,0 @@ -import React, { useState, useContext } from 'react'; -import socketInstance from '../socket/socket'; -import { StoreContext } from '../contexts/myContext/context'; - -function SocketTest() { - const { state } = useContext(StoreContext); - const { socketIsActive, lobbyId } = state; - const [lobbyInput, setLobbyInput] = useState(''); - const [socketMessageInput, setSocketMessageInput] = useState(''); - const [isHosting, setIsHosting] = useState(false); - - const handleCreateLobby = () => { - socketInstance.createLobby(); - setIsHosting(true); - }; - - const handleJoinLobby = (e) => { - e.preventDefault(); - socketInstance.joinLobby(lobbyInput); - setLobbyInput(''); - }; - - const handleLobbyInputChange = (e) => { - setLobbyInput(e.target.value.toUpperCase()); - }; - - const handleSocketMessageChange = (e) => { - setSocketMessageInput(e.target.value); - }; - - const handleSendMessage = (e) => { - e.preventDefault(); - socketInstance.sendMessage({ - event: 'message', - payload: socketMessageInput, - }); - setSocketMessageInput(''); - }; - - return ( -
- {!socketIsActive && ( -
- -
- - -
-
- )} -

- Socket status: - {socketIsActive ? ' Active' : ' Inactive'} -

- {socketIsActive && ( - <> -

- Client type: - {isHosting ? ' HOST' : ' PLAYER'} -

- {isHosting && ( -

- {/* eslint-disable-next-line react/jsx-one-expression-per-line */} - Lobby: {lobbyId} -

- )} -
- - -
- - )} -
- ); -} - -export default SocketTest;