63 lines
2.0 KiB
TypeScript
63 lines
2.0 KiB
TypeScript
import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
|
|
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
|
|
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
|
|
import { Paper, Grid, Stack, Center, Loader, Text } from "@mantine/core";
|
|
import { IconChevronRight } from "@tabler/icons-react";
|
|
import { useRouter } from "next/navigation";
|
|
import { useState } from "react";
|
|
|
|
export function ComponentColab_CardGrup({ data }: { data: any }) {
|
|
const router = useRouter();
|
|
const [loading, setLoading] = useState(false);
|
|
const [idRoom, setIdRoom] = useState("");
|
|
|
|
return (
|
|
<>
|
|
<Paper
|
|
style={{
|
|
border: `2px solid ${AccentColor.blue}`,
|
|
backgroundColor: AccentColor.darkblue,
|
|
color: "white",
|
|
borderRadius: "10px",
|
|
marginBottom: "20px",
|
|
padding: "15px",
|
|
}}
|
|
onClick={() => {
|
|
router.push(
|
|
RouterColab.group_chat + data?.ProjectCollaboration_RoomChat.id,
|
|
{ scroll: false }
|
|
);
|
|
setIdRoom(data?.ProjectCollaboration_RoomChat.id);
|
|
setLoading(true);
|
|
}}
|
|
>
|
|
<Grid align="center" h={"100%"}>
|
|
<Grid.Col span={"auto"}>
|
|
<Stack spacing={0}>
|
|
<Text fw={"bold"} lineClamp={1}>
|
|
{data?.ProjectCollaboration_RoomChat?.name}
|
|
</Text>
|
|
<Text fz={"xs"} c={"white"}>
|
|
{
|
|
data?.ProjectCollaboration_RoomChat
|
|
?.ProjectCollaboration_AnggotaRoomChat.length
|
|
}{" "}
|
|
Anggota
|
|
</Text>
|
|
</Stack>
|
|
</Grid.Col>
|
|
<Grid.Col span={"content"}>
|
|
<Center>
|
|
{data?.ProjectCollaboration_RoomChat?.id === idRoom ? (
|
|
<ComponentGlobal_Loader />
|
|
) : (
|
|
<IconChevronRight color="white" />
|
|
)}
|
|
</Center>
|
|
</Grid.Col>
|
|
</Grid>
|
|
</Paper>
|
|
</>
|
|
);
|
|
}
|