import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import axiosInstance from "../../utils/axiosConfig";
import endpoints from "../../config/apiEndpoints";

interface Message {
    sender: number;
    id: number;
    member_id: number;
    active: number;
    blocked_by_user: string | null | number;
    unseen_message_count: number;
    member_photo: string;
    member_name: string;
    last_message_time: string;
    last_message: string;
    isRead: boolean;
    url: string;
  }
  
  interface MessageState {
    messages: Message[];
    isModalOpen: boolean;
    loading: boolean;
    error: string | null;
    dataFetched: boolean;
  }
  

  const initialState: MessageState = {
    messages: [],
    isModalOpen: false,
    loading: false,
    error: null,
    dataFetched: false,
  };
  const { messages: messagesApi} = endpoints;
  export const fetchMessageData = createAsyncThunk(
    'messages/fetchData',
    async (_, { rejectWithValue }) => {
      try {
        const response = await axiosInstance.get(messagesApi);
        return response.data.data;
      } catch (error) {
        console.error('Error fetching messages data:', error);
        return rejectWithValue((error as Error).message);
      }
    }
  );

  const messageSlice = createSlice({
    name: 'notifications',
    initialState,
    reducers: {
      toggleModal: (state) => {
        state.isModalOpen = !state.isModalOpen; 
      }
    },
    extraReducers: (builder) => {
        builder
          .addCase(fetchMessageData.pending, (state) => {
            state.loading = true;
            state.error = null;
          })
          .addCase(fetchMessageData.fulfilled, (state, action) => {
            state.loading = false;
            state.messages = action.payload;
    
            state.dataFetched = true;
          })
          .addCase(fetchMessageData.rejected, (state, action) => {
            state.loading = false;
            state.error = action.payload as string;
          })
      }
  });


  export const { toggleModal } = messageSlice.actions;
  
  // Export reducer
  export default messageSlice.reducer;