Hold persiapan persentase pak fahmi

- Sudah bisa create
- Sudah bisa join proyek
- Tambahan untuk mengisi form jika ingin join
### No issue

src/app_modules/colab/detail/main_detail/layout.tsx

@@ -3,16 +3,26 @@
 import { AppShell } from "@mantine/core";
 import React from "react";
 import ComponentColab_HeaderTamplate from "../../component/header_tamplate";
+import { IconEdit } from "@tabler/icons-react";
+import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
 
 export default function LayoutColab_MainDetail({
   children,
+  colabId,
 }: {
   children: React.ReactNode;
+  colabId: string;
 }) {
   return (
     <>
       <AppShell
-        header={<ComponentColab_HeaderTamplate title="Detail" />}
+        header={
+          <ComponentColab_HeaderTamplate
+            title="Detail"
+            icon={<IconEdit />}
+            route2={RouterColab.edit + colabId}
+          />
+        }
       >
         {children}
       </AppShell>

src/app_modules/colab/detail/proyek/partisipasi/index.tsx

@@ -3,15 +3,28 @@
 import ComponentColab_DetailData from "@/app_modules/colab/component/detail/detail_data";
 import ComponentColab_DetailListPartisipasiUser from "@/app_modules/colab/component/detail/list_partisipasi_user";
 import ComponentColab_AuthorNameOnHeader from "@/app_modules/colab/component/header_author_name";
+import { MODEL_COLLABORATION, MODEL_COLLABORATION_PARTISIPASI } from "@/app_modules/colab/model/interface";
 import { Stack, Text } from "@mantine/core";
 
-export default function Colab_DetailPartisipasiProyek() {
+export default function Colab_DetailPartisipasiProyek({
+  dataColab,
+  listPartisipan,
+}: {
+  dataColab: MODEL_COLLABORATION;
+  listPartisipan: MODEL_COLLABORATION_PARTISIPASI[]
+}) {
   return (
     <>
       <Stack px={5} spacing={"xl"}>
-        <ComponentColab_AuthorNameOnHeader />
-        <ComponentColab_DetailData />
-        <ComponentColab_DetailListPartisipasiUser />
+        {/* <pre>{JSON.stringify(dataColab, null,2)}</pre> */}
+        <ComponentColab_AuthorNameOnHeader
+          authorName={dataColab?.Author.Profile.name}
+          profileId={dataColab?.Author.Profile.id}
+          imagesId={dataColab?.Author.Profile.imagesId}
+          tglPublish={dataColab?.createdAt}
+        />
+        <ComponentColab_DetailData data={dataColab} />
+        <ComponentColab_DetailListPartisipasiUser listPartisipan={listPartisipan} />
       </Stack>
     </>
   );

src/app_modules/colab/detail/proyek/saya/index.tsx

@@ -0,0 +1,184 @@
+"use client";
+
+import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
+import ComponentColab_DetailData from "@/app_modules/colab/component/detail/detail_data";
+import ComponentColab_AuthorNameOnHeader from "@/app_modules/colab/component/header_author_name";
+import { gs_colab_hot_menu } from "@/app_modules/colab/global_state";
+import {
+  MODEL_COLLABORATION,
+  MODEL_COLLABORATION_PARTISIPASI,
+} from "@/app_modules/colab/model/interface";
+import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
+import {
+  Button,
+  Checkbox,
+  Drawer,
+  Grid,
+  Group,
+  Paper,
+  ScrollArea,
+  Stack,
+  Text,
+  TextInput,
+  Title,
+} from "@mantine/core";
+import { useDisclosure } from "@mantine/hooks";
+import { useAtom } from "jotai";
+import _ from "lodash";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+export default function Colab_DetailProyekSaya({
+  dataColab,
+  listPartisipan,
+}: {
+  dataColab: MODEL_COLLABORATION;
+  listPartisipan: MODEL_COLLABORATION_PARTISIPASI[];
+}) {
+  return (
+    <>
+      <Stack px={5} spacing={"xl"}>
+        <ComponentColab_DetailData data={dataColab} />
+        <CheckBoxPartisipan listPartisipan={listPartisipan} />
+      </Stack>
+    </>
+  );
+}
+
+function CheckBoxPartisipan({
+  listPartisipan,
+}: {
+  listPartisipan: MODEL_COLLABORATION_PARTISIPASI[];
+}) {
+  const router = useRouter();
+  const [value, setValue] = useState<string[]>([]);
+  const [opened, { open, close }] = useDisclosure(false);
+  const [hotMenu, setHotMenu] = useAtom(gs_colab_hot_menu);
+
+  const listCheck = [
+    {
+      id: 1,
+      value: "satu",
+      label: "Satu",
+    },
+    {
+      id: 2,
+      value: "dua",
+      label: "Dua",
+    },
+    {
+      id: 3,
+      value: "tiga",
+      label: "Tiga",
+    },
+    {
+      id: 4,
+      value: "empat",
+      label: "Empat",
+    },
+    {
+      id: 5,
+      value: "lima",
+      label: "Lima",
+    },
+    {
+      id: 6,
+      value: "enam",
+      label: "Enam",
+    },
+    {
+      id: 7,
+      value: "tujuh",
+      label: "Tujuh",
+    },
+    {
+      id: 8,
+      value: "delapan",
+      label: "Delapan",
+    },
+    {
+      id: 9,
+      value: "sembilan",
+      label: "Sembilan",
+    },
+    {
+      id: 10,
+      value: "sepuluh",
+      label: "Sepuluh",
+    },
+  ];
+
+  async function onSave() {
+    close();
+    ComponentGlobal_NotifikasiBerhasil("Berhasil Membuat Grup");
+    setHotMenu(4);
+    router.push(RouterColab.grup_diskusi);
+  }
+
+  return (
+    <>
+      <Stack>
+        {/* <pre>{JSON.stringify(listPartisipan,null,2)}</pre> */}
+        <Paper withBorder shadow="lg" p={"sm"}>
+          <Text c={"red"} fz={10}>
+            *
+            <Text px={"xs"} span inherit c={"gray"}>
+              Pilih user yang akan menjadi tim proyek anda
+            </Text>
+          </Text>
+          <ScrollArea h={400}>
+            <Checkbox.Group value={value} onChange={setValue}>
+              <Stack mt="xs">
+                {listPartisipan.map((e, i) => (
+                  <Grid key={e.id} align="center">
+                    <Grid.Col span={"content"}>
+                      <Checkbox value={e.id.toString()} />
+                    </Grid.Col>
+                    <Grid.Col span={"auto"}>
+                      <ComponentColab_AuthorNameOnHeader
+                        isPembatas={true}
+                        authorName={e?.User.Profile.name}
+                        profileId={e?.User.Profile.id}
+                        imagesId={e?.User.Profile.imagesId}
+                      />
+                    </Grid.Col>
+                  </Grid>
+                ))}
+              </Stack>
+            </Checkbox.Group>
+          </ScrollArea>
+        </Paper>
+        <Button
+          radius={"xl"}
+          disabled={_.isEmpty(value) ? true : false}
+          onClick={() => {
+            open();
+          }}
+        >
+          Buat Ruang Diskusi{" "}
+        </Button>
+      </Stack>
+
+      <Drawer
+        opened={opened}
+        onClose={close}
+        position="bottom"
+        size={150}
+        withCloseButton={false}
+      >
+        <Stack>
+          <Title order={6}>Nama Grup Diskusi</Title>
+          <TextInput placeholder="Masukan nama grup diskusi .." radius={"xl"} />
+          <Group grow>
+            <Button radius={"xl"} onClick={close}>
+              Batal
+            </Button>
+            <Button radius={"xl"} color="green" onClick={() => onSave()}>
+              Simpan
+            </Button>
+          </Group>
+        </Stack>
+      </Drawer>
+    </>
+  );
+}

src/app_modules/colab/detail/proyek/saya/layout.tsx

@@ -0,0 +1,20 @@
+"use client";
+
+import ComponentColab_HeaderTamplate from "@/app_modules/colab/component/header_tamplate";
+import { AppShell } from "@mantine/core";
+import { IconEdit } from "@tabler/icons-react";
+import React from "react";
+
+export default function LayoutColab_DetailProyekSaya({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      <AppShell header={<ComponentColab_HeaderTamplate title="Proyek Saya" />}>
+        {children}
+      </AppShell>
+    </>
+  );
+}

src/app_modules/colab/detail/status/publish/index.tsx

@@ -2,7 +2,6 @@
 
 import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
 import ComponentColab_DetailData from "@/app_modules/colab/component/detail/detail_data";
-import ComponentColab_DetailListPartisipasiUser from "@/app_modules/colab/component/detail/list_partisipasi_user";
 import ComponentColab_AuthorNameOnHeader from "@/app_modules/colab/component/header_author_name";
 import { gs_colab_hot_menu } from "@/app_modules/colab/global_state";
 import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";