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

// Define a type for the vehicle make
export interface VehicleMake {
  id: number
  name: string
}

// Define the state type
interface VehicleMakesState {
  items: VehicleMake[]
  status: "idle" | "loading" | "succeeded" | "failed"
  error: string | null
  filters: {
    search: string
  }
}

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

// Sample data for initial development
const sampleVehicleMakes: VehicleMake[] = [
  { id: 1, name: "Toyota" },
  { id: 2, name: "Honda" },
  { id: 3, name: "BMW" },
  { id: 4, name: "Mercedes-Benz" },
  { id: 5, name: "Audi" },
  { id: 6, name: "Ford" },
  { id: 7, name: "Chevrolet" },
  { id: 8, name: "Volkswagen" },
  { id: 9, name: "Hyundai" },
  { id: 10, name: "Cadillac" },
  { id: 11, name: "Lexus" },
  { id: 12, name: "Nissan" },
]

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

export const addVehicleMake = createAsyncThunk(
  "vehicleMakes/addVehicleMake",
  async (name: string, { rejectWithValue }) => {
    try {
      // In a real app, this would be an API call
      await new Promise((resolve) => setTimeout(resolve, 1000))
      // Generate a new ID (in a real app, the server would do this)
      return {
        id: Date.now(),
        name,
      }
    } catch (error) {
      return rejectWithValue("Failed to add vehicle make")
    }
  },
)

export const deleteVehicleMake = createAsyncThunk(
  "vehicleMakes/deleteVehicleMake",
  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 make")
    }
  },
)

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

export const { updateFilters, resetFilters } = vehicleMakesSlice.actions

export default vehicleMakesSlice.reducer