TIFNGK_E41222719/src/hooks/useProfileClient.ts

98 lines
2.4 KiB
TypeScript

"use client";
import { useState, useEffect } from "react";
import { useSession } from "next-auth/react";
import { useRouter } from "next/navigation";
import { ProfileClientProps, ProfileFormData, ProfileState } from "@/src/types";
import { OS, Profession } from "@prisma/client";
import { brandFormat } from "../utils/datas";
export const useProfileClient = (props: ProfileClientProps) => {
const session = useSession();
const router = useRouter();
const [showModal, setShowModal] = useState(false);
const [profileDatas, setProfileDatas] = useState<ProfileState>({
name: props.name || "",
bio: props.bio || "",
preference: {
profession: props.profession || "",
preferredBrand: props.preferenceBrand || "",
preferredOS: props.preferenceOS || "",
budgetMin: props.budgetMin ?? 0,
budgetMax: props.budgetMax ?? 0,
},
});
useEffect(() => {
setProfileDatas({
name: props.name || "",
bio: props.bio || "",
preference: {
profession: props.profession || "",
preferredBrand: props.preferenceBrand || "",
preferredOS: props.preferenceOS || "",
budgetMin: props.budgetMin ?? 0,
budgetMax: props.budgetMax ?? 0,
},
});
}, [props]);
const handleOptimisticUpdate = (newData: ProfileFormData) => {
setProfileDatas((prev) => {
const updatedPreference = {
...prev.preference,
profession:
(newData.profession as Profession) || prev.preference.profession,
preferredBrand:
newData.preferredBrand || prev.preference.preferredBrand,
preferredOS: (newData.preferredOS as OS) || prev.preference.preferredOS,
budgetMin: newData.budgetMin ? Number(newData.budgetMin) : 0,
budgetMax: newData.budgetMax ? Number(newData.budgetMax) : 0,
};
return {
...prev,
name: newData.name,
bio: newData.bio,
preference: updatedPreference,
};
});
};
const { name, bio, preference } = profileDatas;
const {
preferredBrand: preferenceBrand,
preferredOS: preferenceOS,
budgetMin,
budgetMax,
profession,
} = preference;
const { brands } = brandFormat({
preferenceBrand: preferenceBrand as any,
});
return {
session,
router,
showModal,
name,
bio,
profession,
brands,
preferenceBrand,
preferenceOS,
profileDatas,
budgetMin,
budgetMax,
handleOptimisticUpdate,
setShowModal,
};
};