Tablebase Integration

const tablebaseURL = "https://tablebase.lichess.ovh";

export async function getTablebaseInfo(fen: string): Promise<TablebaseData> {
  const res = await fetch(`${tablebaseURL}/standard?fen=${fen}`);
  if (!res.ok) {
    throw new Error(`Failed to load tablebase info for ${fen} - ${res.status}`);
  }
  return res.json();
}

type TablebaseData = {
  checkmate: boolean;
  stalemate: boolean;
  variant_win: boolean;
  variant_loss: boolean;
  insufficient_material: boolean;
  dtz: number;          // Distance to zeroing (capture/pawn move)
  precise_dtz: number;  // Precise DTZ for optimal play
  dtm: number;          // Distance to mate (when available)
  category: TablebaseCategory;
  moves: TablebaseMove[];
};

const label = wins
  ? normalizedCategory
  : match(category)
      .with("draw", () => t("chess.outcome.draw"))
      .with("unknown", () => t("features.tablebase.unknown"))
      .otherwise(() =>
        dtm 
          ? t("features.tablebase.dtm", { count: Math.abs(dtm) }) 
          : t("features.tablebase.dtz", { count: dtz }),
      );

<Accordion.Item value="tablebase">
  <Accordion.Control>
    <Group>
      <Text fw="bold">{t("features.tablebase.title")}</Text>
      {isLoading && (
        <Badge variant="transparent">{t("common.loading")}</Badge>
      )}
      {error && (
        <Text ta="center">
          {t("features.tablebase.error")}
          {error.message}
        </Text>
      )}
      {data && <OutcomeBadge category={data.category} turn={turn} wins />}
    </Group>
  </Accordion.Control>
  <Accordion.Panel>
    {/* Move list */}
  </Accordion.Panel>
</Accordion.Item>

<SimpleGrid cols={3}>
  {sortedMoves?.map((m) => (
    <Paper
      withBorder
      key={m.san}
      px="xs"
      onClick={() => {
        makeMove({ payload: parseUci(m.uci)! });
      }}
      className={classes.info}
    >
      <Group gap="xs" justify="space-between" wrap="nowrap">
        <Text fz="0.9rem" fw={600} ta="center">
          {m.san}
        </Text>
        <OutcomeBadge
          category={m.category}
          dtz={Math.abs(m.dtz)}
          dtm={m.dtm}
          turn={turn === "white" ? "black" : "white"}
        />
      </Group>
    </Paper>
  ))}
</SimpleGrid>

const sortedMoves = data?.moves.sort((a, b) => {
  // Winning moves first
  if (a.category === "win" && b.category !== "win") {
    return 1;
  }
  if (a.category !== "win" && b.category === "win") {
    return -1;
  }
  // Losing moves last
  if (a.category === "loss" && b.category !== "loss") {
    return -1;
  }
  if (a.category !== "loss" && b.category === "loss") {
    return 1;
  }
  return 0;
});

const { data, error, isLoading } = useQuery({
  queryKey: ["tablebase", fen],
  queryFn: async () => await getTablebaseInfo(fen),
  staleTime: Infinity,  // Tablebase data never changes
  enabled: !!fen,
});

{["blessed-loss", "cursed-win", "maybe-win", "maybe-loss"].includes(category) && wins && (
  <Text c="dimmed" fz="xs">
    {t("features.tablebase.fiftyMoveRule")}
  </Text>
)}

const color = match(category)
  .with("win", () => (turn === "white" ? "white" : "black"))
  .with("loss", () => (turn === "white" ? "black" : "white"))
  .otherwise(() => "gray");

onClick={() => {
  makeMove({ payload: parseUci(m.uci)! });
}}

if (!res.ok) {
  throw new Error(`Failed to load tablebase info for ${fen} - ${res.status}`);
}
return res.json();