59 lines
1.7 KiB
TypeScript
59 lines
1.7 KiB
TypeScript
import { RouterEvent } from "@/lib/router_hipmi/router_event";
|
|
import { MainColor } from "@/app_modules/_global/color";
|
|
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";
|
|
import { Comp_SetInnerHTML } from "@/app_modules/_global/component/new/comp_set_inner_html";
|
|
|
|
export function ComponentEvent_CardBeranda({ data }: { data: any }) {
|
|
const router = useRouter();
|
|
const [eventId, setEventId] = useState("");
|
|
const [visible, setVisible] = useState(false);
|
|
|
|
return (
|
|
<>
|
|
<ComponentGlobal_CardStyles
|
|
marginBottom={"15px"}
|
|
>
|
|
<Stack>
|
|
<ComponentGlobal_AvatarAndUsername
|
|
profile={data?.Author?.Profile as any}
|
|
/>
|
|
|
|
<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 c={MainColor.white} order={5} lineClamp={1}>
|
|
{data.title}
|
|
</Title>
|
|
</Group>
|
|
|
|
<Text c={MainColor.white} fz={"sm"} lineClamp={4}>
|
|
<Comp_SetInnerHTML
|
|
props={data.deskripsi}
|
|
style={{ height: 50 }}
|
|
/>
|
|
</Text>
|
|
</Stack>
|
|
|
|
{visible && data?.id === eventId && (
|
|
<ComponentGlobal_CardLoadingOverlay />
|
|
)}
|
|
</Stack>
|
|
</ComponentGlobal_CardStyles>
|
|
</>
|
|
);
|
|
}
|