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

interface ITransactionsData {
  id: number;
  merchandId: number;
  transactionID: number;
  user: number;
  created: string;
  state: string;
  statusDescription: string;
  pspStatusCode: number;

}
interface ITransactionsState {
  data: ITransactionsData[];
  loading: boolean;
  error: null | string;
  totalTransactions: number
}



const initialState: ITransactionsState = {
  data: [],
  loading: false,
  error: null,
  totalTransactions: 0,
}

const transactionsSlice = createSlice({
  name: 'transactions',
  initialState,
  reducers: {
  },
  extraReducers: (builder) => {
    builder
      .addCase(getTransactions.pending, (state) => {
        state.loading = true;
        state.error = null;
      })
      .addCase(getTransactions.fulfilled, (state, action) => {
        state.data = action.payload.transactions;
        state.totalTransactions = action.payload.count;
        state.loading = false;
      })
      .addCase(getTransactions.rejected, (state, action) => {
        state.error = action.error.message || "Failed to fetch categories";
        state.loading = false;
        state.data = [];
      })
  }
},
);

export default transactionsSlice.reducer;


export const getTransactions = createAsyncThunk(
  'transactions/getTransactions',
  async (
    {
      userId = '',
      state = '',
      statusCode = '',
    }: { userId?: string; state?: string; statusCode?: string } = {}
  ) => {
    const url = new URL('https://api.example.com/transactions');

    if (userId) url.searchParams.append('userId', userId);
    if (state) url.searchParams.append('state', state);
    if (statusCode) url.searchParams.append('statusCode', statusCode);

    const response = await fetch(url.toString());

    if (!response.ok) {
      throw new Error('Failed to fetch transactions');
    }

    const data = await response.json();
    return data; // Let the reducer store this
  }
);