wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: User search & Event

Browse Source 
Deskripsi:
- Tampilan avatar dan username
## NO Issue
This commit is contained in:
Bagasbanuna02
2024-09-30 11:01:17 +08:00
parent b13110be6f
commit ca5c30499a
80 changed files with 1764 additions and 918 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -87,6 +87,7 @@
"typescript": "5.1.6",
"utf-8-validate": "^6.0.3",
"uuid": "^9.0.1",
"wibu": "bipproduction/wibu",
"wibu-realtime": "bipproduction/wibu-realtime",
"yaml": "^2.3.2"
}

33
src/app/contoh/page.tsx
View File

@@ -1,17 +1,48 @@
"use client";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_LoaderAvatar,
} from "@/app_modules/_global/component";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import {
UIGlobal_LayoutHeaderTamplate,
UIGlobal_LayoutTamplate,
} from "@/app_modules/_global/ui";
import {
ActionIcon,
Avatar,
Box,
Center,
Group,
Image,
Loader,
Paper,
Text,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconDots } from "@tabler/icons-react";
import { useState } from "react";
export default function Page() {
return (
<>
<UIGlobal_LayoutTamplate
header={<UIGlobal_LayoutHeaderTamplate title="Contoh" />}
>
<Paper p={"sm"}>
<ComponentGlobal_AvatarAndUsername
profile={{ id: "1" as any, name: "wibu" as any }}
component={
<Group position="right">
<Text lineClamp={1}>{Intl.DateTimeFormat("id-ID", {dateStyle: "full"}).format(new Date())}</Text>
</Group>
}
/>
</Paper>
</UIGlobal_LayoutTamplate>
</>
);
return (
<>
<Box p={"lg"} bg={"gray"} h={"100vh"}>

11
src/app/dev/(user)/image-preview/[id]/page.tsx Normal file
View File

@@ -0,0 +1,11 @@
import { UIGlobal_ImagePreview } from "@/app_modules/_global/ui";
export default async function Page({ params }: { params: { id: string } }) {
const fileId = params.id;
return (
<>
<UIGlobal_ImagePreview fileId={fileId} />
</>
);
}

4
src/app/dev/event/detail/draft/[id]/page.tsx
View File

@@ -1,8 +1,8 @@
import { Event_DetailDraft } from "@/app_modules/event"
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id"
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 dataEvent = await event_getOneById(eventId)
return <Event_DetailDraft dataEvent={dataEvent as any} />
}

4
src/app/dev/event/detail/kontribusi/[id]/page.tsx
View File

@@ -1,11 +1,11 @@
import { Event_DetailKontribusi } from "@/app_modules/event";
import { Event_countTotalPesertaById } from "@/app_modules/event/fun/count/count_total_peserta_by_id";
import { Event_getListPesertaById } from "@/app_modules/event/fun/get/get_list_peserta_by_id";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
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 dataEvent = await event_getOneById(eventId);
const listKontributor = await Event_getListPesertaById(eventId);
const totalPeserta = await Event_countTotalPesertaById(eventId)
return (

4
src/app/dev/event/detail/main/[id]/page.tsx
View File

@@ -3,13 +3,13 @@ import { Event_DetailMain } from "@/app_modules/event";
import { Event_countTotalPesertaById } from "@/app_modules/event/fun/count/count_total_peserta_by_id";
import { Event_CekUserJoinById } from "@/app_modules/event/fun/get/cek_user_join_by_id";
import { Event_getListPesertaById } from "@/app_modules/event/fun/get/get_list_peserta_by_id";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
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 userLoginId = await funGetUserIdByToken();
const dataEvent = await Event_getOneById(eventId);
const dataEvent = await event_getOneById(eventId);
const listPeserta = await Event_getListPesertaById(eventId);
const isJoin = await Event_CekUserJoinById(eventId, userLoginId);
const totalPeserta = await Event_countTotalPesertaById(eventId);

4
src/app/dev/event/detail/publish/[id]/page.tsx
View File

@@ -1,11 +1,11 @@
import { Event_DetailPublish } from "@/app_modules/event";
import { Event_countTotalPesertaById } from "@/app_modules/event/fun/count/count_total_peserta_by_id";
import { Event_getListPesertaById } from "@/app_modules/event/fun/get/get_list_peserta_by_id";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
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 dataEvent = await event_getOneById(eventId);
const listPeserta = await Event_getListPesertaById(eventId);
const totalPeserta = await Event_countTotalPesertaById(eventId);

4
src/app/dev/event/detail/reject/[id]/page.tsx
View File

@@ -1,9 +1,9 @@
import { Event_DetailReject } from "@/app_modules/event";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
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 dataEvent = await event_getOneById(eventId)
return <Event_DetailReject dataEvent={dataEvent as any}/>;
}

4
src/app/dev/event/detail/review/[id]/page.tsx
View File

@@ -1,10 +1,10 @@
import { Event_DetailReview } from "@/app_modules/event";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
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 dataEvent = await event_getOneById(eventId)
return <Event_DetailReview dataEvent={dataEvent as any}/>;
}

4
src/app/dev/event/detail/riwayat/[id]/page.tsx
View File

@@ -2,11 +2,11 @@
import { Event_DetailRiwayat } from "@/app_modules/event";
import { Event_countTotalPesertaById } from "@/app_modules/event/fun/count/count_total_peserta_by_id";
import { Event_getListPesertaById } from "@/app_modules/event/fun/get/get_list_peserta_by_id";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
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 dataEvent = await event_getOneById(eventId);
const listPeserta = await Event_getListPesertaById(eventId);
const totalPeserta = await Event_countTotalPesertaById(eventId);

4
src/app/dev/event/edit/[id]/page.tsx
View File

@@ -1,12 +1,12 @@
import { Event_Edit } from "@/app_modules/event";
import { Event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
import { event_getOneById } from "@/app_modules/event/fun/get/get_one_by_id";
import { Event_getMasterTipeAcara } from "@/app_modules/event/fun/master/get_tipe_acara";
import { MODEL_EVENT } from "@/app_modules/event/model/interface";
import _ from "lodash";
export default async function Page({ params }: { params: { id: string } }) {
let eventId = params.id;
const data = await Event_getOneById(eventId);
const data = await event_getOneById(eventId);
const dataEvent = _.omit(data, [
"Author",
"EventMaster_Status",

2
src/app/dev/event/main/beranda/page.tsx
View File

@@ -2,7 +2,7 @@ import { Event_Beranda } from "@/app_modules/event";
import { event_getListAllPublish } from "@/app_modules/event/fun/get/get_list_all_publish";
export default async function Page() {
const dataEvent = await event_getListAllPublish({page: 1});
const dataEvent = await event_getListAllPublish({ page: 1 });
return (
<>

1
src/app/dev/map/main/page.tsx
View File

@@ -1,4 +1,3 @@
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import { map_funGetAllMap } from "@/app_modules/map/fun/get/fun_get_all_map";
import { Map_View } from "@/app_modules/map/view";

2
src/app/lib/index.ts
View File

@@ -1,7 +1,9 @@
import APIs from "./APIs";
import DIRECTORY_ID from "./id-derectory";
import prisma from "./prisma";
import { pathAssetImage } from "./path_asset_image";
export { DIRECTORY_ID };
export { prisma };
export { APIs };
export { pathAssetImage as RouterAssetImage };

6
src/app/lib/path_asset_image.tsx Normal file
View File

@@ -0,0 +1,6 @@
export const pathAssetImage = {
no_image: "/aset/global/no-image.svg",
avatar: "/aset/global/avatar.png",
main_background: "/aset/global/main_background.png",
new_loader: "/aset/global/loading.gif",
};

3
src/app/lib/router_hipmi/router_image_preview.ts Normal file
View File

@@ -0,0 +1,3 @@
export const routerImagePreview = {
"main": ({ id }: { id: string }) => `/dev/image-preview/${id}`,
};

3
src/app/lib/router_hipmi/router_katalog.ts
View File

@@ -1,5 +1,6 @@
export const RouterProfile = {
katalog: "/dev/katalog/",
katalogOLD: "/dev/katalog/",
"katalog": ({id}:{id: string}) => `/dev/katalog/${id}`,
// create
create: "/dev/profile/create",

5
src/app/makuro/_ui/RealtimePage.tsx
View File

@@ -18,7 +18,10 @@ export function RealtimePage({ token }: { token: string }) {
function onKirim() {
setData({
id: "123",
data: Math.random().toString(),
data: {
"topic":"test",
}
});
}
return (

2
src/app_modules/_global/author_name_on_header.tsx
View File

@@ -43,7 +43,7 @@ export default function ComponentGlobal_AuthorNameAndAvatar({
onClick={() => {
if (profileId) {
setVisible(true);
router.push(RouterProfile.katalog + profileId);
router.push(RouterProfile.katalogOLD + profileId);
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}

2
src/app_modules/_global/component/comp_author_name_and_avatar.tsx
View File

@@ -38,7 +38,7 @@ export default function ComponentGlobal_AvatarAndAuthorName({
onClick={() => {
if (dataUser?.Profile?.id) {
setVisible(true);
router.push(RouterProfile.katalog + dataUser?.Profile?.id);
router.push(RouterProfile.katalogOLD + dataUser?.Profile?.id);
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}

81
src/app_modules/_global/component/comp_avatar_and_username.tsx Normal file
View File

@@ -0,0 +1,81 @@
"use client";
import { ActionIcon, Avatar, Grid, Stack, Text } from "@mantine/core";
import { Prisma } from "@prisma/client";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { ComponentGlobal_LoaderAvatar } from "./comp_load_avatar";
import ComponentGlobal_Loader from "./loader";
import { funGlobal_CheckProfile } from "../fun/get";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import { ComponentGlobal_NotifikasiPeringatan } from "../notif_global";
type IFontSize = "xs" | "sm" | "md" | "lg" | "xl"
export function ComponentGlobal_AvatarAndUsername({
profile,
component,
sizeAvatar,
fontSize
}: {
profile: Prisma.ProfileSelect;
component?: React.ReactNode;
sizeAvatar?: number;
fontSize?: IFontSize | {}
}) {
const router = useRouter();
const [visible, setVisible] = useState(false);
async function onCheckProfile() {
const res = await funGlobal_CheckProfile({ profileId: profile.id as any });
if (res !== null) {
setVisible(true);
router.push(RouterProfile.katalog({ id: profile.id as any }));
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}
}
return (
<>
<Grid align="flex-start" justify="space-around">
<Grid.Col span={"content"} style={{ minHeight: 50 }}>
<ActionIcon
radius={"xl"}
variant="transparent"
onClick={() => onCheckProfile()}
>
{visible ? (
<Avatar radius={"xl"} size={40}>
<ComponentGlobal_Loader />
</Avatar>
) : (
<ComponentGlobal_LoaderAvatar
fileId={profile.imageId as any}
sizeAvatar={sizeAvatar}
/>
)}
</ActionIcon>
</Grid.Col>
<Grid.Col span={"auto"} style={{ minHeight: 50 }} >
<Stack justify="center" h={30}>
<Text
fw={"bold"}
fz={fontSize ? fontSize : "md"}
lineClamp={1}
onClick={() => onCheckProfile()}
>
{profile?.name}
</Text>
</Stack>
</Grid.Col>
{component && (
<Grid.Col span={"auto"} style={{ minHeight: 50 }}>
{component}
</Grid.Col>
)}
</Grid>
</>
);
}

4
src/app_modules/_global/component/comp_box_upload_image.tsx
View File

@@ -5,12 +5,12 @@ import { Box } from "@mantine/core";
*
* @param children
* @tutorial |
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"} >
* <AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"} >
<Image
style={{ maxHeight: 250 }}
alt="Avatar"
src={image ? image : APIs.GET({ fileId: profile.imageId as any })}/>
</AspectRatio>
* </AspectRatio>
* @returns folllow like this
*/
export function ComponentGlobal_BoxUploadImage({

4
src/app_modules/_global/component/comp_card_box_and_background.tsx
View File

@@ -27,8 +27,8 @@ export function ComponentGlobal_CardStyles({
? backgroundColor
: AccentColor.darkblue,
border: `2px solid ${border ? border : AccentColor.blue}`,
paddingInline: "15px",
paddingBlock: "15px",
paddingInline: "16px",
paddingBlock: "20px",
borderRadius: "10px",
color: color ? color : "white",
height: height ? height : "auto",

69
src/app_modules/_global/component/comp_load_avatar.tsx Normal file
View File

@@ -0,0 +1,69 @@
"use client";
import { Avatar, Skeleton } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useState } from "react";
import ComponentGlobal_Loader from "./loader";
import { APIs } from "@/app/lib";
export function ComponentGlobal_LoaderAvatar({
fileId,
imageSize,
sizeAvatar,
}: {
fileId: string;
imageSize?: string;
sizeAvatar?: number;
}) {
const [isImage, setIsImage] = useState<boolean | null>(null);
const url = APIs.GET({ fileId: fileId, size: imageSize });
useShallowEffect(() => {
onLoadImage();
}, []);
async function onLoadImage() {
const res = await fetch(url);
try {
if (res.ok) {
return setIsImage(true);
}
setIsImage(false);
} catch (error) {
console.log(error);
}
}
return (
<>
{isImage === null ? (
// <Avatar size={sizeAvatar ? sizeAvatar : 40} radius={"100%"}>
// <ComponentGlobal_Loader />
// </Avatar>
<Avatar
size={sizeAvatar ? sizeAvatar : 40}
radius={"100%"}
style={{
borderColor: "white",
borderStyle: "solid",
borderWidth: "1px",
}}
>
<ComponentGlobal_Loader />
</Avatar>
) : (
<Avatar
size={sizeAvatar ? sizeAvatar : 40}
radius={"100%"}
src={isImage ? url : "/aset/global/avatar.png"}
style={{
borderColor: "white",
borderStyle: "solid",
borderWidth: "1px",
}}
/>
)}
</>
);
}

69
src/app_modules/_global/component/comp_load_image.tsx
View File

@@ -1,23 +1,31 @@
"use client";
import { AspectRatio, Box, Center, Image } from "@mantine/core";
import { AspectRatio, Box, Center, Image, Skeleton } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useState } from "react";
import ComponentGlobal_Loader from "./loader";
import { useRouter } from "next/navigation";
import { APIs } from "@/app/lib";
import { routerImagePreview } from "@/app/lib/router_hipmi/router_image_preview";
import { pathAssetImage } from "@/app/lib/path_asset_image";
type IRadius = "xs" | "sm" | "md" | "lg" | "xl";
export function ComponentGlobal_LoadImage({
url,
fileId,
maw,
h,
radius,
}: {
url: string;
fileId: string;
maw?: number | string;
h?: number;
radius?: IRadius;
}) {
const router = useRouter();
const [isImage, setIsImage] = useState<boolean | null>(null);
const [isLoading, setIsLoading] = useState(false);
const url = APIs.GET({ fileId: fileId });
useShallowEffect(() => {
onLoadImage();
@@ -37,40 +45,55 @@ export function ComponentGlobal_LoadImage({
if (isImage === null)
return (
<Center h={250}>
<ComponentGlobal_Loader variant="dots" size={50} />
// <Center h={250}>
// <ComponentGlobal_Loader variant="dots" size={50} />
// </Center>
<Center>
<Skeleton h={250} radius={"sm"} w={200} />
</Center>
);
if (!isImage)
return (
<>
<Center h={250} >
<Image
alt="No Image"
maw={150}
m={"auto"}
p={"xs"}
src={"/aset/global/no-image.svg"}
/>
<Center h={250}>
<Image alt="No Image" maw={150} src={pathAssetImage.no_image} />
</Center>
</>
);
return (
<>
<Box h={h ? h : 250}>
<Center h={"100%"}>
<Center h={"100%"}>
<Image
onClick={() => {
setIsLoading(true);
router.push(routerImagePreview.main({ id: fileId }), {
scroll: false,
});
}}
opacity={isLoading ? 0.5 : 1}
radius={radius ? radius : 0}
alt="Image"
maw={maw ? maw : 200}
miw={200}
src={url}
/>
{isLoading ? (
<Image
radius={radius ? radius : 0}
alt="Image"
maw={maw ? maw : 200}
m={"auto"}
p={"xs"}
src={url}
alt="Loader"
src={pathAssetImage.new_loader}
height={50}
width={50}
style={{
position: "absolute",
}}
/>
</Center>
</Box>
) : (
""
)}
</Center>
</>
);
}

5
src/app_modules/_global/component/comp_loading_card.tsx
View File

@@ -1,4 +1,5 @@
import { Overlay, Center, Loader } from "@mantine/core";
import { MainColor } from "../color";
export default function ComponentGlobal_CardLoadingOverlay({
size,
@@ -13,8 +14,8 @@ export default function ComponentGlobal_CardLoadingOverlay({
<Center h={"100%"}>
<Loader
variant={variant ? variant : "dots"}
size={size ? size : 20}
color="white"
size={size ? size : 40}
color={MainColor.yellow}
/>
</Center>
</Overlay>

4
src/app_modules/_global/component/index.ts
View File

@@ -1,8 +1,10 @@
import { ComponentGlobal_ButtonUploadFileImage } from "../button/comp_button_upload_photo";
import ComponentGlobal_BoxInformation from "./box_information";
import ComponentGlobal_AvatarAndAuthorName from "./comp_author_name_and_avatar";
import { ComponentGlobal_AvatarAndUsername } from "./comp_avatar_and_username";
import { ComponentGlobal_BoxUploadImage } from "./comp_box_upload_image";
import { ComponentGlobal_CardStyles } from "./comp_card_box_and_background";
import { ComponentGlobal_LoaderAvatar } from "./comp_load_avatar";
import { ComponentGlobal_LoadImage } from "./comp_load_image";
import ComponentGlobal_CardLoadingOverlay from "./comp_loading_card";
import ComponentGlobal_TampilanAngkaRatusan from "./comp_tampilan_angka_ratusan";
@@ -21,3 +23,5 @@ export { ComponentGlobal_BoxUploadImage };
export { ComponentGlobal_LoadImage };
export { ComponentGlobal_ErrorInput };
export { ComponentGlobal_ButtonUploadFileImage };
export { ComponentGlobal_LoaderAvatar };
export { ComponentGlobal_AvatarAndUsername };

17
src/app_modules/_global/fun/get/fun_check_profile.tsx Normal file
View File

@@ -0,0 +1,17 @@
"use server";
import { prisma } from "@/app/lib";
export async function funGlobal_CheckProfile({
profileId,
}: {
profileId: string;
}) {
const res = await prisma.profile.findUnique({
where: {
id: profileId,
},
});
return res;
}

2
src/app_modules/_global/fun/get/index.ts
View File

@@ -1,4 +1,5 @@
import { funCheckToken } from "./fun_cek_token";
import { funGlobal_CheckProfile } from "./fun_check_profile";
import { funGlobal_getNomorAdmin } from "./fun_get_nomor_admin";
import { funGetUserIdByToken } from "./fun_get_user_id_by_token";
import { funGlobal_getMasterKategoriApp } from "./fun_master_kategori_app";
@@ -7,3 +8,4 @@ export { funGlobal_getMasterKategoriApp };
export { funGlobal_getNomorAdmin };
export { funCheckToken };
export { funGetUserIdByToken };
export { funGlobal_CheckProfile };

2
src/app_modules/_global/ui/index.ts
View File

@@ -1,5 +1,6 @@
import UIGlobal_Drawer from "./ui_drawer";
import UIGlobal_LayoutHeaderTamplate from "./ui_header_tamplate";
import { UIGlobal_ImagePreview } from "./ui_image_preview";
import UIGlobal_LayoutTamplate from "./ui_layout_tamplate";
import UIGlobal_Modal from "./ui_modal";
import UIGlobal_SplashScreen from "./ui_splash";
@@ -9,3 +10,4 @@ export { UIGlobal_LayoutHeaderTamplate };
export { UIGlobal_Drawer };
export { UIGlobal_Modal };
export { UIGlobal_SplashScreen };
export { UIGlobal_ImagePreview };

2
src/app_modules/_global/ui/ui_drawer.tsx
View File

@@ -1,3 +1,5 @@
"use client"
import {
ActionIcon,
Drawer,

4
src/app_modules/_global/ui/ui_header_tamplate.tsx
View File

@@ -26,6 +26,7 @@ export default function UIGlobal_LayoutHeaderTamplate({
iconRight,
routerRight,
customButtonRight,
backgroundColor,
}: {
title: string;
posotion?: any;
@@ -38,6 +39,7 @@ export default function UIGlobal_LayoutHeaderTamplate({
iconRight?: any;
routerRight?: any;
customButtonRight?: React.ReactNode;
backgroundColor?: string;
}) {
const router = useRouter();
const [isLoading, setIsLoading] = useState(false);
@@ -52,7 +54,7 @@ export default function UIGlobal_LayoutHeaderTamplate({
// borderBottom: `1px solid ${AccentColor.blue}`,
borderStyle: "none",
}}
bg={MainColor.darkblue}
bg={backgroundColor ? backgroundColor : MainColor.darkblue}
>
<Group h={"100%"} position={posotion ? posotion : "apart"} px={"md"}>
{hideButtonLeft ? (

109
src/app_modules/_global/ui/ui_image_preview.tsx Normal file
View File

@@ -0,0 +1,109 @@
"use client";
import { APIs } from "@/app/lib";
import { pathAssetImage } from "@/app/lib/path_asset_image";
import {
ActionIcon,
Box,
Center,
Container,
Image,
rem,
Skeleton,
Text,
Title,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconX } from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MainColor } from "../color";
import UIGlobal_LayoutHeaderTamplate from "./ui_header_tamplate";
import { UIHeader } from "./ui_layout_tamplate";
export function UIGlobal_ImagePreview({ fileId }: { fileId: string }) {
const router = useRouter();
const [isImage, setIsImage] = useState<boolean | null>(null);
const url = APIs.GET({ fileId: fileId });
useShallowEffect(() => {
onLoadImage();
}, []);
async function onLoadImage() {
const res = await fetch(url);
try {
if (res.ok) {
return setIsImage(true);
}
setIsImage(false);
} catch (error) {
console.log(error);
}
}
return (
<>
<Box
w={"100%"}
h={"100%"}
style={{
overflowY: "auto",
overflowX: "auto",
backgroundColor: MainColor.black,
position: "fixed",
}}
>
<Container mih={"100vh"} p={0} size={rem(500)} bg={MainColor.darkblue}>
<UIHeader
header={
<UIGlobal_LayoutHeaderTamplate
title="Preview Image"
hideButtonLeft
customButtonRight={
<ActionIcon
onClick={() => router.back()}
variant="transparent"
>
<IconX color={MainColor.yellow} />
</ActionIcon>
}
/>
}
/>
<Box style={{ zIndex: 0 }} h={"92vh"} pos={"static"} px={"lg"}>
{isImage === null ? (
<Skeleton height={200} radius={"sm"} />
) : isImage ? (
<Center>
<Image alt="Image" src={url} maw={400} miw={200} />
</Center>
) : (
<Box
bg={"gray"}
style={{
borderColor: "white",
borderStyle: "solid",
borderWidth: "0.5px",
borderRadius: "5px",
height: 300,
}}
>
<Center h={"100%"}>
<Image
alt="Image"
height={100}
width={100}
src={pathAssetImage.no_image}
/>
</Center>
</Box>
)}
</Box>
</Container>
</Box>
</>
);
}

17
src/app_modules/_global/ui/ui_layout_tamplate.tsx
View File

@@ -32,7 +32,7 @@ export default function UIGlobal_LayoutTamplate({
position: "fixed",
}}
>
<Container mih={"100vh"} p={0} size={rem(500)} bg={MainColor.darkblue} >
<Container mih={"100vh"} p={0} size={rem(500)} bg={MainColor.darkblue}>
<BackgroundImage
src={"/aset/global/main_background.png"}
h={"100vh"}
@@ -50,7 +50,7 @@ export default function UIGlobal_LayoutTamplate({
);
}
function UIHeader({ header }: { header: React.ReactNode }) {
export function UIHeader({ header }: { header: React.ReactNode }) {
return (
<>
{header ? (
@@ -72,7 +72,7 @@ function UIHeader({ header }: { header: React.ReactNode }) {
);
}
function UIChildren({
export function UIChildren({
children,
footer,
}: {
@@ -95,8 +95,11 @@ function UIFooter({ footer }: { footer: React.ReactNode }) {
<>
{footer ? (
<Box
// w dihilangkan kalau relative
w={"100%"}
style={{
position: "relative",
// position: "relative",
position: "fixed",
bottom: 0,
height: "10vh",
zIndex: 10,
@@ -104,16 +107,20 @@ function UIFooter({ footer }: { footer: React.ReactNode }) {
borderTop: `2px solid ${AccentColor.blue}`,
borderRight: `1px solid ${AccentColor.blue}`,
borderLeft: `1px solid ${AccentColor.blue}`,
// maxWidth dihilangkan kalau relative
maxWidth: rem(500),
}}
bg={AccentColor.darkblue}
>
<Box
h={"100%"}
// maw dihilangkan kalau relative
maw={rem(500)}
style={{
borderRadius: "20px 20px 0px 0px",
width: "100%",
}}
pos={"absolute"}
// pos={"absolute"}
>
{footer}
</Box>

2
src/app_modules/_global/ui/ui_modal.tsx
View File

@@ -1,3 +1,5 @@
"use client";
import { Modal, Stack, Title, Group, Button, Box } from "@mantine/core";
import { MainColor, AccentColor } from "../color/color_pallet";

2
src/app_modules/admin/vote/component/detail_hasil.tsx
View File

@@ -72,7 +72,7 @@ export default function ComponentAdminVote_DetailHasil({
span={2}
onClick={() =>
router.push(
RouterProfile.katalog + e?.Author?.Profile?.id
RouterProfile.katalogOLD + e?.Author?.Profile?.id
)
}
>

2
src/app_modules/colab/component/card_view/card_section_header_author_name.tsx
View File

@@ -47,7 +47,7 @@ export default function ComponentColab_CardSectionHeaderAuthorName({
span={"content"}
onClick={() => {
if (profileId) {
router.push(RouterProfile.katalog + profileId);
router.push(RouterProfile.katalogOLD + profileId);
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}

2
src/app_modules/colab/component/detail/header_author_list_partisipan.tsx
View File

@@ -95,7 +95,7 @@ export default function ComponentColab_AuthorNameOnListPartisipan({
span={"content"}
onClick={() => {
if (author?.Profile.id) {
router.push(RouterProfile.katalog + author?.Profile.id);
router.push(RouterProfile.katalogOLD + author?.Profile.id);
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}

2
src/app_modules/colab/component/header_author_name.tsx
View File

@@ -30,7 +30,7 @@ export default function ComponentColab_AuthorNameOnHeader({
span={"content"}
onClick={() => {
if (profileId) {
router.push(RouterProfile.katalog + profileId);
router.push(RouterProfile.katalogOLD + profileId);
} else {
ComponentGlobal_NotifikasiPeringatan("Id tidak ditemukan");
}

26
src/app_modules/event/component/box_list_status.tsx
View File

@@ -1,7 +1,10 @@
"use client";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
import {
ComponentGlobal_CardLoadingOverlay,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { Card, Group, Stack, Text, Title } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
@@ -20,27 +23,20 @@ export default function ComponentEvent_BoxListStatus({
return (
<>
<Card
style={{
padding: "15px",
backgroundColor: AccentColor.darkblue,
borderRadius: "10px",
border: `2px solid ${AccentColor.blue}`,
color: "white",
marginBottom: "15px",
}}
onClick={() => {
<ComponentGlobal_CardStyles
marginBottom={"15px"}
onClickHandler={() => {
setEventId(data?.id);
setVisible(true);
router.push(path + data.id);
}}
>
<Stack>
<Group w={"100%"} position="apart">
<Title order={5} lineClamp={1} w={"70%"}>
<Group w={"100%"} position="apart" grow>
<Title order={5} lineClamp={1}>
{data.title}
</Title>
<Text align="right" fz={"sm"} lineClamp={1} w={"20%"}>
<Text align="right" fz={"sm"} lineClamp={1}>
{new Intl.DateTimeFormat("id-ID", {
dateStyle: "medium",
}).format(data.tanggal)}
@@ -56,7 +52,7 @@ export default function ComponentEvent_BoxListStatus({
) : (
""
)}
</Card>
</ComponentGlobal_CardStyles>
</>
);
}

69
src/app_modules/event/component/card_view/card_beranda.tsx
View File

@@ -1,8 +1,10 @@
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
import { Card, Group, Stack, Text, Title } from "@mantine/core";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardLoadingOverlay,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { Box, Group, Stack, Text, Title } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
@@ -13,38 +15,26 @@ export function ComponentEvent_CardBeranda({ data }: { data: any }) {
return (
<>
<Card
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
borderRadius: "10px",
marginBottom: "20px",
padding: "15px",
}}
>
<Card.Section px={"sm"} pt={"sm"}>
<ComponentGlobal_AuthorNameOnHeader
profileId={data.Author?.Profile?.id}
imagesId={data.Author?.Profile?.imagesId}
authorName={data.Author?.Profile?.name}
isPembatas={true}
<ComponentGlobal_CardStyles marginBottom={"15px"}>
<Stack>
<ComponentGlobal_AvatarAndUsername
profile={data?.Author?.Profile as any}
/>
</Card.Section>
<Card.Section
p={"sm"}
onClick={() => {
setEventId(data?.id);
setVisible(true);
router.push(RouterEvent.detail_main + data?.id);
}}
>
<Stack>
<Group w={"100%"} position="apart">
<Title order={5} lineClamp={1} w={"70%"}>
<Stack
spacing={5}
// p={"md"}
onClick={() => {
setEventId(data?.id);
setVisible(true);
router.push(RouterEvent.detail_main + data?.id);
}}
>
<Group w={"100%"} position="apart" grow>
<Title order={5} lineClamp={1}>
{data.title}
</Title>
<Text align="right" fz={"sm"} lineClamp={1} w={"20%"}>
<Text align="right" fz={"sm"} lineClamp={1}>
{new Intl.DateTimeFormat("id-ID", {
dateStyle: "medium",
}).format(data.tanggal)}
@@ -55,13 +45,12 @@ export function ComponentEvent_CardBeranda({ data }: { data: any }) {
{data.deskripsi}
</Text>
</Stack>
</Card.Section>
{visible && data?.id === eventId ? (
<ComponentGlobal_CardLoadingOverlay />
) : (
""
)}
</Card>
{visible && data?.id === eventId && (
<ComponentGlobal_CardLoadingOverlay />
)}
</Stack>
</ComponentGlobal_CardStyles>
</>
);
}

158
src/app_modules/event/component/card_view/card_kontributor.tsx
View File

@@ -1,78 +1,96 @@
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
import { Avatar, Box, Card, Grid, Group, Stack, Text, Title } from "@mantine/core";
import moment from "moment";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardLoadingOverlay,
ComponentGlobal_CardStyles,
ComponentGlobal_LoaderAvatar,
} from "@/app_modules/_global/component";
import {
Box,
Card,
Group,
Stack,
Title
} from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MODEL_EVENT_PESERTA } from "../../model/interface";
export function ComponentEvent_CardKontributor({data}: {data: MODEL_EVENT_PESERTA}) {
const router = useRouter();
const [eventId, setEventId] = useState("");
const [visible, setVisible] = useState(false);
return (
<>
<Card
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
borderRadius: "10px",
marginBottom: "20px",
padding: "15px",
export function ComponentEvent_CardKontributor({
data,
}: {
data: MODEL_EVENT_PESERTA;
}) {
const router = useRouter();
const [eventId, setEventId] = useState("");
const [visible, setVisible] = useState(false);
return (
<>
<ComponentGlobal_CardStyles marginBottom={"16px"}>
<Card.Section px={"md"} pt={"sm"}>
<ComponentGlobal_AvatarAndUsername
profile={data?.Event.Author.Profile as any}
/>
{/* <ComponentGlobal_AuthorNameOnHeader
profileId={data?.Event.Author.Profile.id}
imagesId={data?.Event.Author.Profile.imagesId}
authorName={data?.Event.Author.Profile.name}
isPembatas
/> */}
</Card.Section>
<Card.Section
p={"sm"}
pt={"lg"}
onClick={() => {
setEventId(data?.id), setVisible(true);
router.push(RouterEvent.detail_kontribusi + data.Event.id);
}}
>
<Card.Section px={"sm"} pt={"sm"}>
<ComponentGlobal_AuthorNameOnHeader
profileId={data?.Event.Author.Profile.id}
imagesId={data?.Event.Author.Profile.imagesId}
authorName={data?.Event.Author.Profile.name}
isPembatas
/>
</Card.Section>
<Card.Section
p={"sm"}
onClick={() => {
setEventId(data?.id), setVisible(true);
router.push(RouterEvent.detail_kontribusi + data.Event.id);
}}
>
<Stack>
<Title align="center" order={5} lineClamp={1}>
{data?.Event.title}
</Title>
<Stack>
<Title align="center" order={4} lineClamp={1}>
{data?.Event.title}
</Title>
{/* <Text fz={"sm"} lineClamp={2}>
{data?.Event.deskripsi}
</Text> */}
<Group position="center">
{data?.Event.Event_Peserta.map((val, i) => (
<Box key={i}>
<Avatar
size={"lg"}
radius={"xl"}
sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
src={
RouterProfile.api_foto_profile +
val?.User?.Profile.imagesId
}
/>
</Box>
))}
</Group>
</Stack>
</Card.Section>
{visible && eventId === data?.id ? (
<ComponentGlobal_CardLoadingOverlay />
) : (
""
)}
</Card>
</>
);
}
<Group position="center">
{data?.Event.Event_Peserta.map((e, i) => (
<Box key={i}>
<ComponentGlobal_LoaderAvatar
fileId={e.User.Profile.imageId as any}
sizeAvatar={60}
/>
{/* <Avatar
size={"lg"}
radius={"xl"}
sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
src={
RouterProfile.api_foto_profile +
val?.User?.Profile.imagesId
}
/> */}
</Box>
))}
</Group>
</Stack>
</Card.Section>
{visible && eventId === data?.id ? (
<ComponentGlobal_CardLoadingOverlay />
) : (
""
)}
</ComponentGlobal_CardStyles>
{/* <Card
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
borderRadius: "10px",
marginBottom: "20px",
padding: "15px",
}}
>
</Card> */}
</>
);
}

65
src/app_modules/event/component/card_view/card_riwayat.tsx
View File

@@ -3,7 +3,11 @@ import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_nam
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { Card, Group, Stack, Text, Title } from "@mantine/core";
import { ComponentGlobal_CardLoadingOverlay } from "@/app_modules/_global/component";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardLoadingOverlay,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { MODEL_EVENT } from "../../model/interface";
@@ -15,38 +19,32 @@ export function ComponentEvent_CardRiwayat({ data }: { data: MODEL_EVENT }) {
return (
<>
<Card
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
borderRadius: "10px",
marginBottom: "20px",
padding: "15px",
}}
>
<Card.Section px={"sm"} pt={"sm"}>
<ComponentGlobal_AuthorNameOnHeader
<ComponentGlobal_CardStyles marginBottom={"15px"}>
<Stack>
{/* <ComponentGlobal_AuthorNameOnHeader
profileId={data.Author?.Profile?.id}
imagesId={data.Author?.Profile?.imagesId}
authorName={data.Author?.Profile?.name}
isPembatas={true}
/> */}
<ComponentGlobal_AvatarAndUsername
profile={data.Author?.Profile as any}
/>
</Card.Section>
<Card.Section
p={"sm"}
onClick={() => {
setVisible(true);
setEventId(data?.id);
router.push(RouterEvent.detail_riwayat + data.id);
}}
>
<Stack>
<Group w={"100%"} position="apart">
<Title order={5} lineClamp={1} w={"70%"}>
<Stack
spacing={5}
onClick={() => {
setVisible(true);
setEventId(data?.id);
router.push(RouterEvent.detail_riwayat + data.id);
}}
>
<Group w={"100%"} position="apart" grow>
<Title order={5} lineClamp={1}>
{data.title}
</Title>
<Text align="right" fz={"sm"} lineClamp={1} w={"20%"}>
<Text align="right" fz={"sm"} lineClamp={1}>
{new Intl.DateTimeFormat("id-ID", {
dateStyle: "medium",
}).format(data.tanggal)}
@@ -57,13 +55,14 @@ export function ComponentEvent_CardRiwayat({ data }: { data: MODEL_EVENT }) {
{data.deskripsi}
</Text>
</Stack>
</Card.Section>
{visible && eventId !== "" ? (
<ComponentGlobal_CardLoadingOverlay />
) : (
""
)}
</Card>
{visible && eventId !== "" ? (
<ComponentGlobal_CardLoadingOverlay />
) : (
""
)}
</Stack>
</ComponentGlobal_CardStyles>
</>
);
}

20
src/app_modules/event/component/detail/detail_data.tsx
View File

@@ -1,12 +1,8 @@
"use client";
import { Stack, Title, Grid, Text, Paper, Spoiler } from "@mantine/core";
import moment from "moment";
import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
import { Grid, Stack, Text, Title } from "@mantine/core";
import { MODEL_EVENT } from "../../model/interface";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
export default function ComponentEvent_DetailData({
data,
@@ -23,15 +19,7 @@ export default function ComponentEvent_DetailData({
return (
<>
{/* <pre>{JSON.stringify(jam)}</pre> */}
<Paper
p={"md"}
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
}}
>
<ComponentGlobal_CardStyles marginBottom={"16px"}>
<Stack px={"sm"} spacing={"lg"}>
<Title lineClamp={2} align="center" w={"100%"} order={4}>
{data ? data?.title : null}
@@ -83,7 +71,7 @@ export default function ComponentEvent_DetailData({
<Text>{data ? data?.deskripsi : null}</Text>
</Stack>
</Stack>
</Paper>
</ComponentGlobal_CardStyles>
</>
);
}

38
src/app_modules/event/component/detail/detail_main.tsx
View File

@@ -5,6 +5,10 @@ import moment from "moment";
import { MODEL_EVENT } from "../../model/interface";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
export default function ComponentEvent_DetailMainData({
data,
@@ -14,29 +18,23 @@ export default function ComponentEvent_DetailMainData({
const tgl = data.tanggal;
const hari = tgl.toLocaleString("id-ID", { dateStyle: "full" });
const jam = tgl.toLocaleTimeString([], {
timeStyle: "short",
hourCycle: "h24",
});
const jam = tgl.toLocaleTimeString([], {
timeStyle: "short",
hourCycle: "h24",
});
return (
<>
<Paper
p={"md"}
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
}}
>
<Stack>
<ComponentGlobal_AuthorNameOnHeader
authorName={data.Author.Profile.name}
imagesId={data.Author.Profile.imagesId}
profileId={data.Author.Profile.id}
<ComponentGlobal_CardStyles>
<Stack px={"xs"} spacing={"xl"}>
<ComponentGlobal_AvatarAndUsername
profile={data?.Author?.Profile as any}
/>
<Stack px={"sm"}>
<Title align="center" order={4}>{data ? data.title : null}</Title>
<Stack>
<Title align="center" order={4}>
{data ? data.title : null}
</Title>
<Grid>
<Grid.Col span={4}>
<Text fw={"bold"} fz={"sm"}>
@@ -85,7 +83,7 @@ export default function ComponentEvent_DetailMainData({
</Stack>
</Stack>
</Stack>
</Paper>
</ComponentGlobal_CardStyles>
</>
);
}

62
src/app_modules/event/component/detail/list_peserta.tsx
View File

@@ -1,22 +1,19 @@
"use client";
import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
import {
Paper,
Stack,
Center,
Title,
Grid,
Avatar,
Divider,
Stack,
Text,
Title
} from "@mantine/core";
import _ from "lodash";
import peserta from "../../main/kontribusi/peserta";
import { MODEL_EVENT_PESERTA } from "../../model/interface";
import {
ComponentGlobal_AvatarAndUsername,
ComponentGlobal_CardStyles,
} from "@/app_modules/_global/component";
import { useRouter } from "next/navigation";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { MODEL_EVENT_PESERTA } from "../../model/interface";
export default function ComponentEvent_ListPeserta({
listPeserta,
@@ -28,16 +25,8 @@ export default function ComponentEvent_ListPeserta({
const router = useRouter();
return (
<>
<Paper
mt={"lg"}
p={"md"}
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
}}
>
<Stack spacing={"md"} p={"md"}>
<ComponentGlobal_CardStyles>
<Stack spacing={"md"} px={"sm"}>
<Center>
<Title order={5}>Daftar Peserta ({total})</Title>
</Center>
@@ -52,37 +41,18 @@ export default function ComponentEvent_ListPeserta({
<Stack>
{listPeserta.map((e, i) => (
<Stack key={i} spacing={"sm"}>
<Grid>
<Grid.Col
span={"content"}
onClick={() => {
router.push(RouterProfile.katalog + e.User.Profile.id);
}}
>
<Avatar
sx={{ borderStyle: "solid", borderWidth: "0.5px" }}
radius={"xl"}
bg={"gray"}
size={30}
src={
RouterProfile.api_foto_profile +
e.User.Profile.imagesId
}
/>
</Grid.Col>
<Grid.Col span={"auto"}>
<Stack justify="center" h={"100%"}>
<Text>{e.User.Profile.name}</Text>
</Stack>
</Grid.Col>
</Grid>
<Divider />
<ComponentGlobal_AvatarAndUsername
profile={e.User.Profile as any}
sizeAvatar={30}
fontSize={"sm"}
/>
{/* <Divider /> */}
</Stack>
))}
</Stack>
)}
</Stack>
</Paper>
</ComponentGlobal_CardStyles>
</>
);
}

2
src/app_modules/event/detail/main_detail/index.tsx
View File

@@ -34,7 +34,7 @@ export default function Event_DetailMain({
return (
<>
<Stack spacing={"lg"} py={"md"}>
<Stack spacing={"lg"} pb={"md"}>
<ComponentEvent_DetailMainData data={dataEvent} />
{isJoin ? (
<Button disabled radius={"xl"} color="green">

16
src/app_modules/event/fun/get/get_list_all_publish.ts
View File

@@ -6,13 +6,13 @@ import _ from "lodash";
export async function event_getListAllPublish({ page }: { page: number }) {
const takeData = 10;
const skipData = page * takeData - takeData;
const data = await prisma.event.findMany({
take: takeData,
skip: skipData,
orderBy: [
{
tanggal: "desc",
tanggal: "asc",
},
],
where: {
@@ -22,17 +22,9 @@ export async function event_getListAllPublish({ page }: { page: number }) {
gte: new Date(),
},
},
select: {
id: true,
title: true,
lokasi: true,
tanggal: true,
deskripsi: true,
active: true,
catatan: true,
authorId: true,
include: {
Author: {
select: {
include: {
Profile: true,
},
},

4
src/app_modules/event/fun/get/get_one_by_id.ts
View File

@@ -2,7 +2,7 @@
import prisma from "@/app/lib/prisma";
export async function Event_getOneById(eventId: string) {
export async function event_getOneById(eventId: string) {
const data = await prisma.event.findFirst({
where: {
id: eventId,
@@ -19,7 +19,7 @@ export async function Event_getOneById(eventId: string) {
catatan: true,
authorId: true,
Author: {
select: {
include: {
Profile: true,
},
},

6
src/app_modules/event/main/beranda.tsx
View File

@@ -3,11 +3,7 @@
import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
import ComponentGlobal_CreateButton from "@/app_modules/_global/component/button_create";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import {
Box,
Center,
Loader
} from "@mantine/core";
import { Box, Center, Loader } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import _ from "lodash";
import { ScrollOnly } from "next-scroll-loader";

2
src/app_modules/event/main/kontribusi/peserta.tsx
View File

@@ -1,5 +1,5 @@
"use client";
import { Card, Group, Button, Text, Stack, Avatar } from "@mantine/core";
import { Avatar, Card, Group, Stack, Text } from "@mantine/core";
import moment from "moment";
export default function Event_KontribusiPeserta() {

8
src/app_modules/event/main/riwayat/saya.tsx
View File

@@ -11,7 +11,11 @@ import { event_getListSemuaRiwayat } from "../../fun/get/riwayat/get_list_semua_
import { MODEL_EVENT } from "../../model/interface";
import { event_getListRiwayatSaya } from "../../fun/get/get_list_riwayat_saya";
export default function Event_RiwayatSaya({ listData }: { listData: MODEL_EVENT[] }) {
export default function Event_RiwayatSaya({
listData,
}: {
listData: MODEL_EVENT[];
}) {
const router = useRouter();
const [data, setData] = useState(listData);
const [activePage, setActivePage] = useState(1);
@@ -24,7 +28,7 @@ export default function Event_RiwayatSaya({ listData }: { listData: MODEL_EVENT[
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
height="77vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

8
src/app_modules/event/main/riwayat/semua.tsx
View File

@@ -1,10 +1,6 @@
"use client";
import {
Box,
Center,
Loader
} from "@mantine/core";
import { Box, Center, Loader } from "@mantine/core";
import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
import _ from "lodash";
@@ -32,7 +28,7 @@ export default function Event_SemuaRiwayat({
// --- Main component --- //
<Box>
<ScrollOnly
height="75vh"
height="77vh"
renderLoading={() => (
<Center mt={"lg"}>
<Loader color={"yellow"} />

2
src/app_modules/forum/forumku/forum_profile.tsx
View File

@@ -77,7 +77,7 @@ export default function ComponentForum_ViewForumProfile({
onClick={() => {
setLoading(true);
router.push(
RouterProfile.katalog + auhtorSelectedData?.Profile?.id
RouterProfile.katalogOLD + auhtorSelectedData?.Profile?.id
);
}}
>

17
src/app_modules/home/component/ui_home.tsx
View File

@@ -252,13 +252,12 @@ const listHalamanFooter = [
icon: <IconMessages />,
link: RouterForum.splash,
},
// {
// id: 2,
// name: "MarketPlace",
// icon: <IconShoppingBag />,
// link: "",
// },
{
id: 2,
name: "MarketPlace",
icon: <IconShoppingBag />,
link: "",
},
{
id: 3,
name: "Business Maps",
@@ -313,7 +312,7 @@ export function Home_UiFooter({ dataUser }: { dataUser: MODEL_USER }) {
<Text
lineClamp={1}
c={e.link === "" ? "gray" : "white"}
fz={10}
fz={12}
>
{e.name}
</Text>
@@ -331,7 +330,7 @@ export function Home_UiFooter({ dataUser }: { dataUser: MODEL_USER }) {
router.push(RouterProfile.create, { scroll: false });
} else {
router.push(
RouterProfile.katalog + `${dataUser?.Profile?.id}`,
RouterProfile.katalogOLD + `${dataUser?.Profile?.id}`,
{ scroll: false }
);
}

47
src/app_modules/job/component/detail/detail_data.tsx
View File

@@ -1,31 +1,25 @@
"use client";
import { APIs } from "@/app/lib";
import {
AccentColor,
MainColor,
} from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component";
import {
Card,
Center,
Image,
Loader,
Paper,
Skeleton,
Stack,
Text,
Text
} from "@mantine/core";
import { MODEL_JOB } from "../../model/interface";
import { useState } from "react";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component";
export default function ComponentJob_DetailData({
data,
}: {
data?: MODEL_JOB;
}) {
const [isLoading, setIsLoading] = useState(true);
return (
<>
@@ -44,41 +38,8 @@ export default function ComponentJob_DetailData({
>
<Card.Section px={"xs"} pb={"lg"}>
<Stack spacing={"xl"}>
{data.imageId ? (
<ComponentGlobal_LoadImage
url={APIs.GET({ fileId: data?.imageId })}
/>
) : (
// <Stack align="center">
// {isLoading ? (
// <Paper
// style={{ zIndex: 1, position: "relative" }}
// w={200}
// h={300}
// bg={AccentColor.blackgray}
// >
// <Center h={"100%"}>
// <ComponentGlobal_Loader size={30} variant="dots" />
// </Center>
// </Paper>
// ) : (
// ""
// )}
// <Image
// style={{ zIndex: 2, position: "relative" }}
// onLoad={() => {
// setIsLoading(false);
// }}
// onError={() => {
// setIsLoading(false);
// }}
// alt="Image"
// src={APIs.GET + data?.imageId}
// maw={200}
// />
// </Stack>
""
{data.imageId && (
<ComponentGlobal_LoadImage fileId={data?.imageId} />
)}
<Stack>

145
src/app_modules/katalog/portofolio/component/detail_data_drawer_map.tsx
View File

@@ -1,145 +0,0 @@
"use client";
import { APIs } from "@/app/lib";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component";
import { ComponentMap_SkeletonDrawerDetailData } from "@/app_modules/map/_component";
import { map_funGetOneById } from "@/app_modules/map/fun/get/fun_get_one_by_id";
import { MODEL_MAP } from "@/app_modules/map/lib/interface";
import {
Box,
Button,
Grid,
Group,
Image,
SimpleGrid,
Stack,
Text,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import {
IconBuildingSkyscraper,
IconListDetails,
IconMapPin,
IconPhoneCall,
} from "@tabler/icons-react";
import { useRouter } from "next/navigation";
import { useState } from "react";
export function ComponentPortofolio_DetailDataMap({ mapId }: { mapId: any }) {
const router = useRouter();
const [data, setData] = useState<MODEL_MAP>();
useShallowEffect(() => {
onLoadData(mapId);
}, [mapId]);
async function onLoadData(mapId: string) {
const res: any = await map_funGetOneById({ mapId: mapId });
setData(res);
}
if (!data) return <ComponentMap_SkeletonDrawerDetailData />;
return (
<>
<Stack mt={"lg"} spacing={"xl"} px={"md"}>
<ComponentGlobal_AuthorNameOnHeader
authorName={data?.Author?.username}
imagesId={data?.Author?.Profile?.imagesId}
profileId={data?.Author?.Profile?.id}
/>
<SimpleGrid
cols={2}
spacing={"lg"}
breakpoints={[
{ maxWidth: 980, cols: 2, spacing: "md" },
{ maxWidth: 755, cols: 1, spacing: "sm" },
{ maxWidth: 600, cols: 1, spacing: "sm" },
]}
>
<ComponentGlobal_LoadImage
maw={200}
url={APIs.GET({ fileId: data?.imageId })}
/>
{/* <Image
radius={"sm"}
mah={300}
maw={200}
alt="Photo"
src={APIs.GET + data.imageId}
/> */}
<Box>
<Grid>
<Grid.Col span={2}>
<IconBuildingSkyscraper />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.namaBisnis}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconListDetails />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.MasterBidangBisnis.name}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconPhoneCall />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>+{data?.Portofolio.tlpn}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconMapPin />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.alamatKantor}</Text>
</Grid.Col>
</Grid>
</Box>
</SimpleGrid>
<SimpleGrid
cols={2}
spacing={"lg"}
breakpoints={[
{ maxWidth: 980, cols: 2, spacing: "md" },
{ maxWidth: 755, cols: 1, spacing: "sm" },
{ maxWidth: 600, cols: 1, spacing: "sm" },
]}
>
<Box />
<Group position="center">
<Button
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
onClick={() => {
window.open(
`https://maps.google.com?q=${data?.latitude},${data?.longitude}`,
"_blank",
"width=800,height=600,noopener,noreferrer"
);
}}
>
Buka Maps
</Button>
</Group>
</SimpleGrid>
{/* <pre>{JSON.stringify(data, null, 2)}</pre> */}
</Stack>
</>
);
}

1
src/app_modules/katalog/portofolio/component/index.ts
View File

@@ -1,6 +1,5 @@
import { ComponentPortofolio_ButtonEditLogoBisnis } from "./button/comp_button_edit_logo_bisnis";
import { Portofolio_ComponentButtonSelanjutnya } from "./button/comp_button_selanjutnya";
export { ComponentPortofolio_DetailDataMap } from "./detail_data_drawer_map";
export { Portofolio_ComponentButtonSelanjutnya };
export { ComponentPortofolio_ButtonEditLogoBisnis };

4
src/app_modules/katalog/portofolio/edit/logo/ui_edit_logo.tsx
View File

@@ -37,9 +37,7 @@ export default function Portofolio_EditLogoBisnis({
{img ? (
<Image maw={250} alt="Image" src={img} />
) : (
<ComponentGlobal_LoadImage
url={APIs.GET({ fileId: dataPorto.logoId })}
/>
<ComponentGlobal_LoadImage fileId={dataPorto.logoId} />
)}
<Center>

14
src/app_modules/katalog/portofolio/ui/ui_detail_data.tsx
View File

@@ -63,19 +63,7 @@ export function Portofolio_UiDetailData({
>
<Box>
<Paper>
<ComponentGlobal_LoadImage
url={APIs.GET({ fileId: dataPorto.logoId })}
/>
{/* <AspectRatio ratio={1 / 1} mah={250} mx={"auto"}>
<Image
// style={{ maxHeight: 200, margin: "auto", padding: "5px" }}
alt="Foto"
h={200}
m={"auto"}
p={"xs"}
src={APIs.GET + dataPorto.logoId }
/>
</AspectRatio> */}
<ComponentGlobal_LoadImage fileId={dataPorto.logoId} />
</Paper>
</Box>

19
src/app_modules/katalog/portofolio/ui/ui_detail_logo.tsx
View File

@@ -2,6 +2,8 @@ import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { Paper, Title, AspectRatio, Image } from "@mantine/core";
import { MODEL_PORTOFOLIO } from "../model/interface";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { APIs } from "@/app/lib";
import { Profile_ComponentLoadBackgroundImage } from "../../profile/_component";
export function Portofolio_UiDetailLogo({
dataPorto,
@@ -20,17 +22,18 @@ export function Portofolio_UiDetailLogo({
color: "white",
}}
>
<Title mb={"lg"} order={6}>Logo Bisnis</Title>
<Title mb={"lg"} order={6}>
Logo Bisnis
</Title>
<AspectRatio ratio={1 / 1}>
<Profile_ComponentLoadBackgroundImage fileId={dataPorto.logoId} />
{/* <AspectRatio ratio={1 / 1}>
<Paper>
<Image
alt="Foto"
src={RouterPortofolio.api_logo_porto + `${dataPorto?.logoId}`}
/>
<Image alt="Foto" src={APIs.GET({ fileId: dataPorto.logoId })} />
</Paper>
</AspectRatio>
</AspectRatio> */}
</Paper>
</>
);
}
}

12
src/app_modules/katalog/portofolio/ui/ui_detail_map.tsx
View File

@@ -2,10 +2,13 @@
import { APIs } from "@/app/lib";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { ComponentMap_DrawerDetailData } from "@/app_modules/map/_component";
import {
ComponentMap_DetailData,
ComponentMap_DrawerDetailData,
} from "@/app_modules/map/_component";
import { defaultMapZoom } from "@/app_modules/map/lib/default_lat_long";
import { MODEL_MAP } from "@/app_modules/map/lib/interface";
import { Avatar, Image, Paper, Stack, Title } from "@mantine/core";
import { Avatar, Paper, Stack, Title } from "@mantine/core";
import "mapbox-gl/dist/mapbox-gl.css";
import { useState } from "react";
import {
@@ -15,7 +18,6 @@ import {
NavigationControl,
ScaleControl,
} from "react-map-gl";
import { ComponentPortofolio_DetailDataMap } from "../component";
import { MODEL_PORTOFOLIO } from "../model/interface";
export function Portofolio_UiMap({
@@ -125,9 +127,9 @@ function MapView({
opened={openDrawer}
close={() => setOpenDrawer(false)}
mapId={data.id}
component={<ComponentPortofolio_DetailDataMap mapId={data.id} />}
component={<ComponentMap_DetailData mapId={data.id} isDetail />}
/>
</>
);
}
// ComponentPortofolio_DetailDataMap;

6
src/app_modules/katalog/profile/_component/button/comp_button_update_background_profile.tsx
View File

@@ -21,12 +21,15 @@ export function Profile_ComponentButtonUpdateBackgroundProfile({
const router = useRouter();
const [loading, setLoading] = useState(false);
async function onUpdate() {
setLoading(true);
const uploadFile = await funGlobal_UploadToStorage({
file: file,
dirId: DIRECTORY_ID.profile_background,
});
if (!uploadFile.success)
if (!uploadFile.success) {
setLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload foto profile");
}
const res = await profile_funUpdateBackground({
profileId: profileId,
@@ -37,6 +40,7 @@ export function Profile_ComponentButtonUpdateBackgroundProfile({
ComponentGlobal_NotifikasiBerhasil(res.message);
router.back();
} else {
setLoading(false);
ComponentGlobal_NotifikasiGagal(res.message);
}
}

6
src/app_modules/katalog/profile/_component/button/comp_button_update_photo_profile.tsx
View File

@@ -23,12 +23,15 @@ export function Profile_ComponentButtonUpdatePhotoProfile({
const router = useRouter();
const [isLoading, setLoading] = useState(false);
async function onUpdate() {
setLoading(true);
const uploadPhoto = await funGlobal_UploadToStorage({
file: file,
dirId: DIRECTORY_ID.profile_foto,
});
if (!uploadPhoto.success)
if (!uploadPhoto.success) {
setLoading(false);
return ComponentGlobal_NotifikasiPeringatan("Gagal upload foto profile");
}
const res = await profile_funUpdatePhoto({
fileId: uploadPhoto.data.id,
@@ -39,6 +42,7 @@ export function Profile_ComponentButtonUpdatePhotoProfile({
ComponentGlobal_NotifikasiBerhasil(res.message);
router.back();
} else {
setLoading(false);
ComponentGlobal_NotifikasiGagal(res.message);
}
}

23
src/app_modules/katalog/profile/_component/comp_load_avatar.tsx
View File

@@ -1,20 +1,25 @@
"use client";
import { APIs } from "@/app/lib";
import { routerImagePreview } from "@/app/lib/router_hipmi/router_image_preview";
import { AccentColor } from "@/app_modules/_global/color";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Avatar, Box, Center, Image, Paper, Skeleton } from "@mantine/core";
import { Avatar, Image, Skeleton } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { CSSProperties, useState } from "react";
export function Profile_ComponentAvatarProfile({
url,
fileId,
style,
}: {
url: string;
fileId: string;
style?: CSSProperties;
}) {
const router = useRouter();
const [isImage, setIsImage] = useState<boolean | null>(null);
const url = APIs.GET({ fileId: fileId, size: "200" });
useShallowEffect(() => {
onLoadImage();
}, []);
@@ -70,12 +75,12 @@ export function Profile_ComponentAvatarProfile({
style={style}
radius={"50%"}
size={100}
sx={{
borderStyle: "solid",
borderWidth: "0.5px",
borderColor: "white",
}}
src={url}
onClick={() =>
router.push(routerImagePreview.main({ id: fileId }), {
scroll: false,
})
}
/>
</>
);

32
src/app_modules/katalog/profile/_component/comp_load_background.tsx
View File

@@ -1,19 +1,23 @@
"use client";
import { APIs } from "@/app/lib";
import { routerImagePreview } from "@/app/lib/router_hipmi/router_image_preview";
import { AspectRatio, Box, Center, Image, Skeleton } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { useState } from "react";
type IRadius = "xs" | "sm" | "md" | "lg" | "xl";
export function Profile_ComponentLoadBackgroundImage({
url,
radius,
fileId,
}: {
url: string;
radius?: IRadius;
fileId: string;
}) {
const router = useRouter();
const [isImage, setIsImage] = useState<boolean | null>(null);
const url = APIs.GET({ fileId: fileId });
useShallowEffect(() => {
onLoadImage();
}, []);
@@ -35,7 +39,7 @@ export function Profile_ComponentLoadBackgroundImage({
if (!isImage)
return (
<>
<Center h={200} bg={"white"} style={{borderRadius: "10px"}} >
<Center h={200} bg={"white"} style={{ borderRadius: "10px" }}>
<Image
alt="No Image"
maw={150}
@@ -49,7 +53,23 @@ export function Profile_ComponentLoadBackgroundImage({
return (
<>
<Image height={200} radius={radius ? radius : 0} alt="Image" src={url} />
<Image
onClick={() =>
router.push(routerImagePreview.main({ id: fileId }), {
scroll: false,
})
}
style={{
borderColor: "white",
borderStyle: "solid",
borderWidth: "1px",
borderRadius: "5px",
}}
radius={5}
height={200}
alt="Image"
src={url}
/>
</>
);
}

7
src/app_modules/katalog/ui/ui_profile.tsx
View File

@@ -68,10 +68,7 @@ export function Profile_UiView({
>
<Box>
<Profile_ComponentLoadBackgroundImage
url={APIs.GET({
fileId: profile.imageBackgroundId as string,
})}
radius="sm"
fileId={profile.imageBackgroundId as any}
/>
{/* <Image
radius={"sm"}
@@ -91,7 +88,7 @@ export function Profile_UiView({
>
<Center>
<Profile_ComponentAvatarProfile
url={APIs.GET({ fileId: profile.imageId as any, size: "200" })}
fileId={profile.imageId as any}
style={{
borderStyle: "solid",
borderColor: AccentColor.darkblue,

84
src/app_modules/map/_component/comp_load_image_map.tsx Normal file
View File

@@ -0,0 +1,84 @@
"use client";
import { APIs, RouterAssetImage } from "@/app/lib";
import { routerImagePreview } from "@/app/lib/router_hipmi/router_image_preview";
import { Box, Center, Image, Skeleton } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { useRouter } from "next/navigation";
import { useState } from "react";
export function ComponentMap_LoadImageMap({
fileId,
size,
}: {
fileId: string;
size?: string;
}) {
const router = useRouter();
const [isImage, setIsImage] = useState<boolean | null>(null);
const url = APIs.GET({ fileId: fileId, size: size });
useShallowEffect(() => {
onLoadImage();
}, []);
async function onLoadImage() {
const res = await fetch(url);
try {
if (res.ok) {
return setIsImage(true);
}
setIsImage(false);
} catch (error) {
console.log(error);
}
}
return (
<>
{isImage === null ? (
<Skeleton height={200} radius={"sm"} />
) : isImage ? (
<Image
onClick={() =>
router.push(routerImagePreview.main({ id: fileId }), {
scroll: false,
})
}
style={{
borderColor: "white",
borderStyle: "solid",
borderWidth: "0.5px",
borderRadius: "5px",
}}
radius={5}
alt="Image"
maw={500}
miw={300}
height={200}
src={url}
/>
) : (
<Box
bg={"gray"}
style={{
borderColor: "white",
borderStyle: "solid",
borderWidth: "0.5px",
borderRadius: "5px",
height: 200,
}}
>
<Center h={"100%"}>
<Image
alt="Image"
height={100}
width={100}
src={RouterAssetImage.no_image}
/>
</Center>
</Box>
)}
</>
);
}

172
src/app_modules/map/_component/detail_data.tsx
View File

@@ -1,18 +1,10 @@
"use client";
import { RouterPortofolio } from "@/app/lib/router_hipmi/router_katalog";
import { RouterMap } from "@/app/lib/router_hipmi/router_map";
import ComponentGlobal_AuthorNameOnHeader from "@/app_modules/_global/author_name_on_header";
import { MainColor } from "@/app_modules/_global/color/color_pallet";
import {
Box,
Button,
Grid,
Image,
SimpleGrid,
Stack,
Text,
} from "@mantine/core";
import { ComponentGlobal_AvatarAndUsername } from "@/app_modules/_global/component";
import { MODEL_USER } from "@/app_modules/home/model/interface";
import { Box, Button, Grid, Group, Stack, Text } from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import {
IconBuildingSkyscraper,
@@ -24,21 +16,29 @@ import { useRouter } from "next/navigation";
import { useState } from "react";
import { map_funGetOneById } from "../fun/get/fun_get_one_by_id";
import { MODEL_MAP } from "../lib/interface";
import { ComponentMap_LoadImageMap } from "./comp_load_image_map";
import { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data";
import { APIs } from "@/app/lib";
import { ComponentGlobal_LoadImage } from "@/app_modules/_global/component";
export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
export function ComponentMap_DetailData({
mapId,
isDetail,
}: {
mapId: any;
isDetail?: boolean;
}) {
const router = useRouter();
const [data, setData] = useState<MODEL_MAP>();
const [dataUser, setDataUser] = useState<MODEL_USER>();
const [isLoading, setIsLoading] = useState(false);
useShallowEffect(() => {
onLoadData(mapId);
}, [mapId]);
onLoadData(setData, setDataUser);
}, [setData, setDataUser]);
async function onLoadData(mapId: string) {
async function onLoadData(setData: any, setDataUser: any) {
const res: any = await map_funGetOneById({ mapId: mapId });
setData(res);
setDataUser(res.Author);
}
if (!data) return <ComponentMap_SkeletonDrawerDetailData />;
@@ -46,83 +46,69 @@ export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
return (
<>
<Stack mt={"lg"} spacing={"xl"} px={"md"}>
<ComponentGlobal_AuthorNameOnHeader
authorName={data?.Author?.username}
imagesId={data?.Author?.Profile?.imagesId}
profileId={data?.Author?.Profile?.id}
<ComponentGlobal_AvatarAndUsername
profile={dataUser?.Profile as any}
/>
<SimpleGrid
cols={2}
spacing={"lg"}
breakpoints={[
{ maxWidth: 980, cols: 2, spacing: "md" },
{ maxWidth: 755, cols: 1, spacing: "sm" },
{ maxWidth: 600, cols: 1, spacing: "sm" },
]}
>
<ComponentGlobal_LoadImage
url={APIs.GET({ fileId: data?.imageId })}
/>
{/* <Image radius={"sm"} mah={300} maw={200} alt="Photo" src={} /> */}
<Box>
<Grid>
<Grid.Col span={2}>
<IconBuildingSkyscraper />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.namaBisnis}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconListDetails />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.MasterBidangBisnis.name}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconPhoneCall />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>+{data?.Portofolio.tlpn}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconMapPin />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.alamatKantor}</Text>
</Grid.Col>
</Grid>
</Box>
</SimpleGrid>
<ComponentMap_LoadImageMap fileId={data.imageId} />
<SimpleGrid
cols={2}
spacing={"lg"}
breakpoints={[
{ maxWidth: 980, cols: 2, spacing: "md" },
{ maxWidth: 755, cols: 1, spacing: "sm" },
{ maxWidth: 600, cols: 1, spacing: "sm" },
]}
>
<Button
onClick={() => {
router.push(RouterPortofolio.main_detail + data?.Portofolio.id, {
scroll: false,
});
}}
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Detail
</Button>
<Box>
<Grid>
<Grid.Col span={2}>
<IconBuildingSkyscraper />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.namaBisnis}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconListDetails />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.MasterBidangBisnis.name}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconPhoneCall />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>+{data?.Portofolio.tlpn}</Text>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col span={2}>
<IconMapPin />
</Grid.Col>
<Grid.Col span={"auto"}>
<Text>{data?.Portofolio.alamatKantor}</Text>
</Grid.Col>
</Grid>
</Box>
<Group grow position={isDetail ? "center" : "apart"}>
{!isDetail && (
<Button
onClick={() => {
setIsLoading(true);
router.push(
RouterPortofolio.main_detail + data?.Portofolio.id,
{
scroll: false,
}
);
}}
loading={isLoading}
loaderPosition="center"
radius={"xl"}
bg={MainColor.yellow}
color="yellow"
c={"black"}
>
Detail
</Button>
)}
<Button
radius={"xl"}
@@ -139,9 +125,7 @@ export function ComponentMap_DetailData({ mapId }: { mapId: any }) {
>
Buka Maps
</Button>
</SimpleGrid>
{/* <pre>{JSON.stringify(data, null, 2)}</pre> */}
</Group>
</Stack>
</>
);

7
src/app_modules/map/_component/drawer.tsx
View File

@@ -16,12 +16,7 @@ import React, { useState } from "react";
import { map_funGetOneById } from "../fun/get/fun_get_one_by_id";
import { MODEL_MAP } from "../lib/interface";
interface MODEL_DRAWER {
id: string;
name: string;
icon: string;
path: string;
}
export function ComponentMap_DrawerDetailData({
opened,
close,

4
src/app_modules/map/_component/index.ts
View File

@@ -1,8 +1,12 @@
import { ComponentMap_ButtonSavePin } from "./button/comp_button_save_pin";
import { ComponentMap_ButtonUpdateDataMap } from "./button/comp_button_update_data_map";
import { ComponentMap_LoadImageMap } from "./comp_load_image_map";
import { ComponentMap_DetailData } from "./detail_data";
export { ComponentMap_Header } from "./header";
export { ComponentMap_DrawerDetailData } from "./drawer";
export { ComponentMap_SkeletonDrawerDetailData } from "./skeleton_detail_data";
export { ComponentMap_ButtonSavePin };
export { ComponentMap_ButtonUpdateDataMap };
export { ComponentMap_DetailData };
export { ComponentMap_LoadImageMap };

7
src/app_modules/map/fun/get/fun_get_one_by_id.ts
View File

@@ -12,12 +12,7 @@ export async function map_funGetOneById({ mapId }: { mapId: string }) {
select: {
id: true,
username: true,
Profile: {
select: {
id: true,
imagesId: true,
},
},
Profile: true,
},
},
Portofolio: {

13
src/app_modules/map/ui/ui_edit_map.tsx
View File

@@ -141,18 +141,11 @@ export function UiMap_EditMap({
<ComponentGlobal_BoxUploadImage>
{img ? (
<AspectRatio ratio={1 / 1} mah={265} mx={"auto"}>
<Image
style={{ maxHeight: 250, margin: "auto", padding: "5px" }}
alt="Photo"
height={250}
src={img}
/>
<AspectRatio ratio={1 / 1} mt={5} maw={300} mx={"auto"}>
<Image style={{ maxHeight: 250 }} alt="Avatar" src={img} />
</AspectRatio>
) : (
<ComponentGlobal_LoadImage
url={APIs.GET({ fileId: data.imageId })}
/>
<ComponentGlobal_LoadImage maw={300} fileId={data.imageId} />
)}
</ComponentGlobal_BoxUploadImage>

2
src/app_modules/map/ui/ui_map.tsx
View File

@@ -110,7 +110,7 @@ export function UiMap_MapBoxView({
opened={openDrawer}
close={() => setOpenDrawer(false)}
mapId={mapId}
component={<ComponentMap_DetailData mapId={mapId} />}
component={<ComponentMap_DetailData mapId={mapId} />}
/>
</>
);

192
src/app_modules/user_search/component/ui_user_search.tsx
View File

@@ -13,7 +13,7 @@ import {
Loader,
Stack,
Text,
TextInput
TextInput,
} from "@mantine/core";
import { IconChevronRight, IconSearch } from "@tabler/icons-react";
import _ from "lodash";
@@ -21,6 +21,7 @@ import { ScrollOnly } from "next-scroll-loader";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { userSearch_getAllUser } from "../fun/get/get_all_user";
import { ComponentGlobal_LoaderAvatar } from "@/app_modules/_global/component";
export function UserSearch_UiView({ listUser }: { listUser: MODEL_USER[] }) {
const [data, setData] = useState(listUser);
@@ -49,7 +50,7 @@ export function UserSearch_UiView({ listUser }: { listUser: MODEL_USER[] }) {
/>
<Box>
{_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Tidak ada pengguna lain" />
<ComponentGlobal_IsEmptyData text="Username tidak ditemukan" />
) : (
<ScrollOnly
height="84vh"
@@ -92,22 +93,16 @@ function CardView({ data }: { data: MODEL_USER }) {
py={"xs"}
onClick={() => {
setLoading(true);
router.push(RouterProfile.katalog + `${data?.Profile?.id}`);
router.push(RouterProfile.katalogOLD + `${data?.Profile?.id}`);
}}
>
<Group position="apart">
<Group position="left">
<Avatar
sx={{
borderStyle: "solid",
borderWidth: "0.5px",
}}
radius={"xl"}
size={"md"}
src={
RouterProfile?.api_foto_profile + `${data?.Profile?.imagesId}`
}
<ComponentGlobal_LoaderAvatar
fileId={data.Profile.imageId as any}
imageSize="100"
/>
<Stack spacing={0}>
<Text fw={"bold"} lineClamp={1}>
{data?.username}
@@ -134,174 +129,3 @@ function CardView({ data }: { data: MODEL_USER }) {
</>
);
}
let dataDummy = [
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 1",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
{
id: "clx8pl7r90005su4mldioo0v1",
username: "amalia 2",
nomor: "628980185458",
active: true,
masterUserRoleId: "1",
Profile: {
id: "clx8ptp7w000esu4ma275qnc8",
name: "Amalia Dwi",
imagesId: "clx8ptp7m000bsu4mwzbfvd9w",
},
},
];

9
src/app_modules/user_search/fun/get/get_all_user.ts
View File

@@ -39,17 +39,12 @@ export async function userSearch_getAllUser({
},
],
},
select: {
id: true,
username: true,
nomor: true,
active: true,
masterUserRoleId: true,
include: {
Profile: {
select: {
id: true,
name: true,
imagesId: true,
imageId: true,
},
},
},

2
src/app_modules/vote/component/detail/detail_daftar_kontributor.tsx
View File

@@ -54,7 +54,7 @@ export default function ComponentVote_DaftarKontributorVoter({
span={2}
onClick={() =>
router.push(
RouterProfile.katalog + e.Author.Profile.id
RouterProfile.katalogOLD + e.Author.Profile.id
)
}
>

9
src/lib/envs.ts Normal file
View File

@@ -0,0 +1,9 @@
export const envs = {
DATABASE_URL : process.env.DATABASE_URL,
WIBU_PWD : process.env.WIBU_PWD,
Client_KEY : process.env.Client_KEY,
Server_KEY : process.env.Server_KEY,
MAPBOX_TOKEN : process.env.MAPBOX_TOKEN,
WS_APIKEY : process.env.WS_APIKEY,
WIBU_REALTIME_KEY : process.env.WIBU_REALTIME_KEY
}

1
src/lib/routes.ts
View File

@@ -1,4 +1,3 @@
export const pages = {
"/": "/",
"/zCoba": "/zCoba",

859
yarn.lock
View File

File diff suppressed because it is too large Load Diff