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

console.log(applyMiddleware);

export const userSlice = createSlice({
  name: 'user',
  initialState: {
    token: "",
    username:"", 
  },
  reducers: {
    login: (state, action) => {
      state.token = action.payload.token;
      state.username = action.payload.username;
    },
    disconnect: state => {
      state.token = "";
      state.username = "";
    }
  },
  
})

export const {login, disconnect} = userSlice.actions;

// Local clip structure
// [
//  {"content":"first"},
// ]

export const localClipsSlice = createSlice({
  name: 'localClips',
  initialState: {
    localClip:[],
  },
  reducers: {
    localClipAddToList: (state,action) => { 
      state.localClip = [...state.localClip,action.payload]
    },
    localClipRemoveFromList: (state,action) => {
      state.localClip = state.localClip.filter(e => e !== action.payload)
    },
    localClipClear : (state,action) =>{
      state.localClip = []
    }
  }
})

export const {localClipAddToList, localClipRemoveFromList, localClipClear} = localClipsSlice.actions;

// Remote clip structure
// [
//  {"content":"first","device":"user_pc","timestamp":1711819286000}
// ]

export const remoteClipsSlice = createSlice({
  name: 'remoteClips',
  initialState: {
    remoteClip:[],
  },
  reducers: {
    remoteClipAddToList: (state,action) => { 
      console.log(action.payload);
      state.remoteClip = action.payload
    },
    remoteClipRemoveFromList: (state,action) => {
      state.remoteClip = state.remoteClip.filter(e => e !== action.payload); 
    },
    remoteClipClear : (state,action) =>{
      state.remoteClip = []
    },
    
  }
})

export const {remoteClipAddToList, remoteClipRemoveFromList, remoteClipClear} = remoteClipsSlice.actions;


export const localNotifsSlice = createSlice({
  name: 'localNotifs',
  initialState: {
    localNotif:[],
  },
  reducers: {
    localNotifAddToList: (state,action) => { 
      state.localNotif = [...state.localNotif,action.payload]
    },
    localNotifRemoveFromList: (state,action) => {
      state.localNotif = state.localNotif.filter(e => e !== action.payload)
    },
    localNotifClear : (state,action) =>{
      state.localNotif = []
    }
  }
})

export const {localNotifAddToList, localNotifRemoveFromList, localNotifClear} = localNotifsSlice.actions;

export const remoteNotifsSlice = createSlice({
  name: 'remoteNotifs',
  initialState: {
    remoteNotif:[],
  },
  reducers: {
    remoteNotifAddToList: (state,action) => { 
      state.remoteNotif = [...action.payload]
    },
    remoteNotifRemoveFromList: (state,action) => {
      state.remoteNotif = state.remoteNotif.filter(e => e !== action.payload); 
    },
    remoteNotifClear : (state,action) =>{
      state.remoteNotif = []
    }
  }
})

export const {remoteNotifAddToList, remoteNotifRemoveFromList, remoteNotifClear} = remoteNotifsSlice.actions;