From 5dbecae360f7f3dab580bceb0ac6f8d4aa049f41 Mon Sep 17 00:00:00 2001 From: Bagasbanuna02 Date: Wed, 8 Jan 2025 15:18:33 +0800 Subject: [PATCH 1/3] fix (upload image) deskripsi: - upload image di portofolio --- src/app/api/image/delete/route.ts | 2 - src/app/dev/katalog/[id]/layout.tsx | 20 +- src/app/dev/portofolio/main/[id]/layout.tsx | 16 +- src/app/lib/id-derectory.ts | 4 +- .../fun/delete/fun_delete_file_by_id.tsx | 24 +- .../home/component/footer_home.tsx | 146 +++++++----- src/app_modules/home/view_home_new.tsx | 113 +++++---- src/app_modules/katalog/main/layout_new.tsx | 125 +++++----- .../button/comp_button_edit_logo_bisnis.tsx | 65 +++-- .../component/button_delete_new.tsx | 4 +- .../portofolio/component/button_more_new.tsx | 224 ++++++++++-------- .../portofolio/edit/logo/ui_edit_logo.tsx | 1 + .../katalog/portofolio/ui/ui_layout_new.tsx | 36 +-- .../comp_button_update_photo_profile.tsx | 11 +- src/app_modules/katalog/profile/edit/view.tsx | 36 +-- .../button/comp_button_update_data_map.tsx | 85 +++++-- src/app_modules/map/ui/ui_custom_pin.tsx | 73 ++++-- 17 files changed, 557 insertions(+), 428 deletions(-) diff --git a/src/app/api/image/delete/route.ts b/src/app/api/image/delete/route.ts index dcf3f89b..42d360e3 100644 --- a/src/app/api/image/delete/route.ts +++ b/src/app/api/image/delete/route.ts @@ -4,8 +4,6 @@ import { NextResponse } from "next/server"; export async function DELETE(req: Request) { const data = await req.json(); - - console.log("data request =>", data); const id = data.fileId; const dirId = data.dirId; diff --git a/src/app/dev/katalog/[id]/layout.tsx b/src/app/dev/katalog/[id]/layout.tsx index 98b718f6..79911004 100644 --- a/src/app/dev/katalog/[id]/layout.tsx +++ b/src/app/dev/katalog/[id]/layout.tsx @@ -1,24 +1,12 @@ +import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; import { LayoutKatalogNew } from "@/app_modules/katalog/main"; -export default async function Layout({ children, params, }: { children: any; params: { id: string } }) { - // const profileId = params.id; - // const dataProfile = await Profile_getOneProfileAndUserById(profileId); - // const authorId = dataProfile?.userId; - - // const userLoginId = await funGetUserIdByToken(); - // const userRoleId = dataProfile?.User?.masterUserRoleId; +export default async function Layout({ children }: { children: any }) { + const userLoginId = await funGetUserIdByToken(); return ( <> - {/* - {children} - */} - {children} + {children} ); } diff --git a/src/app/dev/portofolio/main/[id]/layout.tsx b/src/app/dev/portofolio/main/[id]/layout.tsx index 1be53c84..b6c68e76 100644 --- a/src/app/dev/portofolio/main/[id]/layout.tsx +++ b/src/app/dev/portofolio/main/[id]/layout.tsx @@ -1,20 +1,14 @@ +import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; import { PortofolioLayoutNew } from "@/app_modules/katalog/portofolio"; -export default async function Layout({ children, params, }: { children: any; params: { id: string }; }) { - // let portoId = params.id; - // const getPorto = await portofolio_getOneById(portoId); - // const userLoginId = await funGetUserIdByToken(); +export default async function Layout({ children, }: { children: any; }) { + const userLoginId = await funGetUserIdByToken(); return ( <> - {/* + {children} - */} - {children} + ); } diff --git a/src/app/lib/id-derectory.ts b/src/app/lib/id-derectory.ts index dc430470..f2c1303f 100644 --- a/src/app/lib/id-derectory.ts +++ b/src/app/lib/id-derectory.ts @@ -1,6 +1,6 @@ const DIRECTORY_ID = { - profile_foto: "cm0x93rgo000jbp5tj8baoaus", - profile_background: "cm0x93ze8000lbp5t1a8uc9wl", + profile_foto: "cm5ni43ub001pxpug0qw4p11e", + profile_background: "cm5ni4hnq001l12p9gpagxgtv", portofolio_logo: "cm0yjl6ug000310njwmk6j0tx", map_pin: "cm0yjq8up000710njv5klra32", map_image: "cm0yjqnxl000910njplqho07w", diff --git a/src/app_modules/_global/fun/delete/fun_delete_file_by_id.tsx b/src/app_modules/_global/fun/delete/fun_delete_file_by_id.tsx index cb3d48be..27e9c8a0 100644 --- a/src/app_modules/_global/fun/delete/fun_delete_file_by_id.tsx +++ b/src/app_modules/_global/fun/delete/fun_delete_file_by_id.tsx @@ -22,29 +22,7 @@ export async function funGlobal_DeleteFileById({ return { success: false, message: data.message }; } } catch (error) { - console.error("Upload error:", error); + clientLogger.error("Upload error:", error); return { success: false, message: "An unexpected error occurred" }; } - // try { - // const res = await fetch( - // `https://wibu-storage.wibudev.com/api/files/${fileId}/delete`, - // { - // method: "DELETE", - // headers: { - // Authorization: `Bearer ${process.env.WS_APIKEY}`, - // }, - // } - // ); - - // if (res.ok) { - // const hasil = await res.json(); - // return { success: true, message: "File berhasil dihapus" }; - // } else { - // const errorText = await res.json(); - // return { success: false, message: errorText.message }; - // } - // } catch (error) { - // console.error("Upload error:", error); - // return { success: false, message: "An unexpected error occurred" }; - // } } diff --git a/src/app_modules/home/component/footer_home.tsx b/src/app_modules/home/component/footer_home.tsx index de65b7db..696acbd4 100644 --- a/src/app_modules/home/component/footer_home.tsx +++ b/src/app_modules/home/component/footer_home.tsx @@ -18,10 +18,11 @@ 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"; export default function FooterHome() { const router = useRouter(); - const [dataUser, setDataUser] = useState({}); + const [dataUser, setDataUser] = useState(null); useShallowEffect(() => { cekUserLogin(); @@ -36,7 +37,7 @@ export default function FooterHome() { setDataUser(response.data); } } catch (error) { - clientLogger.error("Error get data profile",error); + clientLogger.error("Error get data profile", error); } } @@ -50,84 +51,101 @@ export default function FooterHome() { bottom={0} h={"9vh"} > - - {listMenuHomeFooter.map((e) => ( -
+ {dataUser?.profile === undefined || dataUser?.profile === null ? ( + + {Array.from(new Array(4)).map((_, i) => ( +
+ + + +
+ ))} +
+ ) : ( + + {listMenuHomeFooter.map((e) => ( +
+ { + if ( + dataUser.profile === undefined || + dataUser?.profile === null + ) { + return null; + } else if ( + dataUser.profile === undefined || + dataUser?.profile === null + ) { + router.push(RouterProfile.create, { scroll: false }); + } else { + if (e.link == "") { + ComponentGlobal_NotifikasiPeringatan("Cooming Soon"); + } else { + router.push(e.link, { scroll: false }); + } + } + }} + > + + {e.icon} + + + {e.name} + + +
+ ))} + +
{ if ( dataUser.profile === undefined || dataUser?.profile === null - ) { - return null; - } else if ( - dataUser.profile === undefined || - dataUser?.profile === null ) { router.push(RouterProfile.create, { scroll: false }); } else { - if (e.link == "") { - ComponentGlobal_NotifikasiPeringatan("Cooming Soon"); - } else { - router.push(e.link, { scroll: false }); - } + router.push( + RouterProfile.katalogOLD + `${dataUser?.profile}`, + { + scroll: false, + } + ); } }} > - - {e.icon} + + {dataUser.profile === undefined || + dataUser?.profile === null ? ( + + ) : ( + + )} - - {e.name} + + Profile
- ))} - -
- { - if ( - dataUser.profile === undefined || - dataUser?.profile === null - ) { - router.push(RouterProfile.create, { scroll: false }); - } else { - router.push(RouterProfile.katalogOLD + `${dataUser?.profile}`, { - scroll: false, - }); - } - }} - > - - {dataUser.profile === undefined || dataUser?.profile === null ? ( - - ) : ( - - )} - - - Profile - - -
-
+ + )} ); } diff --git a/src/app_modules/home/view_home_new.tsx b/src/app_modules/home/view_home_new.tsx index b2dd7fda..c632663a 100644 --- a/src/app_modules/home/view_home_new.tsx +++ b/src/app_modules/home/view_home_new.tsx @@ -18,11 +18,12 @@ 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); const [newUserNtf, setNewUserNtf] = useAtom(gs_user_ntf); - const [dataUser, setDataUser] = useState({}); + const [dataUser, setDataUser] = useState(null); const [categoryPage, setCategoryPage] = useAtom(gs_notifikasi_kategori_app); const router = useRouter(); @@ -67,61 +68,69 @@ export default function HomeViewNew() { { - if ( - dataUser.profile != undefined || - dataUser?.profile != null - ) { - router.push(RouterUserSearch.main, { scroll: false }); - } else { - router.push(RouterProfile.create, { scroll: false }); - } - }} - > - - + dataUser?.profile == null ? ( + + ) : ( + { + if ( + dataUser.profile != undefined || + dataUser?.profile != null + ) { + router.push(RouterUserSearch.main, { scroll: false }); + } else { + router.push(RouterProfile.create, { scroll: false }); + } + }} + > + + + ) } customButtonRight={ - { - if ( - dataUser.profile != undefined || - dataUser?.profile != null - ) { - setCategoryPage("Semua"); - router.push( - RouterNotifikasi.categoryApp({ name: "semua" }), - { - scroll: false, - } - ); - } else { - router.push(RouterProfile.create, { scroll: false }); - } - }} - > - {countNtf != null && countNtf > 0 ? ( - - {countNtf > 99 ? "99+" : countNtf} - + dataUser?.profile == null ? ( + + ) : ( + { + if ( + dataUser.profile != undefined || + dataUser?.profile != null + ) { + setCategoryPage("Semua"); + router.push( + RouterNotifikasi.categoryApp({ name: "semua" }), + { + scroll: false, + } + ); + } else { + router.push(RouterProfile.create, { scroll: false }); } - > + }} + > + {countNtf != null && countNtf > 0 ? ( + + {countNtf > 99 ? "99+" : countNtf} + + } + > + + + ) : ( - - ) : ( - - )} - + )} + + ) } /> } diff --git a/src/app_modules/katalog/main/layout_new.tsx b/src/app_modules/katalog/main/layout_new.tsx index e96ae293..5fe1b898 100644 --- a/src/app_modules/katalog/main/layout_new.tsx +++ b/src/app_modules/katalog/main/layout_new.tsx @@ -1,66 +1,85 @@ -'use client' +"use client"; import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; -import { UIGlobal_LayoutHeaderTamplate, UIGlobal_LayoutTamplate } from "@/app_modules/_global/ui"; +import { + UIGlobal_LayoutHeaderTamplate, + UIGlobal_LayoutTamplate, +} from "@/app_modules/_global/ui"; import { apiGetUserProfile } from "@/app_modules/user"; -import { ActionIcon } from "@mantine/core"; +import { ActionIcon, Skeleton } from "@mantine/core"; import { useDisclosure, useShallowEffect } from "@mantine/hooks"; import { IconDotsVertical } from "@tabler/icons-react"; import { useParams } from "next/navigation"; import { useState } from "react"; import DrawerKatalogNew from "../component/drawer_katalog_new"; +import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; -export default function LayoutKatalogNew({ children }: { children: any }) { - const param = useParams<{ id: string }>() - const [authorId, setAuthorId] = useState("") - const [userRoleId, setUserRoleId] = useState("") - const [userLoginId, setUserLoginId] = useState("") - const [opened, { open, close }] = useDisclosure() - const [loading, setLoading] = useState(true); +export default function LayoutKatalogNew({ + children, + userLoginId, +}: { + children: any; + userLoginId: string; +}) { + const param = useParams<{ id: string }>(); + const [authorId, setAuthorId] = useState(""); + const [userRoleId, setUserRoleId] = useState(""); + const [opened, { open, close }] = useDisclosure(); + const [loading, setLoading] = useState(true); - async function getProfile() { - try { - setLoading(true) - const response = await apiGetUserProfile(`?profile=${param.id}`) - const response2 = await funGetUserIdByToken() - if (response) { - setAuthorId(response.data.id) - setUserRoleId(response.data.masterUserRoleId) - setUserLoginId(response2) - } - } catch (error) { - console.error(error); - } finally { - setLoading(false) + async function getProfile() { + try { + setLoading(true); + const response = await apiGetUserProfile(`?profile=${param.id}`); + + if (response) { + setAuthorId(response.data.id); + setUserRoleId(response.data.masterUserRoleId); } - } + } catch (error) { + console.error(error); + } finally { + setLoading(false); + } + } - useShallowEffect(() => { - getProfile() - }, []) + useShallowEffect(() => { + getProfile(); + }, []); - return ( - <> - : - authorId == userLoginId ? ( - open()}> - - - ) : ( - - ) - } - /> + return ( + <> + + + + ) : authorId == userLoginId ? ( + open()} + > + + + ) : ( + + ) } - > - {children} - close()} userRoleId={userRoleId} userId={userLoginId} /> - - - ) -} \ No newline at end of file + /> + } + > + {children} + close()} + userRoleId={userRoleId} + userId={userLoginId} + /> + + + ); +} diff --git a/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx b/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx index a5600ad7..c6c85b60 100644 --- a/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx +++ b/src/app_modules/katalog/portofolio/component/button/comp_button_edit_logo_bisnis.tsx @@ -10,46 +10,73 @@ import { Button } from "@mantine/core"; import { useRouter } from "next/navigation"; import { useState } from "react"; -import { funGlobal_UploadToStorage } from "@/app_modules/_global/fun"; +import { + funGlobal_DeleteFileById, + funGlobal_UploadToStorage, +} from "@/app_modules/_global/fun"; import { DIRECTORY_ID } from "@/app/lib"; import { portofolio_funEditLogoBisnisById } from "../../fun"; +import { clientLogger } from "@/util/clientLogger"; export function ComponentPortofolio_ButtonEditLogoBisnis({ file, portofolioId, + fileRemoveId, }: { file: File; portofolioId: string; + fileRemoveId: string; }) { const router = useRouter(); const [loading, setLoading] = useState(false); async function onUpdate() { - const uploadFileToStorage = await funGlobal_UploadToStorage({ - file: file, - dirId: DIRECTORY_ID.portofolio_logo, - }); - - if (!uploadFileToStorage.success) - return ComponentGlobal_NotifikasiPeringatan("Gagal upload gambar"); - - const res = await portofolio_funEditLogoBisnisById({ - portofolioId: portofolioId, - logoId: uploadFileToStorage.data.id, - }); - if (res.status === 200) { + try { setLoading(true); - ComponentGlobal_NotifikasiBerhasil(res.message); - router.back(); - } else { - ComponentGlobal_NotifikasiGagal(res.message); + + const deleteLogo = await funGlobal_DeleteFileById({ + fileId: fileRemoveId, + dirId: DIRECTORY_ID.portofolio_logo, + }); + + if (!deleteLogo.success) { + setLoading(false); + clientLogger.error("Error delete logo", deleteLogo.message); + } + + const uploadFileToStorage = await funGlobal_UploadToStorage({ + file: file, + dirId: DIRECTORY_ID.portofolio_logo, + }); + + if (!uploadFileToStorage.success) { + setLoading(false); + ComponentGlobal_NotifikasiPeringatan("Gagal upload gambar"); + return; + } + const res = await portofolio_funEditLogoBisnisById({ + portofolioId: portofolioId, + logoId: uploadFileToStorage.data.id, + }); + + if (res.status === 200) { + ComponentGlobal_NotifikasiBerhasil(res.message); + router.back(); + } else { + setLoading(false); + ComponentGlobal_NotifikasiGagal(res.message); + } + } catch (error) { + setLoading(false); + clientLogger.error("Error update logo", error); } } + return ( <> {file ? (