import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'
import type { TrackDetail } from '../../types'
import { getTrackInfo } from '../../furumiApi'

export const fetchTrackDetail = createAsyncThunk(
  'trackDetail/fetch',
  async (trackSlug: string, { rejectWithValue }) => {
    const data = await getTrackInfo(trackSlug)
    if (data === null) return rejectWithValue('Failed to fetch track detail')
    return { trackSlug, detail: data }
  },
)

interface TrackDetailState {
  bySlug: Record<string, TrackDetail>
  loading: boolean
  error: string | null
}

const initialState: TrackDetailState = {
  bySlug: {},
  loading: false,
  error: null,
}

const trackDetailSlice = createSlice({
  name: 'trackDetail',
  initialState,
  reducers: {
    clearTrackDetail(state) {
      state.bySlug = {}
      state.error = null
    },
    removeTrackDetail(state, action: { payload: string }) {
      delete state.bySlug[action.payload]
    },
  },
  extraReducers: (builder) => {
    builder
      .addCase(fetchTrackDetail.pending, (state) => {
        state.loading = true
        state.error = null
      })
      .addCase(fetchTrackDetail.fulfilled, (state, action) => {
        state.loading = false
        state.bySlug[action.payload.trackSlug] = action.payload.detail
        state.error = null
      })
      .addCase(fetchTrackDetail.rejected, (state, action) => {
        state.loading = false
        state.error = action.payload as string ?? 'Unknown error'
      })
  },
})

export const { clearTrackDetail, removeTrackDetail } = trackDetailSlice.actions
export default trackDetailSlice.reducer