/**
 * @fileoverview Componente React principal do jogo Ordenação.
 * @module games.ordenacao.OrdenacaoGame
 */

import { useEffect, useMemo } from "react";
import GameBase from "../../../components/game/GameBase";
import GameEditor from "../../../components/game/GameEditor";
import BlocklyEditor from "../../../components/game/editors/BlocklyEditor";
import { createGame } from "./game";
import { gameConfig } from "./config/config";
import { generateDynamicToolbox, registerBlocks } from "./blocks/blocks";
import { GameStateProvider, useGameState } from "../../../contexts/GameStateContext";
import { starterBlocks } from "./config/starterBlock";

function OrdenacaoContent() {
  const { setFailureMessage } = useGameState();

  useEffect(() => {
    registerBlocks();
  }, []);

  const toolboxGenerator = useMemo(
    () => (allowedBlocks) => generateDynamicToolbox(allowedBlocks),
    []
  );

  return (
    <GameBase
      gameFactory={createGame}
      gameConfig={gameConfig}
      customFailureHandler={setFailureMessage}
    >
      <GameEditor>
        <BlocklyEditor
          toolboxGenerator={toolboxGenerator}
          starterBlocks={starterBlocks}
        />
      </GameEditor>
    </GameBase>
  );
}

export default function OrdenacaoGame() {
  return (
    <GameStateProvider gameConfig={gameConfig}>
      <OrdenacaoContent />
    </GameStateProvider>
  );
}
