/**
 * Zustand store for managing onboarding state
 *
 * @see https://www.figma.com/design/cfMOy1RJasIu3QyzAMBFxB/Laconic?node-id=571-3500&m=dev
 */

import { create } from 'zustand';
import { type OnboardingFormData, type Step } from './types';

/**
 * State management for the onboarding flow
 * @interface OnboardingState
 * @property {Step} currentStep - Current active step
 * @property {OnboardingFormData} formData - Collected form data
 * @property {(step: Step) => void} setCurrentStep - Updates the current step
 * @property {(data: Partial<OnboardingFormData>) => void} setFormData - Updates form data
 * @property {() => void} nextStep - Moves to the next step
 * @property {() => void} previousStep - Moves to the previous step
 */
interface OnboardingState {
  currentStep: Step;
  formData: OnboardingFormData;
  setCurrentStep: (step: Step) => void;
  setFormData: (data: Partial<OnboardingFormData>) => void;
  nextStep: () => void;
  previousStep: () => void;
}

/** Order of steps in the onboarding flow */
const STEP_ORDER: Step[] = ['connect', 'configure', 'deploy'];

/**
 * Zustand store for managing onboarding state
 * Used across all onboarding components to maintain flow state
 *
 * @example
 * ```tsx
 * const { currentStep, formData, nextStep } = useOnboarding()
 * ```
 */
export const useOnboarding = create<OnboardingState>((set) => ({
  currentStep: 'connect',
  formData: {},
  setCurrentStep: (step) => set({ currentStep: step }),
  setFormData: (data) =>
    set((state) => ({
      formData: { ...state.formData, ...data },
    })),
  nextStep: () =>
    set((state) => {
      const currentIndex = STEP_ORDER.indexOf(state.currentStep);
      const nextStep = STEP_ORDER[currentIndex + 1];
      return nextStep ? { currentStep: nextStep } : state;
    }),
  previousStep: () =>
    set((state) => {
      const currentIndex = STEP_ORDER.indexOf(state.currentStep);
      const previousStep = STEP_ORDER[currentIndex - 1];
      return previousStep ? { currentStep: previousStep } : state;
    }),
}));