upd: list kegiatan

Deskripsi:
- update api berdasarkan kategori data
- update tampilan untuk role user dan coadmin di kasih filter berdasarkan data
- tulisan filter by menjadi filter

No Issues

src/module/_global/index.ts

@@ -27,6 +27,7 @@ import SkeletonUser from "./components/skeleton_user";
 import SkeletonList from "./components/skeleton_list";
 import { funViewDir } from "./fun/view_dir";
 import { funSendWebPush } from "./fun/send_web_push";
+import ViewFilterData from "./view/view_filter_kategori_data";
 
 export { WARNA };
 export { LayoutLogin };
@@ -63,3 +64,4 @@ export { SkeletonList }
 export { keyWibu }
 export { funViewDir }
 export { funSendWebPush }
+export { ViewFilterData }

src/module/_global/view/view_filter_kategori_data.tsx

@@ -0,0 +1,84 @@
+'use client'
+import { useHookstate } from "@hookstate/core";
+import { Box, Button, Divider, Group, rem, Text } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { useRouter, useSearchParams } from "next/navigation";
+import { useState } from "react";
+import { FaCheck } from "react-icons/fa6";
+import { TEMA } from "../bin/val_global";
+import LayoutNavbarNew from "../layout/layout_navbar_new";
+
+export default function ViewFilterData({ linkFilter }: { linkFilter: string }) {
+   const [selectedFilter, setSelectedFilter] = useState<any>('');
+   const data = [
+      {
+         id: 1,
+         data: "data-saya",
+         name: "Kegiatan Saya",
+      },
+      {
+         id: 2,
+         data: "semua",
+         name: "Semua Kegiatan",
+      },
+   ]
+   const searchParams = useSearchParams()
+   const kategori = searchParams.get('cat')
+   const tema = useHookstate(TEMA)
+
+
+
+   useShallowEffect(() => {
+      if (kategori == "null" || kategori == "undefined" || kategori == '') {
+         setSelectedFilter("data-saya")
+      } else {
+         setSelectedFilter(kategori)
+      }
+   }, [kategori]);
+
+   const router = useRouter()
+
+   return (
+      <Box>
+         <LayoutNavbarNew back='' title='Filter' menu />
+         <Box p={20}>
+            {
+               data.map((filter) => (
+                  <Box key={filter.id}>
+                     <Group
+                        justify="space-between"
+                        align="center"
+                        mb={10}
+                        onClick={() => setSelectedFilter(filter.data)}
+                     >
+                        <Text fw={selectedFilter === filter.data ? 'bold' : 'normal'}>
+                           {filter.name}
+                        </Text>
+                        {selectedFilter === filter.data && <FaCheck size={25} />}
+                     </Group>
+                     <Divider my={"sm"} />
+                  </Box>
+               ))
+
+            }
+         </Box>
+         <Box pos={'fixed'} bottom={0} p={rem(20)} w={"100%"} style={{
+            maxWidth: rem(550),
+            zIndex: 999,
+            backgroundColor: `${tema.get().bgUtama}`,
+         }}>
+            <Button
+               fullWidth
+               radius={100}
+               size="lg"
+               color={tema.get().utama}
+               onClick={() => {
+                  router.push(`/${linkFilter}?cat=` + selectedFilter)
+               }}
+            >
+               Terapkan
+            </Button>
+         </Box>
+      </Box>
+   );
+}