liveblocks.config.ts

import { LiveList, LiveObject, createClient } from "@liveblocks/client";
import { createRoomContext } from "@liveblocks/react";

const client = createClient({
  publicApiKey: process.env.NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_KEY!,
});

type Presence = {
  username: string | undefined;
  color: string;
  isAdmin: boolean;
};

type Storage = {
  targets: LiveList<{
    id: string;
    value: string;
    coordinates: { x: number; y: number };
    color: string;
    owner: string;
  }>;
  eliminatedTargets: LiveList<{
    id: string;
    value: string;
    coordinates: { x: number; y: number };
    color: string;
    owner: string;
  }>;
  attacker: LiveObject<{ x: number; y: number; color: string }>;
  gameState: "pregame" | "playing" | "end";
};

// Optionally, UserMeta represents static/readonly metadata on each user, as
// provided by your own custom auth back end (if used). Useful for data that
// will not change during a session, like a user's name or avatar.
type UserMeta = {
  // id?: string,  // Accessible through `user.id`
  // info?: Json,  // Accessible through `user.info`
};

// Optionally, the type of custom events broadcast and listened to in this
// room. Use a union for multiple events. Must be JSON-serializable.
type RoomEvent =
  | {
      type: "influence";
      action: "up" | "left" | "right" | "down";
    }
  | {
      type: "eliminated";
      coordinates: {
        x: number;
        y: number;
      };
    };

export const {
  suspense: {
    RoomProvider,
    useRoom,
    useMyPresence,
    useUpdateMyPresence,
    useSelf,
    useOthers,
    useOthersMapped,
    useOthersConnectionIds,
    useOther,
    useBroadcastEvent,
    useEventListener,
    useErrorListener,
    useStorage,
    useObject,
    useMap,
    useList,
    useBatch,
    useHistory,
    useUndo,
    useRedo,
    useCanUndo,
    useCanRedo,
    useMutation,
    useStatus,
    useLostConnectionListener,
  },
} = createRoomContext<Presence, Storage, UserMeta, RoomEvent>(client);