import { create } from "zustand";
import { ThemeConfig } from "~/utils/theme/ThemeConfig";

interface ThemePreviewState {
  isPreviewActive: boolean;
  previewTheme: string | null;
  previewConfig: ThemeConfig | null;
  setPreviewTheme: (theme: string | null) => void;
  setPreviewConfig: (config: ThemeConfig | null) => void;
  enablePreview: () => void;
  disablePreview: () => void;
  resetPreview: () => void;
}

export const useThemePreviewStore = create<ThemePreviewState>((set) => ({
  isPreviewActive: false,
  previewTheme: null,
  previewConfig: null,

  setPreviewTheme: (theme) => set({ previewTheme: theme }),

  setPreviewConfig: (config) => set({ previewConfig: config }),

  enablePreview: () => set({ isPreviewActive: true }),

  disablePreview: () =>
    set({
      isPreviewActive: false,
      previewTheme: null,
      previewConfig: null,
    }),

  resetPreview: () =>
    set({
      previewTheme: null,
      previewConfig: null,
    }),
}));