Add previous work

packages/wonders-client/package.json

@@ -10,9 +10,11 @@
     "@types/node": "^12.0.0",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
+    "bootstrap": "^5.0.1",
     "formik": "^2.2.6",
     "ketchup-react": "^0.1.0",
     "react": "^17.0.2",
+    "react-bootstrap": "^1.6.0",
     "react-dom": "^17.0.2",
     "react-scripts": "4.0.3",
     "typescript": "^4.1.2",

packages/wonders-client/src/components/App/App.test.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { render, screen } from '@testing-library/react';
 import App from './App';
 

packages/wonders-client/src/components/App/App.tsx

@@ -1,9 +1,12 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import useKetchup from 'ketchup-react'
 import { addPlayerAction, reducer, removePlayerAction, resetAction } from 'wonders-common'
 import './App.css';
 import Game from '../Game/Game';
 import UserSelector from '../UserSelector/UserSelector';
+import 'bootstrap/dist/css/bootstrap.min.css';
+import Container from 'react-bootstrap/Container';
+import Row from 'react-bootstrap/Row'
 
 export default function App() {
   const [state, dispatch] = useKetchup('ws://localhost:4000', reducer)
@@ -25,14 +28,14 @@ export default function App() {
     }
   }
 
-  return <>
+  return <Container fluid>
     <UserSelector user={user} selectUser={selectUser} removeUser={removeUser} users={state?.players.map(p => p.name) ?? []} locked={state !== undefined && state.stage !== 'starting'}/>
     {state
       ? <>
         <Game state={state} dispatch={dispatch} playerName={user}/>
         <button onClick={() => window.confirm('Reset game?') && dispatch(resetAction())}> Reset</button>
       </>
-      : <p>Loading...</p>
+      : <Row>Loading...</Row>
     }
-  </>
+  </Container>
 }

packages/wonders-client/src/components/Card/Card.tsx

@@ -0,0 +1,6 @@
+import { Structure } from "wonders-common";
+
+export default function Card({ structure }: { structure: Structure }) {
+  return <>
+  </>
+}

packages/wonders-client/src/components/Civ/Civ.css

@@ -0,0 +1,15 @@
+.wonder-civ-outer {
+  background-position: center;
+  background-size: cover;
+}
+
+.wonder-civ-struct {
+  font-weight: bold;
+}
+.wonder-civ-struct-type-commerce { background-color: yellow; color: black; }
+.wonder-civ-struct-type-culture { background-color: blue; color: white; }
+.wonder-civ-struct-type-science { background-color: green; color: white; }
+.wonder-civ-struct-type-basic-industry { background-color: brown; color: white; }
+.wonder-civ-struct-type-advanced-industry { background-color: gray; color: black; }
+.wonder-civ-struct-type-guild { background-color: purple; color: white; }
+.wonder-civ-struct-type-military { background-color: red; color: white; }

packages/wonders-client/src/components/Civ/Civ.tsx

@@ -1,7 +1,40 @@
-import React from 'react'
+import { useMemo } from 'react';
-import { Player } from 'wonders-common';
+import { Player, playerStats, Resource, Science, sumMaps } from 'wonders-common';
+import fill from 'lodash/fill'
+
+const resEmojis = new Map<Resource, string>([
+  ['brick', '🧱'],
+  ['cloth', '👖'],
+  ['glass', '⚗️'],
+  ['ore', '⛏️'],
+  ['paper', '🧻'],
+  ['stone', '🗿'],
+  ['wood', '🌲'],
+])
+const sciEmojis = new Map<Science, string>([
+  ['education', '🎓'],
+  ['engineering', '⚙️'],
+  ['research', '📚'],
+])
+const wonderBgExts = ['jpg', 'webp']
 
 export default function Civ({ player, style }: { player: Player, style: 'player' | 'neighbor' | 'compact' }) {
+  const pStats = useMemo(() => playerStats(player), [player])
 
-  return <>{player.name}</>
+  const outerStyle = {
+    backgroundImage: player.wonder && wonderBgExts.map(ext => `url(/assets/wonders/${player.wonder}.${ext})`).join(', '),
+  }
+
+  return <div className='wonder-civ-outer' style={outerStyle}>
+    <div>{[...pStats.resources].flatMap(([res, n]) => fill(Array(n), resEmojis.get(res)!)).join('')}</div>
+    <div>{pStats.shields}🛡️</div>
+    <div>${player.gold}</div>
+    <div>{player.name}</div>
+    <div>{pStats.sciences.map(s => [...s].map(sci => sciEmojis.get(sci)!)).map(s =>
+      s.length === 1 ? s[0] : `(${s.join('/')})`
+    )}</div>
+    <div>{[...sumMaps(pStats.structObjs.map(s => new Map([[s.type, 1]])))].map(([type, n]) =>
+      <span className={`wonder-civ-struct wonder-civ-struct-type-${type.replaceAll(' ', '-')}`}>n</span>
+    )}</div>
+  </div>
 }

packages/wonders-client/src/components/Game/Game.tsx

@@ -1,9 +1,10 @@
 /* eslint-disable react/style-prop-object */
 import { Dispatch } from 'ketchup-react'
-import React from 'react'
+import { Action, Player, State, structures } from 'wonders-common'
-import { Action, Player, State } from 'wonders-common'
 import Civ from '../Civ/Civ'
-import without from 'lodash/without'
+import Card from '../Card/Card'
+import Row from 'react-bootstrap/Row'
+import Col from 'react-bootstrap/Col'
 
 function getDistant<T>(arr: T[], idx: number) {
     switch (idx) {
@@ -13,24 +14,45 @@ function getDistant<T>(arr: T[], idx: number) {
     }
 }
 
+function DistantCivs({ players }: { players: Player[] }) {
+  return <Row>{players.map(p =>
+    <Col key={p.name}>
+      <Civ player={p} style='compact'/>
+    </Col>
+  )}</Row>
+}
+
 export default function Game({ state, playerName }: { state: State, playerName?: string, dispatch: Dispatch<Action> }) {
-  const started = state.stage === 'play'
   const playerIdx: number | undefined = state.players.findIndex(p => p.name === playerName)
   const player: Player | undefined = state.players[playerIdx]
-  const left = started ? state.players[(playerIdx + 1) % state.players.length] : undefined
+  const started = state.stage !== 'play' ? undefined : {
-  const right = started ? state.players[(playerIdx - 1 + state.players.length) % state.players.length] : undefined
+    left: state.players[(playerIdx + 1) % state.players.length],
-  const distant = started ? getDistant(state.players, playerIdx) : undefined
+    right: state.players[(playerIdx - 1 + state.players.length) % state.players.length],
+    distant: getDistant(state.players, playerIdx),
+  }
 
+  if (started && player) {
     return <>
-    <div><ul>{(distant ?? without(state.players, player)).map(p =>
+      <DistantCivs players={started.distant}/>
-      <li key={p.name}>
+      <Row>
-        <Civ player={p} style="compact"/>
+        <Col><Civ player={started.left} style='neighbor'/></Col>
-      </li>
+        <Col>
-    )}</ul></div>
+          <div>{state?.age === undefined ? '' : `Age ${state.age + 1} ${state.age % 2 === 0 ? '🔃' : '🔄'}`}</div>
-    <p>
+          <div><button>Discards</button></div>
-      {left && <Civ player={left} style="neighbor"/>}
+        </Col>
-      {player && <Civ player={player} style="player"/>}
+        <Col><Civ player={started.right} style='neighbor'/></Col>
-      {right && <Civ player={right} style="neighbor"/>}
+      </Row>
-    </p>
+      <Row>
+        <Civ player={player} style='player'/>
+      </Row>
+      <Row>{player.hand.map(s => structures.get(s)!).map(s =>
+        <Col>
+          <Card structure={s}/>
+        </Col>
+      )}</Row>
     </>
+  } else {
+    return <DistantCivs players={state.players}/>
+    // TODO Pick wonder
+  }
 }

packages/wonders-client/src/components/UserSelector/UserSelector.tsx

@@ -1,6 +1,7 @@
 import { ErrorMessage, Field, Form, Formik } from 'formik';
-import React, { Dispatch, useState } from 'react';
+import { Dispatch, useState } from 'react';
 import sample from 'lodash/sample'
+import Row from 'react-bootstrap/Row';
 
 const namePlaceholders = [
   'Alexander the Great',
@@ -18,7 +19,7 @@ export default function UserSelector({ users, user, selectUser, removeUser, lock
   users: string[], user?: string, selectUser: Dispatch<string | undefined>, removeUser: () => void, locked: boolean
 }) {
   const [namePlaceholder] = useState(() => sample(namePlaceholders))
-  return <div>
+  return <Row>
     {user
       ? <>Playing as {user} <button onClick={() => selectUser(undefined)}>Change</button> <button onClick={removeUser} disabled={locked}>Remove</button></>
       : <Formik
@@ -39,5 +40,5 @@ export default function UserSelector({ users, user, selectUser, removeUser, lock
         </Form>}
       </Formik>
     }
-  </div>
+  </Row>
 }

packages/wonders-client/yarn.lock

@@ -2073,16 +2073,6 @@ acorn-walk@^7.1.1:
   resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc"
   integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==
 
-acorn@^6.4.1:
-  version "6.4.2"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.4.2.tgz#35866fd710528e92de10cf06016498e47e39e1e6"
-  integrity sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==
-
-acorn@^7.1.0, acorn@^7.1.1, acorn@^7.4.0:
-  version "7.4.1"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
-  integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
-
 address@1.1.2, address@^1.0.1:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/address/-/address-1.1.2.tgz#bf1116c9c758c51b7a933d296b72c221ed9428b6"

packages/wonders-common/index.ts

@@ -7,9 +7,9 @@ import sum from 'lodash/sum'
 import max from 'lodash/max'
 import head from 'lodash/head'
 import tail from 'lodash/tail'
+import compact from 'lodash/compact'
 
-export const minAge = 1
+export const numAges = 3
-export const maxAge = 3
 export const minPlayers = 3
 export const maxPlayers = 7
 export const startingGold = 3
@@ -19,10 +19,16 @@ export const defeatPoints = -1
 export const goldPerPoint = 3
 export const scienceSetPoints = 7
 
-type Resource = 'wood' | 'stone' | 'ore' | 'brick' | 'paper' | 'cloth' | 'glass'
+export type Resource = 'wood' | 'stone' | 'ore' | 'brick' | 'paper' | 'cloth' | 'glass'
-type Science = 'engineering' | 'research' | 'education'
+export const resources: Resource[] = ['wood', 'stone', 'ore', 'brick', 'paper', 'cloth', 'glass']
-type StructureType = 'commerce' | 'culture' | 'science' | 'basic industry' | 'advanced industry' | 'guild' | 'military'
+
-type Countable = StructureType | 'wonder stage' | 'defeat'
+export type Science = 'engineering' | 'research' | 'education'
+export const sciences: Science[] = ['engineering', 'research', 'education']
+
+export type StructureType = 'commerce' | 'culture' | 'science' | 'basic industry' | 'advanced industry' | 'guild' | 'military'
+export const structureTypes: StructureType[] = ['commerce', 'culture', 'science', 'basic industry', 'advanced industry', 'guild', 'military']
+
+export type Countable = StructureType | 'wonder stage' | 'defeat'
 
 export interface Structure {
   type: StructureType
@@ -130,7 +136,7 @@ const structuresGuilds: Structure[] = [
   { type: 'guild', name: 'Spies Guild', cost: new Map([['brick', 3], ['glass', 1]]), pointsPerNeighbor: new Map([['military', 1]]) },
   { type: 'guild', name: 'Strategists Guild', cost: new Map([['ore', 2], ['stone', 1], ['cloth', 1]]), pointsPerNeighbor: new Map([['defeat', 1]]) },
   { type: 'guild', name: 'Traders Guild', cost: new Map([['glass', 1], ['paper', 1], ['cloth', 1]]), pointsPerNeighbor: new Map([['commerce', 1]]) },
-  { type: 'guild', name: 'Workers Guild', cost: new Map([['ore', 2], ['brick', 1], ['stone', 1], ['wood', 1]]), pointsPerNeighbor: new Map([['basic industry', 2]]) },
+  { type: 'guild', name: 'Workers Guild', cost: new Map([['ore', 2], ['brick', 1], ['stone', 1], ['wood', 1]]), pointsPerNeighbor: new Map([['basic industry', 1]]) },
 ]
 export const structures = new Map<string, Structure>([structuresAge1, structuresAge2, structuresAge3, structuresGuilds].flat().map(c => ([c.name, c])))
 // Initialize 'freeWith' properties
@@ -146,7 +152,7 @@ for (const structure of structures.values()) {
 }
 
 export function buildDeck(age: number, numPlayers: number) {
-  if (age < minAge || age > maxAge || !isInteger(age)) {
+  if (age < 0 || age >= numAges || !isInteger(age)) {
     throw new Error(`Unsupported age ${age}`)
   }
   if (numPlayers < minPlayers || numPlayers > maxPlayers || !isInteger(numPlayers)) {
@@ -158,7 +164,7 @@ export function buildDeck(age: number, numPlayers: number) {
       ?.map(() => structure)
       ?? []
   )
-  if (age === maxAge) {
+  if (age === numAges - 1) {
     cards.push(...sampleSize(structuresGuilds, numPlayers + 2))
   }
   return cards
@@ -176,8 +182,8 @@ const wonderList: Wonder[] = [
   { name: 'Hanging Gardens of Babylon B', innateResource: 'brick' },
   { name: 'Temple of Artemis at Ephesus A', innateResource: 'paper' },
   { name: 'Temple of Artemis at Ephesus B', innateResource: 'paper' },
-  { name: 'State of Zeus at Olympia A', innateResource: 'wood' },
+  { name: 'Statue of Zeus at Olympia A', innateResource: 'wood' },
-  { name: 'State of Zeus at Olympia B', innateResource: 'wood' },
+  { name: 'Statue of Zeus at Olympia B', innateResource: 'wood' },
   { name: 'Mausoleum at Halicarnassus A', innateResource: 'cloth' },
   { name: 'Mausoleum at Halicarnassus B', innateResource: 'cloth' },
   { name: 'Colossus of Rhodes A', innateResource: 'ore' },
@@ -210,6 +216,26 @@ export interface Player {
   rightBattles: number[]
 }
 
+export function sumMaps<V>(ms?: (Map<V, number> | undefined)[]) {
+  const sum = new Map<V, number>()
+  for (const m of ms ?? []) {
+    for (const [k, v] of m ?? []) {
+      sum.set(k, (sum.get(k) ?? 0) + v)
+    }
+  }
+  return sum
+}
+
+export function playerStats(p: Player) {
+  const structObjs = compact(p.structures.map(({ structure }) => structures.get(structure)))
+  return {
+    structObjs,
+    resources: sumMaps(structObjs.map(s => s.resources)),
+    shields: sum(structObjs.map(s => s.shields)),
+    sciences: compact(structObjs.map(s => s.sciences)),
+  }
+}
+
 export interface State {
   stage: 'starting' | 'play' | 'finished'
   players: Player[]
@@ -295,9 +321,16 @@ export function resetAction(): ResetAction {
   return { type: 'reset' }
 }
 
+export interface LoadSampleAction extends BaseAction {
+  type: 'load sample'
+}
+export function loadSampleAction(): LoadSampleAction {
+  return { type: 'load sample' }
+}
+
 export type Action = AddPlayerAction | RemovePlayerAction | ChooseWonderAction | StartGameAction
   | PlanTurnAction
-  | ResetAction
+  | ResetAction | LoadSampleAction
 
 function sumCountable(player: Player, countable: Countable): number {
   switch (countable) {
@@ -496,6 +529,9 @@ const reducers: { [type: string]: (state: State, action: any) => State } = {
     return newState.players.every(p => p.turnPlan !== undefined) ? doTurn(newState) : newState
   },
   reset: () => initial,
+  'load sample': () => ({
+    ...initial, // TODO
+  }),
 }
 export function reducer(state: State, action: Action): State {
   return reducers[action.type](state, action)

yarn.lock

@@ -1157,7 +1157,7 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
+"@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.8", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.3", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
   version "7.14.0"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.0.tgz#46794bc20b612c5f75e62dd071e24dfd95f1cbe6"
   integrity sha512-JELkvo/DlpNdJ7dlyw/eY7E0suy5i5GQH+Vlxaq1nsNJ+H7f4Vtv3jMeCEgRhZZQFXTjldYfQgv2qmM6M1v5wA==
@@ -2320,6 +2320,24 @@
     schema-utils "^2.6.5"
     source-map "^0.7.3"
 
+"@popperjs/core@^2.8.6":
+  version "2.9.2"
+  resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.9.2.tgz#adea7b6953cbb34651766b0548468e743c6a2353"
+  integrity sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q==
+
+"@restart/context@^2.1.4":
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/@restart/context/-/context-2.1.4.tgz#a99d87c299a34c28bd85bb489cb07bfd23149c02"
+  integrity sha512-INJYZQJP7g+IoDUh/475NlGiTeMfwTXUEr3tmRneckHIxNolGOW9CTq83S8cxq0CgJwwcMzMJFchxvlwe7Rk8Q==
+
+"@restart/hooks@^0.3.26":
+  version "0.3.26"
+  resolved "https://registry.yarnpkg.com/@restart/hooks/-/hooks-0.3.26.tgz#ade155a7b0b014ef1073391dda46972c3a14a129"
+  integrity sha512-7Hwk2ZMYm+JLWcb7R9qIXk1OoUg1Z+saKWqZXlrvFwT3w6UArVNWgxYOzf+PJoK9zZejp8okPAKTctthhXLt5g==
+  dependencies:
+    lodash "^4.17.20"
+    lodash-es "^4.17.20"
+
 "@rollup/plugin-node-resolve@^7.1.1":
   version "7.1.3"
   resolved "https://registry.yarnpkg.com/@rollup/plugin-node-resolve/-/plugin-node-resolve-7.1.3.tgz#80de384edfbd7bfc9101164910f86078151a3eca"
@@ -2576,6 +2594,13 @@
   dependencies:
     "@babel/types" "^7.3.0"
 
+"@types/classnames@^2.2.10":
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.3.1.tgz#3c2467aa0f1a93f1f021e3b9bcf938bd5dfdc0dd"
+  integrity sha512-zeOWb0JGBoVmlQoznvqXbE0tEC/HONsnoUNH19Hc96NFsTAwTXbTqb8FMYkru1F/iqp7a18Ws3nWJvtA1sHD1A==
+  dependencies:
+    classnames "*"
+
 "@types/eslint@^7.2.6":
   version "7.2.10"
   resolved "https://registry.yarnpkg.com/@types/eslint/-/eslint-7.2.10.tgz#4b7a9368d46c0f8cd5408c23288a59aa2394d917"
@@ -2614,6 +2639,11 @@
   resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-5.1.1.tgz#3c9ee980f1a10d6021ae6632ca3e79ca2ec4fb50"
   integrity sha512-giAlZwstKbmvMk1OO7WXSj4OZ0keXAcl2TQq4LWHiiPH2ByaH7WeUzng+Qej8UPxxv+8lRTuouo0iaNDBuzIBA==
 
+"@types/invariant@^2.2.33":
+  version "2.2.34"
+  resolved "https://registry.yarnpkg.com/@types/invariant/-/invariant-2.2.34.tgz#05e4f79f465c2007884374d4795452f995720bbe"
+  integrity sha512-lYUtmJ9BqUN688fGY1U1HZoWT1/Jrmgigx2loq4ZcJpICECm/Om3V314BxdzypO0u5PORKGMM6x0OXaljV1YFg==
+
 "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0", "@types/istanbul-lib-coverage@^2.0.1":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz#4ba8ddb720221f432e443bd5f9117fd22cfd4762"
@@ -2696,7 +2726,7 @@
   resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.2.3.tgz#ef65165aea2924c9359205bf748865b8881753c0"
   integrity sha512-PijRCG/K3s3w1We6ynUKdxEc5AcuuH3NBmMDP8uvKVp6X43UY7NQlTzczakXP3DJR0F4dfNQIGjU2cUeRYs2AA==
 
-"@types/prop-types@*":
+"@types/prop-types@*", "@types/prop-types@^15.7.3":
   version "15.7.3"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
   integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
@@ -2713,6 +2743,13 @@
   dependencies:
     "@types/react" "*"
 
+"@types/react-transition-group@^4.4.1":
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.1.tgz#e1a3cb278df7f47f17b5082b1b3da17170bd44b1"
+  integrity sha512-vIo69qKKcYoJ8wKCJjwSgCTM+z3chw3g18dkrDfVX665tMH7tmbDxEAnPdey4gTlwZz5QuHGzd+hul0OVZDqqQ==
+  dependencies:
+    "@types/react" "*"
+
 "@types/react@*", "@types/react@^17.0.0", "@types/react@^17.0.5":
   version "17.0.5"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.5.tgz#3d887570c4489011f75a3fc8f965bf87d09a1bea"
@@ -2722,6 +2759,15 @@
     "@types/scheduler" "*"
     csstype "^3.0.2"
 
+"@types/react@>=16.9.11", "@types/react@>=16.9.35":
+  version "17.0.6"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.6.tgz#0ec564566302c562bf497d73219797a5e0297013"
+  integrity sha512-u/TtPoF/hrvb63LdukET6ncaplYsvCvmkceasx8oG84/ZCsoLxz9Z/raPBP4lTAiWW1Jb889Y9svHmv8R26dWw==
+  dependencies:
+    "@types/prop-types" "*"
+    "@types/scheduler" "*"
+    csstype "^3.0.2"
+
 "@types/resolve@0.0.8":
   version "0.0.8"
   resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-0.0.8.tgz#f26074d238e02659e323ce1a13d041eee280e194"
@@ -2763,6 +2809,11 @@
   dependencies:
     source-map "^0.6.1"
 
+"@types/warning@^3.0.0":
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@types/warning/-/warning-3.0.0.tgz#0d2501268ad8f9962b740d387c4654f5f8e23e52"
+  integrity sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI=
+
 "@types/webpack-sources@*":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-2.1.0.tgz#8882b0bd62d1e0ce62f183d0d01b72e6e82e8c10"
@@ -3831,6 +3882,11 @@ boolbase@^1.0.0, boolbase@~1.0.0:
   resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
   integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24=
 
+bootstrap@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-5.0.1.tgz#e7939d599119dc818a90478a2a299bdaff037e09"
+  integrity sha512-Fl79+wsLOZKoiU345KeEaWD0ik8WKRI5zm0YSPj2oF1Qr+BO7z0fco6GbUtqjoG1h4VI89PeKJnMsMMVQdKKTw==
+
 brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
@@ -4314,6 +4370,11 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
+classnames@*, classnames@^2.2.6:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
+  integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
+
 clean-css@^4.2.3:
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78"
@@ -5433,6 +5494,14 @@ dom-converter@^0.2:
   dependencies:
     utila "~0.4"
 
+dom-helpers@^5.0.1, dom-helpers@^5.1.2, dom-helpers@^5.2.0:
+  version "5.2.1"
+  resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902"
+  integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==
+  dependencies:
+    "@babel/runtime" "^7.8.7"
+    csstype "^3.0.2"
+
 dom-serializer@0:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51"
@@ -7391,6 +7460,13 @@ interpret@^1.0.0:
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e"
   integrity sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==
 
+invariant@^2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
+  integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
+  dependencies:
+    loose-envify "^1.0.0"
+
 ip-regex@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/ip-regex/-/ip-regex-2.1.0.tgz#fa78bf5d2e6913c911ce9f819ee5146bb6d844e9"
@@ -8669,7 +8745,7 @@ locate-path@^5.0.0:
   dependencies:
     p-locate "^4.1.0"
 
-lodash-es@^4.17.14:
+lodash-es@^4.17.14, lodash-es@^4.17.20:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee"
   integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==
@@ -8734,7 +8810,7 @@ loglevel@^1.6.8:
   resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.7.1.tgz#005fde2f5e6e47068f935ff28573e125ef72f197"
   integrity sha512-Hesni4s5UkWkwCGJMQGAh71PaLUmKFM60dHvq0zi/vDhhrzuk+4GgNbTXJ12YYQJn6ZKBDNIjYcuQGKudvqrIw==
 
-loose-envify@^1.1.0, loose-envify@^1.4.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -11047,7 +11123,15 @@ promzard@^0.3.0:
   dependencies:
     read "1"
 
-prop-types@^15.7.2:
+prop-types-extra@^1.1.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/prop-types-extra/-/prop-types-extra-1.1.1.tgz#58c3b74cbfbb95d304625975aa2f0848329a010b"
+  integrity sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==
+  dependencies:
+    react-is "^16.3.2"
+    warning "^4.0.0"
+
+prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -11255,6 +11339,30 @@ react-app-polyfill@^2.0.0:
     regenerator-runtime "^0.13.7"
     whatwg-fetch "^3.4.1"
 
+react-bootstrap@^1.6.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/react-bootstrap/-/react-bootstrap-1.6.0.tgz#5b4f160ce0cd22784cf4271ca90550b4891fdd42"
+  integrity sha512-PaeOGeRC2+JH9Uf1PukJgXcIpfGlrKKHEBZIArymjenYzSJ/RhO2UdNX+e7nalsCFFZLRRgQ0/FKkscW2LmmRg==
+  dependencies:
+    "@babel/runtime" "^7.13.8"
+    "@restart/context" "^2.1.4"
+    "@restart/hooks" "^0.3.26"
+    "@types/classnames" "^2.2.10"
+    "@types/invariant" "^2.2.33"
+    "@types/prop-types" "^15.7.3"
+    "@types/react" ">=16.9.35"
+    "@types/react-transition-group" "^4.4.1"
+    "@types/warning" "^3.0.0"
+    classnames "^2.2.6"
+    dom-helpers "^5.1.2"
+    invariant "^2.2.4"
+    prop-types "^15.7.2"
+    prop-types-extra "^1.1.0"
+    react-overlays "^5.0.0"
+    react-transition-group "^4.4.1"
+    uncontrollable "^7.2.1"
+    warning "^4.0.3"
+
 react-dev-utils@^11.0.3:
   version "11.0.4"
   resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-11.0.4.tgz#a7ccb60257a1ca2e0efe7a83e38e6700d17aa37a"
@@ -11304,7 +11412,7 @@ react-fast-compare@^2.0.1:
   resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
   integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
 
-react-is@^16.7.0, react-is@^16.8.1:
+react-is@^16.3.2, react-is@^16.7.0, react-is@^16.8.1:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
@@ -11314,6 +11422,25 @@ react-is@^17.0.1:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
   integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
 
+react-lifecycles-compat@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
+  integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
+
+react-overlays@^5.0.0:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/react-overlays/-/react-overlays-5.0.1.tgz#7e2c3cd3c0538048b0b7451d203b1289c561b7f2"
+  integrity sha512-plwUJieTBbLSrgvQ4OkkbTD/deXgxiJdNuKzo6n1RWE3OVnQIU5hffCGS/nvIuu6LpXFs2majbzaXY8rcUVdWA==
+  dependencies:
+    "@babel/runtime" "^7.13.8"
+    "@popperjs/core" "^2.8.6"
+    "@restart/hooks" "^0.3.26"
+    "@types/warning" "^3.0.0"
+    dom-helpers "^5.2.0"
+    prop-types "^15.7.2"
+    uncontrollable "^7.2.1"
+    warning "^4.0.3"
+
 react-refresh@^0.8.3:
   version "0.8.3"
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"
@@ -11385,6 +11512,16 @@ react-scripts@4.0.3, react-scripts@^4.0.3:
   optionalDependencies:
     fsevents "^2.1.3"
 
+react-transition-group@^4.4.1:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.1.tgz#63868f9325a38ea5ee9535d828327f85773345c9"
+  integrity sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==
+  dependencies:
+    "@babel/runtime" "^7.5.5"
+    dom-helpers "^5.0.1"
+    loose-envify "^1.4.0"
+    prop-types "^15.6.2"
+
 react@^17.0.1, react@^17.0.2:
   version "17.0.2"
   resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
@@ -13374,6 +13511,16 @@ unbox-primitive@^1.0.0:
     has-symbols "^1.0.2"
     which-boxed-primitive "^1.0.2"
 
+uncontrollable@^7.2.1:
+  version "7.2.1"
+  resolved "https://registry.yarnpkg.com/uncontrollable/-/uncontrollable-7.2.1.tgz#1fa70ba0c57a14d5f78905d533cf63916dc75738"
+  integrity sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ==
+  dependencies:
+    "@babel/runtime" "^7.6.3"
+    "@types/react" ">=16.9.11"
+    invariant "^2.2.4"
+    react-lifecycles-compat "^3.0.4"
+
 unicode-canonical-property-names-ecmascript@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818"
@@ -13668,6 +13815,13 @@ walker@^1.0.7, walker@~1.0.5:
   dependencies:
     makeerror "1.0.x"
 
+warning@^4.0.0, warning@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
+  integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==
+  dependencies:
+    loose-envify "^1.0.0"
+
 watchpack-chokidar2@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz#38500072ee6ece66f3769936950ea1771be1c957"