// Per-device display preferences (localStorage), observable from React.
import { useSyncExternalStore } from "react";

export type ReasoningMode = "collapsed" | "live" | "expanded" | "hidden";

const KEY = "codecraft.reasoning";
const listeners = new Set<() => void>();

export function getReasoningMode(): ReasoningMode {
  const v = localStorage.getItem(KEY);
  return v === "live" || v === "expanded" || v === "hidden" ? v : "collapsed";
}

export function setReasoningMode(mode: ReasoningMode) {
  localStorage.setItem(KEY, mode);
  listeners.forEach((l) => l());
}

export function useReasoningMode(): ReasoningMode {
  return useSyncExternalStore(
    (l) => {
      listeners.add(l);
      return () => listeners.delete(l);
    },
    getReasoningMode,
  );
}