From 2feb461c5b84b4f423d28fc3fce618428ffd2b98 Mon Sep 17 00:00:00 2001 From: Bagasbanuna02 Date: Mon, 20 Jan 2025 15:49:00 +0800 Subject: [PATCH] fix ( event ) deskripsi: - fix API detail dan pindah list peserta ke halaman beebeda --- src/app/api/event/[id]/route.ts | 50 ++++++ src/app/api/event/check-kehadiran/route.ts | 12 +- src/app/api/event/check-peserta/route.ts | 55 +++++-- .../dev/event/detail/kontribusi/[id]/page.tsx | 5 +- src/app/dev/event/detail/main/[id]/page.tsx | 8 +- .../dev/event/detail/riwayat/[id]/page.tsx | 1 - src/app/dev/event/konfirmasi/[id]/page.tsx | 9 +- src/app_modules/event/_lib/api_event.ts | 41 +++++ src/app_modules/event/_ui/konfirmasi.tsx | 26 ++- .../detail/comp_box_daftar_peserta.tsx | 20 ++- .../component/detail/comp_box_sponsor.tsx | 8 +- .../event/component/detail/detail_main.tsx | 76 ++++++--- .../event/detail/kontribusi/index.tsx | 7 +- .../event/detail/main_detail/index.tsx | 155 ++++++++---------- .../event/detail/riwayat/index.tsx | 8 +- 15 files changed, 313 insertions(+), 168 deletions(-) create mode 100644 src/app/api/event/[id]/route.ts create mode 100644 src/app_modules/event/_lib/api_event.ts diff --git a/src/app/api/event/[id]/route.ts b/src/app/api/event/[id]/route.ts new file mode 100644 index 00000000..4ad7728f --- /dev/null +++ b/src/app/api/event/[id]/route.ts @@ -0,0 +1,50 @@ +import { prisma } from "@/app/lib"; +import { NextResponse } from "next/server"; + +export async function GET( + request: Request, + context: { params: { id: string } } +) { + const method = request.method; + if (method !== "GET") { + return NextResponse.json( + { success: false, message: "Method not allowed" }, + { status: 405 } + ); + } + + try { + let fixData; + const { id } = context.params; + + fixData = await prisma.event.findUnique({ + where: { + id: id, + }, + include: { + Author: { + include: { + Profile: true, + }, + }, + EventMaster_TipeAcara: true, + EventMaster_Status: true, + }, + }); + + await prisma.$disconnect(); + + return NextResponse.json({ + success: true, + message: "Berhasil mendapatkan data", + data: fixData, + }); + } catch (error) { + await prisma.$disconnect(); + + return NextResponse.json( + { success: false, message: "Gagal mendapatkan data" }, + { status: 500 } + ); + } +} diff --git a/src/app/api/event/check-kehadiran/route.ts b/src/app/api/event/check-kehadiran/route.ts index 083f6e05..b0ecbf78 100644 --- a/src/app/api/event/check-kehadiran/route.ts +++ b/src/app/api/event/check-kehadiran/route.ts @@ -1,8 +1,16 @@ import { event_funCheckKehadiran } from "@/app_modules/event/fun"; import { NextResponse } from "next/server"; -export async function GET(req: Request) { - const { searchParams } = new URL(req.url); +export async function GET(request: Request) { + const method = request.method; + if (method !== "GET") { + return NextResponse.json( + { success: false, message: "Method not allowed" }, + { status: 405 } + ); + } + + const { searchParams } = new URL(request.url); const userId = searchParams.get("userId"); const eventId = searchParams.get("eventId"); diff --git a/src/app/api/event/check-peserta/route.ts b/src/app/api/event/check-peserta/route.ts index 49b863e2..57abe1a4 100644 --- a/src/app/api/event/check-peserta/route.ts +++ b/src/app/api/event/check-peserta/route.ts @@ -1,15 +1,50 @@ -import { event_funCheckPesertaByUserId } from "@/app_modules/event/fun"; +import { prisma } from "@/app/lib"; +import backendLogger from "@/util/backendLogger"; import { NextResponse } from "next/server"; -export async function GET(req: Request) { - const { searchParams } = new URL(req.url); - const userId = searchParams.get("userId"); - const eventId = searchParams.get("eventId"); +export async function GET(request: Request) { + const method = request.method; + if (method !== "GET") { + return NextResponse.json( + { success: false, message: "Method not allowed" }, + { status: 405 } + ); + } - const res = await event_funCheckPesertaByUserId({ - eventId: eventId as string, - userId: userId as string, - }); + try { + let fixData; + const { searchParams } = new URL(request.url); + const userId = searchParams.get("userId"); + const eventId = searchParams.get("eventId"); - return NextResponse.json(res, { status: 200 }); + const check = await prisma.event_Peserta.findFirst({ + where: { + userId: userId, + eventId: eventId, + }, + }); + + if (check) { + fixData = true; + } else { + fixData = false; + } + + await prisma.$disconnect(); + return NextResponse.json( + { success: true, message: "Success get data", data: fixData }, + { status: 200 } + ); + } catch (error) { + await prisma.$disconnect(); + backendLogger.error("Error get data detail event:", error); + return NextResponse.json( + { + success: false, + message: "Gagal mendapatkan data", + reason: (error as Error).message, + }, + { status: 500 } + ); + } } diff --git a/src/app/dev/event/detail/kontribusi/[id]/page.tsx b/src/app/dev/event/detail/kontribusi/[id]/page.tsx index 508e14ae..9a3f6028 100644 --- a/src/app/dev/event/detail/kontribusi/[id]/page.tsx +++ b/src/app/dev/event/detail/kontribusi/[id]/page.tsx @@ -5,13 +5,12 @@ import { event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id"; export default async function Page({ params }: { params: { id: string } }) { let eventId = params.id; - const dataEvent = await event_getOneById(eventId); - const listKontributor = await Event_getListPesertaById(eventId); + // const dataEvent = await event_getOneById(eventId); + // const listKontributor = await Event_getListPesertaById(eventId); const totalPeserta = await Event_countTotalPesertaById(eventId) return ( <> diff --git a/src/app/dev/event/detail/main/[id]/page.tsx b/src/app/dev/event/detail/main/[id]/page.tsx index 62fca07e..2550c407 100644 --- a/src/app/dev/event/detail/main/[id]/page.tsx +++ b/src/app/dev/event/detail/main/[id]/page.tsx @@ -2,17 +2,15 @@ import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; import { Event_DetailMain } from "@/app_modules/event"; import { Event_countTotalPesertaById } from "@/app_modules/event/fun/count/count_total_peserta_by_id"; -export default async function Page({ params }: { params: { id: string } }) { - let eventId = params.id; +export default async function Page() { const userLoginId = await funGetUserIdByToken(); - const totalPeserta = await Event_countTotalPesertaById(eventId); + // const totalPeserta = await Event_countTotalPesertaById(eventId); return ( <> ); diff --git a/src/app/dev/event/detail/riwayat/[id]/page.tsx b/src/app/dev/event/detail/riwayat/[id]/page.tsx index a6715a97..e0259a97 100644 --- a/src/app/dev/event/detail/riwayat/[id]/page.tsx +++ b/src/app/dev/event/detail/riwayat/[id]/page.tsx @@ -9,7 +9,6 @@ export default async function Page({ params }: { params: { id: string } }) { <> ); diff --git a/src/app/dev/event/konfirmasi/[id]/page.tsx b/src/app/dev/event/konfirmasi/[id]/page.tsx index 7d8b033a..da648c02 100644 --- a/src/app/dev/event/konfirmasi/[id]/page.tsx +++ b/src/app/dev/event/konfirmasi/[id]/page.tsx @@ -1,17 +1,12 @@ import { funGetUserIdByToken } from "@/app_modules/_global/fun/get"; import Ui_Konfirmasi from "@/app_modules/event/_ui/konfirmasi"; -export default async function Page({ - params, -}: { - params: Promise<{ id: string }>; -}) { - const eventId = (await params).id; +export default async function Page() { const userLoginId = await funGetUserIdByToken(); return ( <> - + ); } diff --git a/src/app_modules/event/_lib/api_event.ts b/src/app_modules/event/_lib/api_event.ts new file mode 100644 index 00000000..4e072e7c --- /dev/null +++ b/src/app_modules/event/_lib/api_event.ts @@ -0,0 +1,41 @@ +export const apiGetEventDetailById = async ({ id }: { id: string }) => { + const { token } = await fetch("/api/get-cookie").then((res) => res.json()); + if (!token) return await token.json().catch(() => null); + + const response = await fetch(`/api/event/${id}`, { + headers: { + "Content-Type": "application/json", + Accept: "application/json", + "Access-Control-Allow-Origin": "*", + Authorization: `Bearer ${token}`, + }, + }); + + return await response.json().catch(() => null); +}; + +export const apiGetEventCekPeserta = async ({ + userId, + eventId, +}: { + userId: string; + eventId: string; +}) => { + const { token } = await fetch("/api/get-cookie").then((res) => res.json()); + if (!token) return await token.json().catch(() => null); + + const response = await fetch( + `/api/event/check-peserta?userId=${userId}&eventId=${eventId}`, + { + headers: { + "Content-Type": "application/json", + Accept: "application/json", + "Access-Control-Allow-Origin": "*", + Authorization: `Bearer ${token}`, + }, + } + ); + + return await response.json().catch(() => null); + +}; diff --git a/src/app_modules/event/_ui/konfirmasi.tsx b/src/app_modules/event/_ui/konfirmasi.tsx index ecaa99df..801e92e8 100644 --- a/src/app_modules/event/_ui/konfirmasi.tsx +++ b/src/app_modules/event/_ui/konfirmasi.tsx @@ -13,7 +13,7 @@ import { Button, Center, Group, Skeleton, Stack, Text } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { useAtom } from "jotai"; import moment from "moment"; -import { useRouter } from "next/navigation"; +import { useParams, useRouter } from "next/navigation"; import { useState } from "react"; import { event_funUpdateKehadiran } from "../fun"; import { Event_funJoinAndConfirmEvent } from "../fun/create/fun_join_and_confirm"; @@ -21,31 +21,41 @@ import { gs_event_hotMenu } from "../global_state"; import { MODEL_EVENT } from "../model/interface"; import { Event_funJoinEvent } from "../fun/create/fun_join_event"; import "moment/locale/id"; +import { apiGetEventDetailById } from "../_lib/api_event"; +import { clientLogger } from "@/util/clientLogger"; export default function Ui_Konfirmasi({ userLoginId, - eventId, }: { userLoginId: string; - eventId: string; }) { // console.log(dataEvent); + const params = useParams<{ id: string }>(); + const eventId = params.id; + const router = useRouter(); const [data, setData] = useState(null); const [isJoin, setIsJoin] = useState(null); const [isPresent, setIsPresent] = useState(null); + // Load Data useShallowEffect(() => { onLoadData(); }, []); async function onLoadData() { - const data = await fetch( - API_RouteEvent.get_one_by_id({ eventId: eventId }) - ); - const res = await data.json(); - setData(res.data); + try { + const respone = await apiGetEventDetailById({ + id: eventId, + }); + + if (respone) { + setData(respone.data); + } + } catch (error) { + clientLogger.error("Error get data detail event", error); + } } // CEK PESERTA diff --git a/src/app_modules/event/component/detail/comp_box_daftar_peserta.tsx b/src/app_modules/event/component/detail/comp_box_daftar_peserta.tsx index df9cb765..a3751990 100644 --- a/src/app_modules/event/component/detail/comp_box_daftar_peserta.tsx +++ b/src/app_modules/event/component/detail/comp_box_daftar_peserta.tsx @@ -1,12 +1,12 @@ -import { RouterEvent } from '@/app/lib/router_hipmi/router_event'; -import { AccentColor, MainColor } from '@/app_modules/_global/color'; -import { ActionIcon, Flex, Paper, Text, Loader } from '@mantine/core'; -import { IconUser } from '@tabler/icons-react'; -import { useParams, useRouter } from 'next/navigation'; -import React, { useState } from 'react'; +import { RouterEvent } from "@/app/lib/router_hipmi/router_event"; +import { AccentColor, MainColor } from "@/app_modules/_global/color"; +import { ActionIcon, Flex, Loader, Paper, Text } from "@mantine/core"; +import { IconUsersGroup } from "@tabler/icons-react"; +import { useParams, useRouter } from "next/navigation"; +import { useState } from "react"; function Event_ComponentBoxDaftarPeserta({ eventId }: { eventId?: string }) { - const params = useParams<{ id: string }>() + const params = useParams<{ id: string }>(); const router = useRouter(); const [isLoading, setLoading] = useState(false); return ( @@ -28,12 +28,14 @@ function Event_ComponentBoxDaftarPeserta({ eventId }: { eventId?: string }) { }} > - Daftar Peserta + + Daftar Peserta + {isLoading ? ( ) : ( - + )} diff --git a/src/app_modules/event/component/detail/comp_box_sponsor.tsx b/src/app_modules/event/component/detail/comp_box_sponsor.tsx index 937a5f02..9505d1f6 100644 --- a/src/app_modules/event/component/detail/comp_box_sponsor.tsx +++ b/src/app_modules/event/component/detail/comp_box_sponsor.tsx @@ -1,9 +1,9 @@ import { RouterEvent } from '@/app/lib/router_hipmi/router_event'; import { AccentColor, MainColor } from '@/app_modules/_global/color'; import { ActionIcon, Flex, Loader, Paper, Text } from '@mantine/core'; +import { IconStar } from '@tabler/icons-react'; import { useParams, useRouter } from 'next/navigation'; import { useState } from 'react'; -import { TfiCup } from "react-icons/tfi"; function Event_ComponentBoxDaftarSponsor() { const router = useRouter(); @@ -28,12 +28,14 @@ function Event_ComponentBoxDaftarSponsor() { }} > - Daftar Sponsor + + Daftar Sponsor + {isLoading ? ( ) : ( - + )} diff --git a/src/app_modules/event/component/detail/detail_main.tsx b/src/app_modules/event/component/detail/detail_main.tsx index e0f53bd7..f4ecad10 100644 --- a/src/app_modules/event/component/detail/detail_main.tsx +++ b/src/app_modules/event/component/detail/detail_main.tsx @@ -1,26 +1,32 @@ "use client"; +import { MainColor } from "@/app_modules/_global/color"; import { ComponentGlobal_AvatarAndUsername, ComponentGlobal_CardStyles, } from "@/app_modules/_global/component"; -import { Center, Grid, SimpleGrid, Skeleton, Stack, Text, Title } from "@mantine/core"; -import { MODEL_EVENT } from "../../model/interface"; +import { clientLogger } from "@/util/clientLogger"; +import { + Grid, + SimpleGrid, + Stack, + Text, + Title +} from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; -import { useState } from "react"; -import { API_RouteEvent } from "@/app/lib/api_user_router/route_api_event"; -import { Event_ComponentSkeletonDetail } from "../skeleton/comp_skeleton_detail"; import moment from "moment"; import "moment/locale/id"; -import { MainColor } from "@/app_modules/_global/color"; +import { useParams } from "next/navigation"; +import { useState } from "react"; +import { apiGetEventDetailById } from "../../_lib/api_event"; +import { MODEL_EVENT } from "../../model/interface"; +import { Event_ComponentSkeletonDetail } from "../skeleton/comp_skeleton_detail"; import Event_ComponentBoxDaftarPeserta from "./comp_box_daftar_peserta"; import Event_ComponentBoxDaftarSponsor from "./comp_box_sponsor"; -export default function ComponentEvent_DetailMainData({ - eventId, -}: { - eventId: string; -}) { +export default function ComponentEvent_DetailMainData() { + const params = useParams<{ id: string }>(); + const eventId = params.id as string; const [data, setData] = useState(null); useShallowEffect(() => { @@ -28,11 +34,17 @@ export default function ComponentEvent_DetailMainData({ }, []); async function onLoadData() { - const data = await fetch( - API_RouteEvent.get_one_by_id({ eventId: eventId }) - ); - const res = await data.json(); - setData(res.data); + try { + const respone = await apiGetEventDetailById({ + id: eventId, + }); + + if (respone) { + setData(respone.data); + } + } catch (error) { + clientLogger.error("Error get data detail event", error); + } } return ( @@ -52,7 +64,9 @@ export default function ComponentEvent_DetailMainData({ - Lokasi + + Lokasi + : @@ -61,19 +75,27 @@ export default function ComponentEvent_DetailMainData({ - Tipe Acara + + Tipe Acara + : - {data ? data.EventMaster_TipeAcara.name : null} + + {data ? data.EventMaster_TipeAcara.name : null} + - Tanggal & Waktu + + Tanggal & Waktu + - Mulai + + Mulai + : @@ -88,7 +110,9 @@ export default function ComponentEvent_DetailMainData({ - Selesai + + Selesai + : @@ -104,7 +128,9 @@ export default function ComponentEvent_DetailMainData({ - Deskripsi + + Deskripsi + {data ? data?.deskripsi : null} - - + + diff --git a/src/app_modules/event/detail/kontribusi/index.tsx b/src/app_modules/event/detail/kontribusi/index.tsx index 6d667ad1..1af8c761 100644 --- a/src/app_modules/event/detail/kontribusi/index.tsx +++ b/src/app_modules/event/detail/kontribusi/index.tsx @@ -3,18 +3,19 @@ import { Stack } from "@mantine/core"; import ComponentEvent_DetailMainData from "../../component/detail/detail_main"; import ComponentEvent_ListPeserta from "../../component/detail/list_peserta"; +import { useParams } from "next/navigation"; export default function Event_DetailKontribusi({ - eventId, totalPeserta, }: { - eventId: string; totalPeserta: number; }) { + const params = useParams<{id: string}>() + const eventId = params.id return ( <> - + diff --git a/src/app_modules/event/detail/main_detail/index.tsx b/src/app_modules/event/detail/main_detail/index.tsx index 48060303..9bef481e 100644 --- a/src/app_modules/event/detail/main_detail/index.tsx +++ b/src/app_modules/event/detail/main_detail/index.tsx @@ -1,55 +1,101 @@ "use client"; -import { API_RouteEvent } from "@/app/lib/api_user_router/route_api_event"; import { IRealtimeData } from "@/app/lib/global_state"; +import { AccentColor, MainColor } from "@/app_modules/_global/color"; import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/_global/notif_global/notifikasi_berhasil"; import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/_global/notif_global/notifikasi_gagal"; import CustomSkeleton from "@/app_modules/components/CustomSkeleton"; import notifikasiToUser_funCreate from "@/app_modules/notifikasi/fun/create/create_notif_to_user"; +import { clientLogger } from "@/util/clientLogger"; import { Button, Stack } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; +import { useParams } from "next/navigation"; import { useState } from "react"; import { WibuRealtime } from "wibu-pkg"; +import { apiGetEventCekPeserta } from "../../_lib/api_event"; import ComponentEvent_DetailMainData from "../../component/detail/detail_main"; -import ComponentEvent_ListPeserta from "../../component/detail/list_peserta"; -import { Event_countTotalPesertaById } from "../../fun/count/count_total_peserta_by_id"; import { Event_funJoinEvent } from "../../fun/create/fun_join_event"; -import { Event_getListPesertaById } from "../../fun/get/get_list_peserta_by_id"; -import { AccentColor, MainColor } from "@/app_modules/_global/color"; -import { clientLogger } from "@/util/clientLogger"; export default function Event_DetailMain({ userLoginId, - totalPeserta, - eventId, }: { userLoginId: string; - totalPeserta: number; - eventId: string; }) { - const [total, setTotal] = useState(totalPeserta); + const params = useParams<{ id: string }>(); + const eventId = params.id; const [isLoading, setLoading] = useState(false); const [isJoinSuccess, setIsJoinSuccess] = useState(null); - const [isNewPeserta, setIsNewPeserta] = useState(null); + // const [isNewPeserta, setIsNewPeserta] = useState(null); useShallowEffect(() => { onCheckPeserta(); }, []); async function onCheckPeserta() { - const res = await fetch( - API_RouteEvent.check_peserta({ eventId: eventId, userId: userLoginId }) - ); - const data = await res.json(); - setIsJoinSuccess(data); + try { + const respone = await apiGetEventCekPeserta({ + userId: userLoginId, + eventId: eventId, + }); + + if (respone) { + setIsJoinSuccess(respone.data); + } + } catch (error) { + clientLogger.error("Error check peserta", error); + } + } + + // [ON JOIN BUTTON] + async function onJoin() { + const body = { + userId: userLoginId, + eventId: eventId, + }; + + try { + setLoading(true); + const res = await Event_funJoinEvent(body as any); + if (res.status === 200) { + if (userLoginId !== res.data?.Event?.authorId) { + const dataNotifikasi: IRealtimeData = { + appId: res?.data?.Event?.id as any, + status: "Peserta Event" as any, + userId: res.data?.Event?.authorId as any, + pesan: res.data?.Event?.title as any, + kategoriApp: "EVENT", + title: "Peserta baru event anda !", + }; + + const createNotifikasi = await notifikasiToUser_funCreate({ + data: dataNotifikasi as any, + }); + + if (createNotifikasi.status === 201) { + WibuRealtime.setData({ + type: "notification", + pushNotificationTo: "USER", + dataMessage: dataNotifikasi, + }); + } + } + setIsJoinSuccess(true); + setLoading(false); + ComponentGlobal_NotifikasiBerhasil(res.message, 2000); + } else { + setLoading(false); + ComponentGlobal_NotifikasiGagal(res.message); + } + } catch (error) { + setLoading(false); + clientLogger.error("Error join event", error); + } } return ( <> - + {isJoinSuccess == null ? ( @@ -65,14 +111,7 @@ export default function Event_DetailMain({ radius={"xl"} c={AccentColor.white} onClick={() => { - onJoin( - userLoginId, - eventId, - setTotal, - setLoading, - setIsJoinSuccess, - setIsNewPeserta - ); + onJoin(); }} > JOIN @@ -88,63 +127,3 @@ export default function Event_DetailMain({ ); } - -async function onJoin( - userId: string, - eventId: string, - setTotal: any, - setLoading: any, - setIsJoinSuccess: (val: boolean | null) => void, - setIsNewPeserta: any - -) { - const body = { - userId: userId, - eventId: eventId, - }; - - const userLoginId = userId; - - try { - setLoading(true); - const res = await Event_funJoinEvent(body as any); - if (res.status === 200) { - const resPeserta = await Event_getListPesertaById(eventId); - setIsNewPeserta(true); - - const resTotal = await Event_countTotalPesertaById(eventId); - setTotal(resTotal); - - if (userLoginId !== res.data?.Event?.authorId) { - const dataNotifikasi: IRealtimeData = { - appId: res?.data?.Event?.id as any, - status: "Peserta Event" as any, - userId: res.data?.Event?.authorId as any, - pesan: res.data?.Event?.title as any, - kategoriApp: "EVENT", - title: "Peserta baru event anda !", - }; - - const createNotifikasi = await notifikasiToUser_funCreate({ - data: dataNotifikasi as any, - }); - - if (createNotifikasi.status === 201) { - WibuRealtime.setData({ - type: "notification", - pushNotificationTo: "USER", - dataMessage: dataNotifikasi, - }); - } - } - setIsJoinSuccess(true); - ComponentGlobal_NotifikasiBerhasil(res.message, 2000); - } else { - setLoading(false); - ComponentGlobal_NotifikasiGagal(res.message); - } - } catch (error) { - setLoading(false); - clientLogger.error("Error join event", error); - } -} diff --git a/src/app_modules/event/detail/riwayat/index.tsx b/src/app_modules/event/detail/riwayat/index.tsx index 774eced6..4c201c9b 100644 --- a/src/app_modules/event/detail/riwayat/index.tsx +++ b/src/app_modules/event/detail/riwayat/index.tsx @@ -1,25 +1,25 @@ "use client"; import { Stack } from "@mantine/core"; -import { useRouter } from "next/navigation"; +import { useParams, useRouter } from "next/navigation"; import { useState } from "react"; import ComponentEvent_DetailMainData from "../../component/detail/detail_main"; import ComponentEvent_ListPeserta from "../../component/detail/list_peserta"; export default function Event_DetailRiwayat({ totalPeserta, - eventId, }: { totalPeserta: number; - eventId: string; }) { + const params = useParams<{ id: string }>(); + const eventId = params.id; const router = useRouter(); const [total, setTotal] = useState(totalPeserta); return ( <> - +