Space-Game/apps/game/src/spacetime/useSpacetimeConnection.ts

import { useEffect, useMemo, useRef, useState } from "react";
import type { DbConnection } from "../module_bindings";
import { createSpacetimeConnection, type ConnectionStatus, type IdentityLike } from "./client";

const defaultUri = import.meta.env.VITE_SPACETIME_URI ?? import.meta.env.VITE_SPACETIMEDB_HOST ?? "http://localhost:3000";
const defaultDatabase =
  import.meta.env.VITE_SPACETIME_DATABASE ?? import.meta.env.VITE_SPACETIMEDB_DB_NAME ?? "void-nav-dev";

export function useSpacetimeConnection(displayName: string) {
  const [status, setStatus] = useState<ConnectionStatus>("idle");
  const [message, setMessage] = useState<string>();
  const [identity, setIdentity] = useState<IdentityLike>();
  const [connection, setConnection] = useState<DbConnection | null>(null);
  const [revision, setRevision] = useState(0);
  const [reducerStatus, setReducerStatus] = useState<{ message: string; isError: boolean }>();

  const config = useMemo(
    () => ({
      uri: defaultUri,
      database: defaultDatabase,
    }),
    [],
  );

  const displayNameRef = useRef(displayName);
  displayNameRef.current = displayName;

  useEffect(() => {
    const conn = createSpacetimeConnection({
      ...config,
      displayName: displayNameRef.current,
      onStatus: (nextStatus, nextMessage) => {
        setStatus(nextStatus);
        setMessage(nextMessage);
      },
      onIdentity: setIdentity,
      onDataChanged: () => setRevision((value) => value + 1),
      onReducerStatus: (nextMessage, isError = false) => setReducerStatus({ message: nextMessage, isError }),
    });

    setConnection(conn);

    const refresh = window.setInterval(() => {
      if (conn) setRevision((value) => value + 1);
    }, 1500);

    return () => {
      window.clearInterval(refresh);
      conn?.disconnect?.();
    };
  }, [config]);

  return {
    connection,
    status,
    message,
    identity,
    revision,
    reducerStatus,
    uri: config.uri,
    database: config.database,
  };
}