#style:

- UI Event
- Perbaiki create button ke beberapa app
## No Issuee

src/app_modules/event/main/status_page/draft.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { RouterEvent } from "@/app/lib/router_hipmi/router_event";
-import { Box, Center, Group, Paper, Stack, Text, Title } from "@mantine/core";
+import { Box, Center, Group, Loader, Paper, Stack, Text, Title } from "@mantine/core";
 import moment from "moment";
 import { useRouter } from "next/navigation";
 import { MODEL_EVENT } from "../../model/interface";
@@ -9,24 +9,59 @@ import { useState } from "react";
 import ComponentEvent_BoxListStatus from "../../component/box_list_status";
 import _ from "lodash";
 import ComponentEvent_IsEmptyData from "../../component/is_empty_data";
+import ComponentGlobal_IsEmptyData from "@/app_modules/_global/component/is_empty_data";
+import { ScrollOnly } from "next-scroll-loader";
+import { event_getAllReview } from "../../fun/get/status/get_all_review";
+import { event_getAllDraft } from "../../fun/get/status/get_all_draft";
 
 export default function Event_StatusDraft({
   listDraft,
 }: {
   listDraft: MODEL_EVENT[];
 }) {
-  if (_.isEmpty(listDraft))
-    return <ComponentEvent_IsEmptyData text="Tidak ada data" />;
-  return (
-    <>
-      {listDraft.map((e, i) => (
-        <Box key={e.id}>
-          <ComponentEvent_BoxListStatus
-            data={e}
-            path={RouterEvent.detail_draft}
-          />
-        </Box>
-      ))}
-    </>
-  );
+   const [data, setData] = useState(listDraft);
+   const [activePage, setActivePage] = useState(1);
+
+
+   return (
+     <>
+       {_.isEmpty(data) ? (
+         <ComponentGlobal_IsEmptyData />
+       ) : (
+         // --- Main component --- //
+         <Box>
+           <ScrollOnly
+             height="75vh"
+             renderLoading={() => (
+               <Center mt={"lg"}>
+                 <Loader color={"yellow"} />
+               </Center>
+             )}
+             data={data}
+             setData={setData}
+             moreData={async () => {
+               const loadData = await event_getAllDraft({
+                 page: activePage + 1,
+               });
+               setActivePage((val) => val + 1);
+
+               return loadData;
+             }}
+           >
+             {(item) => (
+               <ComponentEvent_BoxListStatus
+                 data={item}
+                 path={RouterEvent.detail_draft}
+               />
+             )}
+           </ScrollOnly>
+         </Box>
+       )}
+     </>
+   );
+
+
+
+  
+
 }