42 lines
1.3 KiB
JavaScript
42 lines
1.3 KiB
JavaScript
import './GameSelector.css';
|
|
import React from 'react';
|
|
import { useLocation, matchPath } from "react-router";
|
|
|
|
import { AppData } from "../../context/data"
|
|
import { AppContext } from "../../context/app"
|
|
import Proposal from './GameSelector/GameProposal';
|
|
|
|
export default function GameSelector() {
|
|
const [data] = React.useContext(AppData)
|
|
const [ctx, dispatchCtx] = React.useContext(AppContext)
|
|
|
|
const { pathname } = useLocation();
|
|
const isProposalPath = matchPath("/game/proposal/*", pathname);
|
|
const isActivelPath = matchPath("/game/active/*", pathname);
|
|
const isArchivePath = matchPath("/game/archive/*", pathname);
|
|
|
|
console.log("GameSelector appCtx", ctx)
|
|
|
|
const onClick_proposal = (selectedGame) => {
|
|
dispatchCtx({ component: "game-selector", selectedGameProposal: selectedGame })
|
|
}
|
|
|
|
const onClick_active = (selectedGame) => {
|
|
dispatchCtx({ component: "game-selector", selectedActiveGame: selectedGame })
|
|
}
|
|
|
|
const onClick_archive = (selectedGame) => {
|
|
dispatchCtx({ component: "game-selector", selectedArchiveGame: selectedGame })
|
|
}
|
|
|
|
if (!data.games)
|
|
return <div>Loading..</div>
|
|
|
|
return (
|
|
<div className='game-selector'>
|
|
{isProposalPath && <Proposal games={data.games} onClick={onClick_proposal} />}
|
|
{isActivelPath && <div>TBD #1</div>}
|
|
{isArchivePath && <div>TBD #2</div>}
|
|
</div>
|
|
)
|
|
} |