// File Path: monorepo/web/frontend/src/pages/Admin/Event/InSchool/Add/Step2Page.jsx

import React, { useMemo } from "react";
import { useNavigate } from "react-router";
import {
  useAuthManager,
  useOnsiteEventWizardStorage,
} from "../../../../../services/Services";
import EventStep3Component from "../../../../../components/business/events/EventStep3Component";
import {
  PlusIcon,
  AcademicCapIcon,
  HomeIcon,
} from "@heroicons/react/24/outline";

function AdminEventInSchoolAddStep3Page() {
  const authManager = useAuthManager();
  const onsiteEventWizardStorage = useOnsiteEventWizardStorage();
  const navigate = useNavigate();

  // Steps configuration for UIX StepWizard - memoized to prevent re-renders
  const steps = useMemo(
    () => [
      {
        id: "step1",
        title: "Setup",
        isCompleted: true,
      },
      {
        id: "step2",
        title: "Event Type",
        isCompleted: false,
      },
      {
        id: "step3",
        title: "Details",
        isCompleted: false,
      },
      {
        id: "step4",
        title: "Review",
        isCompleted: false,
      },
    ],
    [],
  );

  // Event type configuration for in-school events - memoized to prevent re-renders
  const eventTypeConfig = useMemo(
    () => ({
      labels: {
        eventTypeName: "In-School Event",
      },
      routes: {
        list: "/admin/events/in-schools",
        step1: "/admin/events/in-schools/add/step-1",
        step2: "/admin/events/in-schools/add/step-2",
        step3: "/admin/events/in-schools/add/step-3",
        step4: "/admin/events/in-schools/add/step-4",
      },
      icons: {
        wizard: AcademicCapIcon,
      },
    }),
    [],
  );

  // Create storage adapter to match EventStep3Component interface - memoized to prevent re-renders
  const storageAdapter = useMemo(
    () => ({
      getWizardData: () => onsiteEventWizardStorage.getOnsiteEventWizard(),
      saveWizardData: (data) =>
        onsiteEventWizardStorage.saveOnsiteEventWizard(data),
      clearWizardData: () => onsiteEventWizardStorage.clearOnsiteEventWizard(),
    }),
    [],
  );

  return (
    <EventStep3Component
      // Required props
      wizardStorage={storageAdapter}
      eventTypeConfig={eventTypeConfig}
      // Feature flags for in-school events
      enableSHSM={true}
      enablePartners={true}
      enableLocation={true}
      enableListingUrl={true}
      enableFacilitatorTimeFrames={true}
      // Custom field labels and configs for in-school events
      customLabels={{
        attendeeCapacity: "Student Capacity",
        attendeeCapacityHelper:
          "Enter the maximum number of students for this in-school event",
        facilitatorTimeFrames: "Facilitator/Speaker Time Frames",
        facilitatorTimeFramesHelper:
          "Select when facilitators/speakers will be needed at the school",
      }}
      // Default values specific to in-school events
      defaultValues={{
        facilitatorAM: true,
        facilitatorPM: true,
      }}
      // Step wizard configuration (override defaults)
      defaultSteps={steps}
    />
  );
}

export default AdminEventInSchoolAddStep3Page;
