62 lines
1.6 KiB
TypeScript
62 lines
1.6 KiB
TypeScript
import { useCallback, useRef, useState } from 'react';
|
|
|
|
import type {
|
|
Match3DClickItemRequest,
|
|
Match3DRunSnapshot,
|
|
} from '../packages/shared/src/contracts/match3dRuntime';
|
|
import { Match3DRuntimeShell } from './components/match3d-runtime';
|
|
import {
|
|
confirmLocalMatch3DClick,
|
|
resolveLocalMatch3DTimer,
|
|
startLocalMatch3DRun,
|
|
} from './services/match3d-runtime';
|
|
|
|
function buildInitialRun() {
|
|
return startLocalMatch3DRun(12);
|
|
}
|
|
|
|
export default function Match3DPlaygroundApp() {
|
|
const [run, setRun] = useState<Match3DRunSnapshot>(buildInitialRun);
|
|
const authorityRunRef = useRef(run);
|
|
|
|
const syncRun = useCallback((nextRun: Match3DRunSnapshot) => {
|
|
setRun(nextRun);
|
|
}, []);
|
|
|
|
const handleClickItem = useCallback(async (payload: Match3DClickItemRequest) => {
|
|
const result = await confirmLocalMatch3DClick(authorityRunRef.current, payload);
|
|
authorityRunRef.current = result.run;
|
|
setRun(result.run);
|
|
return result;
|
|
}, []);
|
|
|
|
const handleRestart = useCallback(() => {
|
|
const nextRun = buildInitialRun();
|
|
authorityRunRef.current = nextRun;
|
|
setRun(nextRun);
|
|
}, []);
|
|
|
|
const handleExit = useCallback(() => {
|
|
window.location.assign('/');
|
|
}, []);
|
|
|
|
const handleTimeExpired = useCallback(() => {
|
|
const nextRun = resolveLocalMatch3DTimer(authorityRunRef.current);
|
|
authorityRunRef.current = nextRun;
|
|
setRun(nextRun);
|
|
}, []);
|
|
|
|
return (
|
|
<Match3DRuntimeShell
|
|
run={run}
|
|
onBack={handleExit}
|
|
onRestart={handleRestart}
|
|
onOptimisticRunChange={syncRun}
|
|
onClickItem={handleClickItem}
|
|
onTimeExpired={handleTimeExpired}
|
|
error={null}
|
|
isBusy={false}
|
|
/>
|
|
);
|
|
}
|