equip-reserve-frontend/src/features/auth/authSlice.ts

import { createSlice } from "@reduxjs/toolkit";
import { login } from "./authThunk";
import { RootState } from "store";

interface AuthState {
  userId: string | null;
  name: string | null;
  roles: string[];
  token: string | null;
}

const initialState: AuthState = {
  userId: "",
  name: "",
  roles: [],
  token: "",
};

const authSlice = createSlice({
  name: "authSlice",
  initialState: initialState,
  reducers: {
    logout(state) {
      state.userId = "";
      state.name = "";
      state.token = "";
      state.roles = [];

      localStorage.removeItem("userId");
      localStorage.removeItem("name");
      localStorage.removeItem("roles");
      localStorage.removeItem("token");
    },
  },
  extraReducers: (builder) => {
    builder.addCase(login.fulfilled, (state, action) => {
      const payload = action.payload;
      state.userId = payload.userId;
      state.name = payload.name;
      state.roles = payload.roles;
      state.token = payload.token;

      localStorage.setItem("userId", payload.userId.toString());
      localStorage.setItem("name", payload.name);
      localStorage.setItem("roles", JSON.stringify(payload.roles));
      localStorage.setItem("token", action.payload.token);
    });
  },
});

export const { logout } = authSlice.actions;
export const selectUserRole = (state: RootState) => state.auth.roles;
export const selectUserName = (state: RootState) => state.auth.name;
export const selectUserId = (state: RootState) => state.auth.userId;
export default authSlice.reducer;