import { createSlice, createAsyncThunk, PayloadAction } from "@reduxjs/toolkit"; import axios from "axios"; import api from "../../config/api"; // --- Types --- export interface Account { id: number; name: string; isDefault: boolean; } export interface UserState { id: number | null; email: string; firstName: string; lastName: string; language?: string; account: Account | null; picture?: string; loading: boolean; error: string | null; authorized?: boolean; accessToken?: string; } // --- Initial State --- const initialState: UserState = { id: null, email: "", firstName: "", lastName: "", language: "", account: null, picture: undefined, loading: true, error: null, authorized: false, accessToken: undefined, }; // --- Thunk to fetch user details --- export const fetchUserDetails = createAsyncThunk ("user/fetchUserDetails", async (_, { rejectWithValue }) => { try { const response = await api.get("/api/user/details"); return response.data; } catch (error: any) { return rejectWithValue( error.response?.data?.message || "Failed to fetch user details" ); } }); // --- Slice --- const userSlice = createSlice({ name: "user", initialState, reducers: { logout: () => ({ ...initialState, }), updateUser: (state, action: PayloadAction>) => { return { ...state, ...action.payload, loading: false, error: null, authorized: true, }; }, }, extraReducers: (builder) => { builder .addCase(fetchUserDetails.pending, (state) => { state.loading = true; state.error = null; }) .addCase(fetchUserDetails.fulfilled, (state, action) => { return { ...state, ...action.payload, loading: false, error: null, authorized: true, }; }) .addCase(fetchUserDetails.rejected, (state, action) => { state.loading = false; state.error = action.payload || "Unknown error"; state.authorized = false; }); }, }); // --- Exports --- export const { logout, updateUser } = userSlice.actions; export default userSlice.reducer; // import { createSlice, PayloadAction } from "@reduxjs/toolkit"; // export interface UserState { // id: string; // username: string; // firstName: string; // lastName: string; // email: string; // picture?: string; // loading: boolean; // error: string | null; // authorized?: boolean; // accessToken?: string; // } // // Load user data from localStorage (if available) // const loadUserFromLocalStorage = (): UserState => { // try { // const userDetails = JSON.parse(localStorage.getItem("user") || "null"); // if (!userDetails || !userDetails.id) { // localStorage.removeItem("user"); // Ensure invalid data is cleared // return { // id: "", // username: "", // firstName: "", // lastName: "", // email: "", // picture: undefined, // loading: false, // error: null, // }; // } // return { // ...userDetails, // loading: false, // error: null, // }; // } catch (e) { // console.log(e.message) // return { // id: "", // username: "", // email: "", // picture: undefined, // loading: false, // error: null, // }; // } // }; // const initialState: UserState = loadUserFromLocalStorage(); // const userSlice = createSlice({ // name: "user", // initialState, // reducers: { // logout: (state) => { // localStorage.removeItem("user"); // return { // id: "", // username: "", // email: "", // picture: undefined, // loading: false, // error: null, // }; // }, // updateUser: (state, action: PayloadAction) => { // localStorage.setItem("user", JSON.stringify(action.payload)); // console.log(action.payload, "Line 70") // return { ...state, ...action.payload, loading: false, error: null }; // }, // }, // }); // export const { logout, updateUser } = userSlice.actions; // export default userSlice.reducer;