refactor: enhance representation info fetching and pass it to relevant components

This commit is contained in:
hamed
2025-12-02 15:38:42 +03:30
parent e6cb27a714
commit 3ca69dcd0f
5 changed files with 51 additions and 15 deletions
+30 -1
View File
@@ -2,6 +2,8 @@ import Content from "@/components/panel/Content";
import { defineAbilitiesFor } from "@/lib/ability"; import { defineAbilitiesFor } from "@/lib/ability";
import { getUser } from "@/lib/auth"; import { getUser } from "@/lib/auth";
import { redirect } from "next/navigation"; import { redirect } from "next/navigation";
import { cookies } from "next/headers";
import { fetchReq } from "@/lib/req";
async function LayoutPanel({ children }) { async function LayoutPanel({ children }) {
const user = await getUser(); const user = await getUser();
@@ -11,7 +13,34 @@ async function LayoutPanel({ children }) {
return redirect("/"); return redirect("/");
} }
return <Content children={children} />; let representationInfo = null;
const API_URL = process.env.NEXT_PUBLIC_API_URL;
try {
const cookieStore = cookies();
const userInfo = cookieStore.get("userInfo");
const accessToken = cookieStore.get("access_token");
if (userInfo && accessToken) {
const parsedUserInfo = JSON.parse(userInfo.value);
const representationUuid = parsedUserInfo?.representation_uuid;
if (representationUuid) {
representationInfo = await fetchReq(
`${API_URL}/api/v1/representation/${representationUuid}`,
{
headers: {
Authorization: `Bearer ${accessToken.value}`,
},
}
);
}
}
} catch (error) {
console.error("Error fetching representation info:", error);
}
return <Content children={children} representationInfo={representationInfo} />;
} }
export default LayoutPanel; export default LayoutPanel;
+4 -2
View File
@@ -6,7 +6,9 @@ import { Button } from "@mui/material";
import Image from "next/image"; import Image from "next/image";
import React from "react"; import React from "react";
function Head({ data, loading }) { function Head({ data, loading, representationInfo }) {
const cityName = representationInfo?.city?.label || "اهواز";
return ( return (
<div className="flex w-full flex-col items-center justify-start"> <div className="flex w-full flex-col items-center justify-start">
<CircularLoading width={80} height={80} loading={loading}> <CircularLoading width={80} height={80} loading={loading}>
@@ -23,7 +25,7 @@ function Head({ data, loading }) {
<LocationP /> <LocationP />
<TextLoading width={55} height={16} loading={loading}> <TextLoading width={55} height={16} loading={loading}>
<p className="text-[#7E7E7E] text-[14px] font-normal dark:text-[#A1A1A1]"> <p className="text-[#7E7E7E] text-[14px] font-normal dark:text-[#A1A1A1]">
نماینده شهر اهواز نماینده شهر {cityName}
</p> </p>
</TextLoading> </TextLoading>
</div> </div>
+2 -2
View File
@@ -2,14 +2,14 @@ import Head from "./Head";
import Date from "./Date"; import Date from "./Date";
import Activities from "./Activities"; import Activities from "./Activities";
function UserDetail({ data, loading }) { function UserDetail({ data, loading, representationInfo }) {
return ( return (
<div className="hidden xl:flex min-w-[332px] h-full opacity-page"> <div className="hidden xl:flex min-w-[332px] h-full opacity-page">
<div <div
className="min-w-[332px] p-[24px] border-0 border-r border-r-[#EFEFEF] h-full items-start fixed top-0 left-0 className="min-w-[332px] p-[24px] border-0 border-r border-r-[#EFEFEF] h-full items-start fixed top-0 left-0
g-[#FFF] py-[40px] px-[16px] bg-[#FFF] dark:bg-[#222433] dark:border-transparent" g-[#FFF] py-[40px] px-[16px] bg-[#FFF] dark:bg-[#222433] dark:border-transparent"
> >
<Head data={data} loading={loading} /> <Head data={data} loading={loading} representationInfo={representationInfo} />
<span className="block w-full h-px bg-[#EFEFEF] px-[22px] mt-[13px] mb-[16px] dark:bg-[#343645]"></span> <span className="block w-full h-px bg-[#EFEFEF] px-[22px] mt-[13px] mb-[16px] dark:bg-[#343645]"></span>
<Date /> <Date />
<Activities data={data} loading={loading} /> <Activities data={data} loading={loading} />
+7 -4
View File
@@ -8,7 +8,7 @@ import UserDetail from "@/components/layoutPanel/userDetail";
import { usePathname } from "next/navigation"; import { usePathname } from "next/navigation";
import BgGray from "@/components/layoutPanel/sidebar/BgGray"; import BgGray from "@/components/layoutPanel/sidebar/BgGray";
function Content({ children }) { function Content({ children, representationInfo }) {
const pathname = usePathname(); const pathname = usePathname();
const [active, setActive] = useState(false); const [active, setActive] = useState(false);
const [open, setOpen] = useState(true); const [open, setOpen] = useState(true);
@@ -32,8 +32,7 @@ function Content({ children }) {
<main <main
className={` className={`
w-full transition-all duration-500 dark:bg-[#1F1D2B] w-full transition-all duration-500 dark:bg-[#1F1D2B]
${ ${pathname.includes("dashboard")
pathname.includes("dashboard")
? open ? open
? "md:min-w-[calc(100%_-_243px)] md:w-[calc(100%_-_243px)] xl:min-w-[calc(100%_-_243px_-_332px)] xl:w-[calc(100%_-_243px_-_332px)]" ? "md:min-w-[calc(100%_-_243px)] md:w-[calc(100%_-_243px)] xl:min-w-[calc(100%_-_243px_-_332px)] xl:w-[calc(100%_-_243px_-_332px)]"
: "md:min-w-[calc(100%_-_96px)] md:w-[calc(100%_-_96px)] xl:min-w-[calc(100%_-_96px_-_332px)] xl:w-[calc(100%_-_96px_-_332px)]" : "md:min-w-[calc(100%_-_96px)] md:w-[calc(100%_-_96px)] xl:min-w-[calc(100%_-_96px_-_332px)] xl:w-[calc(100%_-_96px_-_332px)]"
@@ -53,7 +52,11 @@ function Content({ children }) {
</section> </section>
</main> </main>
{pathname.includes("dashboard") && ( {pathname.includes("dashboard") && (
<UserDetail data={Information} loading={loading} /> <UserDetail
data={Information}
loading={loading}
representationInfo={representationInfo}
/>
)} )}
</div> </div>
); );
+2
View File
@@ -123,4 +123,6 @@ export const request = {
Authorization: "", Authorization: "",
}, },
}), }),
getRepresentationInfo: (uuid) =>
api.get(`api/v1/representation/${uuid}`, { requireAuth: true }),
}; };