import * as React from "react";
import { createToolcraftModuleDefinition } from "../../contract/module-definition";
import type { ToolcraftModuleRecord } from "../../contract/module-protocol";
import { snapshotToolcraftModuleData } from "../../contract/module-data";
import { createToolcraftCommandRouter, type ToolcraftCommandHandlers } from "../../contract/command-handlers";
import { createToolcraftPersistenceCodec } from "../../contract/persistence-codec";
import { PanelHost } from "../../../react/panel-host/panel-host";

type NotesState = { notes: readonly string[]; revision: number; };
type NotesCommand = { type: "notes.replace"; notes: readonly string[]; };
type NotesDeclaration = Readonly<{ id: "notes.surface"; moduleId: "notes"; kind: "panel-surface"; surface: "notes"; configuration: Readonly<{ enabled: true; }>; }>;
type NotesRecord = Omit<ToolcraftModuleRecord, "id" | "contributions"> & { id: "notes"; contributions: readonly NotesDeclaration[]; };

export const notesModule = () => createToolcraftModuleDefinition<NotesRecord>({
  id: "notes", provides: ["notes.editing"], requires: [], portRequirements: [], defaultProviders: [],
  contributions: [{ id: "notes.surface", moduleId: "notes", kind: "panel-surface", surface: "notes", configuration: { enabled: true } }],
}, snapshotToolcraftModuleData);

export const notesCommands = {
  "notes.replace": (state, command) => ({ notes: Object.freeze([...command.notes]), revision: state.revision + 1 }),
} satisfies ToolcraftCommandHandlers<NotesState, NotesCommand>;
export const reduceNotes = createToolcraftCommandRouter<NotesState, NotesCommand>(notesCommands);

export const notesPersistence = createToolcraftPersistenceCodec<NotesState, undefined, Pick<NotesState, "notes">, "notes">({
  notes: {
    fields: ["notes"],
    read: (_context, data) => Array.isArray(data.notes) && data.notes.every(note => typeof note === "string") ? { notes: [...data.notes] } : undefined,
    write: state => ({ notes: [...state.notes] }),
  },
});

export function NotesSurface({ state }: { state: NotesState; }) {
  return <PanelHost panelType="controls" panelId="notes"><output aria-label="Notes">{state.notes.join("; ")}</output></PanelHost>;
}