SME-Web/src/store/slices/userSlice.ts

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<UserState, void, { rejectValue: string }>
    ("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<Partial<UserState>>) => {
            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<UserState>) => {
//             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;