import { createSlice, createAsyncThunk, type PayloadAction } from "@reduxjs/toolkit"

// Define a type for the vehicle model
export interface VehicleModel {
  id: number
  name: string
  makeId: number
  makeName: string
  typeId: number
  typeName: string
  capacity?: number
}

// Define the state type
interface VehicleModelsState {
  items: VehicleModel[]
  status: "idle" | "loading" | "succeeded" | "failed"
  error: string | null
  filters: {
    search: string
    makes: number[]
    types: number[]
  }
}

// Initial state
const initialState: VehicleModelsState = {
  items: [],
  status: "idle",
  error: null,
  filters: {
    search: "",
    makes: [],
    types: [],
  },
}

// Sample data for initial development
const sampleVehicleModels: VehicleModel[] = [
  { id: 1, name: "Camry", makeId: 1, makeName: "Toyota", typeId: 1, typeName: "Sedan", capacity: 5 },
  { id: 2, name: "Corolla", makeId: 1, makeName: "Toyota", typeId: 1, typeName: "Sedan", capacity: 5 },
  { id: 3, name: "RAV4", makeId: 1, makeName: "Toyota", typeId: 2, typeName: "SUV", capacity: 7 },
  { id: 4, name: "Civic", makeId: 2, makeName: "Honda", typeId: 1, typeName: "Sedan", capacity: 5 },
  { id: 5, name: "CR-V", makeId: 2, makeName: "Honda", typeId: 2, typeName: "SUV", capacity: 7 },
  { id: 6, name: "3 Series", makeId: 3, makeName: "BMW", typeId: 1, typeName: "Sedan", capacity: 5 },
  { id: 7, name: "X5", makeId: 3, makeName: "BMW", typeId: 2, typeName: "SUV", capacity: 7 },
  { id: 8, name: "C-Class", makeId: 4, makeName: "Mercedes-Benz", typeId: 1, typeName: "Sedan", capacity: 5 },
  { id: 9, name: "GLE", makeId: 4, makeName: "Mercedes-Benz", typeId: 2, typeName: "SUV", capacity: 7 },
  { id: 10, name: "A4", makeId: 5, makeName: "Audi", typeId: 1, typeName: "Sedan", capacity: 5 },
  { id: 11, name: "Q5", makeId: 5, makeName: "Audi", typeId: 2, typeName: "SUV", capacity: 7 },
  { id: 12, name: "Mustang", makeId: 6, makeName: "Ford", typeId: 7, typeName: "Coupe", capacity: 4 },
]

// Define the payload type for adding a new vehicle model
export interface AddVehicleModelPayload {
  name: string
  makeId: number
  typeId: number
  capacity?: number
}

// Async thunks for API calls
export const fetchVehicleModels = createAsyncThunk(
  "vehicleModels/fetchVehicleModels",
  async (_, { rejectWithValue }) => {
    try {
      // In a real app, this would be an API call
      await new Promise((resolve) => setTimeout(resolve, 1000))
      return sampleVehicleModels
    } catch (error) {
      return rejectWithValue("Failed to fetch vehicle models")
    }
  },
)

export const addVehicleModel = createAsyncThunk(
  "vehicleModels/addVehicleModel",
  async (payload: AddVehicleModelPayload, { rejectWithValue, getState }) => {
    try {
      // In a real app, this would be an API call
      await new Promise((resolve) => setTimeout(resolve, 1000))

      // Get the make and type names from their respective states
      const state = getState() as any
      const make = state.vehicleMakes.items.find((make: any) => make.id === payload.makeId)
      const type = state.vehicleTypes.items.find((type: any) => type.id === payload.typeId)

      if (!make || !type) {
        return rejectWithValue("Invalid make or type selected")
      }

      // Generate a new ID (in a real app, the server would do this)
      return {
        id: Date.now(),
        name: payload.name,
        makeId: payload.makeId,
        makeName: make.name,
        typeId: payload.typeId,
        typeName: type.name,
        capacity: payload.capacity,
      }
    } catch (error) {
      return rejectWithValue("Failed to add vehicle model")
    }
  },
)

export const deleteVehicleModel = createAsyncThunk(
  "vehicleModels/deleteVehicleModel",
  async (id: number, { rejectWithValue }) => {
    try {
      // In a real app, this would be an API call
      await new Promise((resolve) => setTimeout(resolve, 1000))
      return id
    } catch (error) {
      return rejectWithValue("Failed to delete vehicle model")
    }
  },
)

// Create the slice
const vehicleModelsSlice = createSlice({
  name: "vehicleModels",
  initialState,
  reducers: {
    updateFilters: (state, action: PayloadAction<Partial<VehicleModelsState["filters"]>>) => {
      state.filters = { ...state.filters, ...action.payload }
    },
    resetFilters: (state) => {
      state.filters = initialState.filters
    },
  },
  extraReducers: (builder) => {
    builder
      .addCase(fetchVehicleModels.pending, (state) => {
        state.status = "loading"
      })
      .addCase(fetchVehicleModels.fulfilled, (state, action) => {
        state.status = "succeeded"
        state.items = action.payload
      })
      .addCase(fetchVehicleModels.rejected, (state, action) => {
        state.status = "failed"
        state.error = action.payload as string
      })
      .addCase(addVehicleModel.fulfilled, (state, action) => {
        state.items.push(action.payload)
      })
      .addCase(deleteVehicleModel.fulfilled, (state, action) => {
        state.items = state.items.filter((item) => item.id !== action.payload)
      })
  },
})

export const { updateFilters, resetFilters } = vehicleModelsSlice.actions

export default vehicleModelsSlice.reducer