front-hub/src/stores/user.ts

import { PatchUserRequest, UserSettings, UserSettingsField, UserWithFields } from "@root/model/user";
import { produce } from "immer";
import { create } from "zustand";
import { createJSONStorage, devtools, persist } from "zustand/middleware";
import { StringSchema, string } from "yup";
import { patchUser } from "@root/api/user";


interface UserStore {
    userId: string | null;
    user: UserWithFields | null;
    settingsFields: UserSettings | null;
}

const defaultFieldValues = {
    value: "",
    error: null,
    touched: false,
};

const defaultFields = {
    name: { ...defaultFieldValues },
    surname: { ...defaultFieldValues },
    middleName: { ...defaultFieldValues },
    companyName: { ...defaultFieldValues },
    email: { ...defaultFieldValues },
    phoneNumber: { ...defaultFieldValues },
    password: { ...defaultFieldValues },
};

const initialState: UserStore = {
    userId: null,
    user: null,
    settingsFields: { ...defaultFields },
};

export const useUserStore = create<UserStore>()(
    persist(
        devtools(
            (set, get) => initialState,
            {
                name: "User store",
                enabled: process.env.NODE_ENV === "development",
            }
        ),
        {
            name: "user",
            storage: createJSONStorage(() => localStorage),
            partialize: state => ({
                userId: state.userId,
                user: state.user,
            })
        }
    )
);

export const setUserId = (userId: string | null) => useUserStore.setState({ userId });
export const setUser = (user: UserWithFields | null) => useUserStore.setState(
    produce<UserStore>(state => {
        state.user = user;
        if (!user) {
            state.settingsFields = null;
            return;
        }

        if (!state.settingsFields) state.settingsFields = { ...defaultFields };

        state.settingsFields.name.value = user.name || "";
        state.settingsFields.surname.value = user.surname || "";
        state.settingsFields.middleName.value = user.middleName || "";
        state.settingsFields.companyName.value = user.companyName || "";
        state.settingsFields.email.value = user.email;
        state.settingsFields.phoneNumber.value = user.phoneNumber;
        state.settingsFields.password.value = "";
    })
);

export const clearUser = () => useUserStore.setState({ ...initialState });

export const setSettingsField = async (
    fieldName: UserSettingsField,
    value: string,
) => {
    const state = useUserStore.getState();
    let errorMessage: string | null = null;

    try {
        validators[fieldName].validateSync(value);
    } catch (error: any) {
        errorMessage = error.message;
    }

    useUserStore.setState(produce<UserStore>(state, state => {
        if (!state.settingsFields) return;

        state.settingsFields[fieldName].value = value || "";
        state.settingsFields[fieldName].touched = true;
        state.settingsFields[fieldName].error = errorMessage;
    }));
};

export const sendUserData = async () => {
    const state = useUserStore.getState();
    if (!state.settingsFields) return;

    const payload: PatchUserRequest = {};

    for (const [fieldName, fieldValue] of Object.entries(state.settingsFields)) {
        if (
            fieldValue.value !== (state.user?.[fieldName as UserSettingsField] ?? "")
        ) payload[fieldName as UserSettingsField] = fieldValue.value;
    }

    const user = await patchUser(payload);
    setUser(user);
};

const validators: Record<UserSettingsField, StringSchema> = {
    name: string(),
    email: string().email("Неверный email"),
    surname: string(),
    phoneNumber: string().matches(/^[+\d|\d]*$/, "Неверный номер телефона").min(6, "Номер телефона должен содержать минимум 6 символов"),
    middleName: string(),
    password: string().min(8, "Минимум 8 символов").matches(/^[.,:;-_+\d\w]+$/, "Некорректные символы в пароле"),
    companyName: string(),
};