fix home
deskripsi: - pemanggilan api di rapikan
This commit is contained in:
@@ -3,10 +3,10 @@ import { AccentColor, MainColor } from "@/app_modules/_global/color";
|
||||
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
|
||||
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
|
||||
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
import {
|
||||
ActionIcon,
|
||||
Box,
|
||||
Flex,
|
||||
Grid,
|
||||
Group,
|
||||
Image,
|
||||
@@ -22,40 +22,20 @@ import { useRouter } from "next/navigation";
|
||||
import { useState } from "react";
|
||||
import { apiGetDataHome } from "../fun/get/api_home";
|
||||
import { listMenuHomeBody, menuHomeJob } from "./list_menu_home";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
|
||||
export default function BodyHome() {
|
||||
export default function BodyHome({ dataUser }: { dataUser: any | null }) {
|
||||
const router = useRouter();
|
||||
const [dataUser, setDataUser] = useState<any | null>(null);
|
||||
const [dataJob, setDataJob] = useState<any[] | null>(null);
|
||||
const [loadingJob, setLoadingJob] = useState(true);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
useShallowEffect(() => {
|
||||
cekUserLogin();
|
||||
getHomeJob();
|
||||
}, []);
|
||||
|
||||
async function cekUserLogin() {
|
||||
try {
|
||||
const response = await apiGetDataHome({
|
||||
path: "?cat=cek_profile",
|
||||
});
|
||||
|
||||
if (response) {
|
||||
setDataUser(response.data);
|
||||
}
|
||||
} catch (error) {
|
||||
clientLogger.error("Error get data profile", error);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
async function getHomeJob() {
|
||||
try {
|
||||
setLoadingJob(true);
|
||||
|
||||
const response = await apiGetDataHome({
|
||||
path: "?cat=job",
|
||||
});
|
||||
@@ -101,21 +81,14 @@ export default function BodyHome() {
|
||||
border: `2px solid ${AccentColor.blue}`,
|
||||
}}
|
||||
onClick={() => {
|
||||
if (dataUser == null) {
|
||||
if (!dataUser) {
|
||||
return null;
|
||||
} else if (
|
||||
Object.keys(dataUser).length == 0 ||
|
||||
dataJob?.length == null
|
||||
) {
|
||||
} else if (dataUser.profile === undefined) {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
} else if (e.link == "") {
|
||||
ComponentGlobal_NotifikasiPeringatan("Cooming Soon");
|
||||
} else {
|
||||
if (e.link == "") {
|
||||
return ComponentGlobal_NotifikasiPeringatan(
|
||||
"Cooming Soon !!"
|
||||
);
|
||||
} else {
|
||||
router.push(e.link, { scroll: false });
|
||||
}
|
||||
router.push(e.link, { scroll: false });
|
||||
}
|
||||
}}
|
||||
>
|
||||
@@ -147,21 +120,14 @@ export default function BodyHome() {
|
||||
>
|
||||
<Stack
|
||||
onClick={() => {
|
||||
if (dataUser == null) {
|
||||
if (!dataUser) {
|
||||
return null;
|
||||
} else if (
|
||||
Object.keys(dataUser).length == 0 ||
|
||||
dataJob?.length == null
|
||||
) {
|
||||
} else if (dataUser.profile === undefined) {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
} else if (menuHomeJob.link == "") {
|
||||
ComponentGlobal_NotifikasiPeringatan("Cooming Soon ");
|
||||
} else {
|
||||
if (menuHomeJob.link == "") {
|
||||
return ComponentGlobal_NotifikasiPeringatan(
|
||||
"Cooming Soon !!"
|
||||
);
|
||||
} else {
|
||||
return router.push(menuHomeJob.link, { scroll: false });
|
||||
}
|
||||
router.push(menuHomeJob.link, { scroll: false });
|
||||
}
|
||||
}}
|
||||
>
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
import { APIs } from "@/app/lib";
|
||||
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
|
||||
import { MainColor } from "@/app_modules/_global/color";
|
||||
import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/_global/notif_global";
|
||||
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
|
||||
import {
|
||||
ActionIcon,
|
||||
Box,
|
||||
@@ -9,37 +11,14 @@ import {
|
||||
Stack,
|
||||
Text,
|
||||
} from "@mantine/core";
|
||||
import { useShallowEffect } from "@mantine/hooks";
|
||||
import { IconUserCircle } from "@tabler/icons-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useState } from "react";
|
||||
import { apiGetDataHome } from "../fun/get/api_home";
|
||||
import { Home_ComponentAvatarProfile } from "./comp_avatar_profile";
|
||||
import { listMenuHomeFooter } from "./list_menu_home";
|
||||
import { MainColor } from "@/app_modules/_global/color";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
|
||||
import { IconUser } from "@tabler/icons-react";
|
||||
import { IconUserCircle } from "@tabler/icons-react";
|
||||
|
||||
export default function FooterHome() {
|
||||
export default function FooterHome({ dataUser }: { dataUser: any | null }) {
|
||||
const router = useRouter();
|
||||
const [dataUser, setDataUser] = useState<any | null>(null);
|
||||
|
||||
useShallowEffect(() => {
|
||||
cekUserLogin();
|
||||
}, []);
|
||||
|
||||
async function cekUserLogin() {
|
||||
try {
|
||||
const response = await apiGetDataHome({
|
||||
path: "?cat=cek_profile",
|
||||
});
|
||||
if (response) {
|
||||
setDataUser(response.data);
|
||||
}
|
||||
} catch (error) {
|
||||
clientLogger.error("Error get data profile", error);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Box
|
||||
@@ -51,95 +30,81 @@ export default function FooterHome() {
|
||||
bottom={0}
|
||||
h={"9vh"}
|
||||
>
|
||||
{dataUser == null ? (
|
||||
<SimpleGrid cols={4}>
|
||||
{Array.from(new Array(4)).map((_, i) => (
|
||||
<Center h={"9vh"} key={i}>
|
||||
<Stack align="center">
|
||||
<CustomSkeleton radius={"lg"} height={40} w={40} />
|
||||
</Stack>
|
||||
</Center>
|
||||
))}
|
||||
</SimpleGrid>
|
||||
) : (
|
||||
<SimpleGrid cols={listMenuHomeFooter.length + 1}>
|
||||
{listMenuHomeFooter.map((e) => (
|
||||
<Center h={"9vh"} key={e.id}>
|
||||
<Stack
|
||||
align="center"
|
||||
spacing={0}
|
||||
onClick={() => {
|
||||
if (dataUser == null) {
|
||||
return null;
|
||||
} else if (Object.keys(dataUser).length === 0) {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
} else {
|
||||
if (e.link == "") {
|
||||
ComponentGlobal_NotifikasiPeringatan("Cooming Soon");
|
||||
} else {
|
||||
router.push(e.link, { scroll: false });
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
<ActionIcon
|
||||
radius={"xl"}
|
||||
c={e.link === "" ? "gray" : MainColor.white}
|
||||
variant="transparent"
|
||||
>
|
||||
{e.icon}
|
||||
</ActionIcon>
|
||||
<Text
|
||||
lineClamp={1}
|
||||
c={e.link === "" ? "gray" : MainColor.white}
|
||||
fz={12}
|
||||
>
|
||||
{e.name}
|
||||
</Text>
|
||||
</Stack>
|
||||
</Center>
|
||||
))}
|
||||
|
||||
<Center h={"9vh"}>
|
||||
<SimpleGrid cols={listMenuHomeFooter.length + 1}>
|
||||
{listMenuHomeFooter.map((e) => (
|
||||
<Center h={"9vh"} key={e.id}>
|
||||
<Stack
|
||||
align="center"
|
||||
spacing={2}
|
||||
spacing={0}
|
||||
onClick={() => {
|
||||
if (
|
||||
dataUser.profile === undefined ||
|
||||
dataUser?.profile === null
|
||||
) {
|
||||
if (!dataUser) {
|
||||
return null;
|
||||
} else if (dataUser.profile === undefined) {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
} else if (e.link == "") {
|
||||
ComponentGlobal_NotifikasiPeringatan("Cooming Soon");
|
||||
} else {
|
||||
router.push(e.link, { scroll: false });
|
||||
}
|
||||
}}
|
||||
>
|
||||
<ActionIcon
|
||||
radius={"xl"}
|
||||
c={e.link === "" ? "gray" : MainColor.white}
|
||||
variant="transparent"
|
||||
>
|
||||
{e.icon}
|
||||
</ActionIcon>
|
||||
<Text
|
||||
lineClamp={1}
|
||||
c={e.link === "" ? "gray" : MainColor.white}
|
||||
fz={12}
|
||||
>
|
||||
{e.name}
|
||||
</Text>
|
||||
</Stack>
|
||||
</Center>
|
||||
))}
|
||||
|
||||
<Center h={"9vh"}>
|
||||
<Stack align="center" spacing={2}>
|
||||
{!dataUser ? (
|
||||
<CustomSkeleton height={25} width={25} radius={"xl"} />
|
||||
) : dataUser.profile === undefined ? (
|
||||
<ActionIcon
|
||||
variant={"transparent"}
|
||||
onClick={() =>
|
||||
router.push(RouterProfile.create, { scroll: false })
|
||||
}
|
||||
>
|
||||
<IconUserCircle color="white" />
|
||||
</ActionIcon>
|
||||
) : (
|
||||
<ActionIcon
|
||||
variant={"transparent"}
|
||||
onClick={() => {
|
||||
router.push(
|
||||
RouterProfile.katalogOLD + `${dataUser?.profile}`,
|
||||
{
|
||||
scroll: false,
|
||||
}
|
||||
);
|
||||
}
|
||||
}}
|
||||
>
|
||||
<ActionIcon variant={"transparent"}>
|
||||
{dataUser.profile === undefined ||
|
||||
dataUser?.profile === null ? (
|
||||
<IconUserCircle color={MainColor.white} />
|
||||
) : (
|
||||
<Home_ComponentAvatarProfile
|
||||
url={APIs.GET({
|
||||
fileId: dataUser?.imageId as string,
|
||||
size: "50",
|
||||
})}
|
||||
/>
|
||||
)}
|
||||
}}
|
||||
>
|
||||
<Home_ComponentAvatarProfile
|
||||
url={APIs.GET({
|
||||
fileId: dataUser?.imageId as string,
|
||||
size: "50",
|
||||
})}
|
||||
/>
|
||||
</ActionIcon>
|
||||
<Text fz={10} c={MainColor.white}>
|
||||
Profile
|
||||
</Text>
|
||||
</Stack>
|
||||
</Center>
|
||||
</SimpleGrid>
|
||||
)}
|
||||
)}
|
||||
<Text fz={10} c={MainColor.white}>
|
||||
Profile
|
||||
</Text>
|
||||
</Stack>
|
||||
</Center>
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
"use client";
|
||||
import { API_RouteNotifikasi } from "@/app/lib/api_user_router/route_api_notifikasi";
|
||||
import { gs_count_ntf, gs_user_ntf } from "@/app/lib/global_state";
|
||||
import global_limit from "@/app/lib/limit";
|
||||
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
|
||||
import { RouterNotifikasi } from "@/app/lib/router_hipmi/router_notifikasi";
|
||||
import { RouterUserSearch } from "@/app/lib/router_hipmi/router_user_search";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
import { ActionIcon, Indicator, Text } from "@mantine/core";
|
||||
import { useShallowEffect } from "@mantine/hooks";
|
||||
import { IconBell, IconUserSearch } from "@tabler/icons-react";
|
||||
@@ -17,8 +19,6 @@ import { gs_notifikasi_kategori_app } from "../notifikasi/lib";
|
||||
import BodyHome from "./component/body_home";
|
||||
import FooterHome from "./component/footer_home";
|
||||
import { apiGetDataHome } from "./fun/get/api_home";
|
||||
import { clientLogger } from "@/util/clientLogger";
|
||||
import CustomSkeleton from "../components/CustomSkeleton";
|
||||
|
||||
export default function HomeViewNew() {
|
||||
const [countNtf, setCountNtf] = useAtom(gs_count_ntf);
|
||||
@@ -27,10 +27,6 @@ export default function HomeViewNew() {
|
||||
const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app);
|
||||
const router = useRouter();
|
||||
|
||||
useShallowEffect(() => {
|
||||
onLoadNotifikasi();
|
||||
}, []);
|
||||
|
||||
useShallowEffect(() => {
|
||||
if (countNtf != null) {
|
||||
setCountNtf(countNtf + newUserNtf);
|
||||
@@ -38,15 +34,32 @@ export default function HomeViewNew() {
|
||||
}
|
||||
}, [newUserNtf, countNtf]);
|
||||
|
||||
async function onLoadNotifikasi() {
|
||||
const loadNotif = await fetch(API_RouteNotifikasi.get_count_by_id());
|
||||
const data = await loadNotif.json().then((res) => res.data);
|
||||
setCountNtf(data);
|
||||
useShallowEffect(() => {
|
||||
hanlderLoadData();
|
||||
}, []);
|
||||
|
||||
async function hanlderLoadData() {
|
||||
try {
|
||||
const listLoadData = [
|
||||
global_limit(() => onLoadNotifikasi()),
|
||||
global_limit(() => cekUserLogin()),
|
||||
];
|
||||
|
||||
await Promise.all(listLoadData);
|
||||
} catch (error) {
|
||||
clientLogger.error("Error handler load data", error);
|
||||
}
|
||||
}
|
||||
|
||||
useShallowEffect(() => {
|
||||
cekUserLogin();
|
||||
}, []);
|
||||
async function onLoadNotifikasi() {
|
||||
try {
|
||||
const loadNotif = await fetch(API_RouteNotifikasi.get_count_by_id());
|
||||
const data = await loadNotif.json().then((res) => res.data);
|
||||
setCountNtf(data);
|
||||
} catch (error) {
|
||||
clientLogger.error("Error load notifikasi", error);
|
||||
}
|
||||
}
|
||||
|
||||
async function cekUserLogin() {
|
||||
try {
|
||||
@@ -68,22 +81,26 @@ export default function HomeViewNew() {
|
||||
<UIGlobal_LayoutHeaderTamplate
|
||||
title="HIPMI"
|
||||
customButtonLeft={
|
||||
dataUser == null ? (
|
||||
<CustomSkeleton width={20} height={20} circle />
|
||||
!dataUser && !countNtf ? (
|
||||
<ActionIcon radius={"xl"} variant={"transparent"}>
|
||||
<IconUserSearch color={MainColor.white} />
|
||||
</ActionIcon>
|
||||
) : dataUser.profile === undefined ? (
|
||||
<ActionIcon
|
||||
radius={"xl"}
|
||||
variant={"transparent"}
|
||||
onClick={() => {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
}}
|
||||
>
|
||||
<IconUserSearch color={MainColor.white} />
|
||||
</ActionIcon>
|
||||
) : (
|
||||
<ActionIcon
|
||||
radius={"xl"}
|
||||
disabled={countNtf == null}
|
||||
variant={"transparent"}
|
||||
onClick={() => {
|
||||
if (
|
||||
dataUser.profile != undefined ||
|
||||
dataUser?.profile != null
|
||||
) {
|
||||
router.push(RouterUserSearch.main, { scroll: false });
|
||||
} else {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
}
|
||||
router.push(RouterUserSearch.main, { scroll: false });
|
||||
}}
|
||||
>
|
||||
<IconUserSearch color={MainColor.white} />
|
||||
@@ -91,27 +108,32 @@ export default function HomeViewNew() {
|
||||
)
|
||||
}
|
||||
customButtonRight={
|
||||
dataUser == null ? (
|
||||
<CustomSkeleton width={20} height={20} circle />
|
||||
!dataUser && !countNtf ? (
|
||||
<ActionIcon radius={"xl"} variant={"transparent"}>
|
||||
<IconBell color={MainColor.white} />
|
||||
</ActionIcon>
|
||||
) : dataUser.profile === undefined ? (
|
||||
<ActionIcon
|
||||
radius={"xl"}
|
||||
variant={"transparent"}
|
||||
onClick={() => {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
}}
|
||||
>
|
||||
<IconBell color={MainColor.white} />
|
||||
</ActionIcon>
|
||||
) : (
|
||||
<ActionIcon
|
||||
variant="transparent"
|
||||
disabled={countNtf == null}
|
||||
onClick={() => {
|
||||
if (
|
||||
dataUser.profile != undefined ||
|
||||
dataUser?.profile != null
|
||||
) {
|
||||
setCategoryPage("Semua");
|
||||
router.push(
|
||||
RouterNotifikasi.categoryApp({ name: "semua" }),
|
||||
{
|
||||
scroll: false,
|
||||
}
|
||||
);
|
||||
} else {
|
||||
router.push(RouterProfile.create, { scroll: false });
|
||||
}
|
||||
setCategoryPage("Semua");
|
||||
router.push(
|
||||
RouterNotifikasi.categoryApp({ name: "semua" }),
|
||||
{
|
||||
scroll: false,
|
||||
}
|
||||
);
|
||||
}}
|
||||
>
|
||||
{countNtf != null && countNtf > 0 ? (
|
||||
@@ -134,9 +156,9 @@ export default function HomeViewNew() {
|
||||
}
|
||||
/>
|
||||
}
|
||||
footer={<FooterHome />}
|
||||
footer={<FooterHome dataUser={dataUser} />}
|
||||
>
|
||||
<BodyHome />
|
||||
<BodyHome dataUser={dataUser} />
|
||||
</UIGlobal_LayoutTamplate>
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user