diff --git a/src/module/_global/index.ts b/src/module/_global/index.ts
index 23e3719..debe245 100644
--- a/src/module/_global/index.ts
+++ b/src/module/_global/index.ts
@@ -1,11 +1,15 @@
import { WARNA } from "./fun/WARNA";
+import LayoutDrawer from "./layout/layout_drawer";
import LayoutIconBack from "./layout/layout_icon_back";
import LoadingPage from "./layout/layout_loading_page";
import LayoutLogin from "./layout/layout_login";
import LayoutNavbarHome from "./layout/layout_navbar_home";
+import { isDrawer } from "./val/idDrawer";
export { WARNA }
export { LayoutLogin }
export { LayoutNavbarHome }
-export {LayoutIconBack}
+export { LayoutIconBack }
export { LoadingPage }
+export { LayoutDrawer }
+export { isDrawer }
\ No newline at end of file
diff --git a/src/module/_global/layout/layout_drawer.tsx b/src/module/_global/layout/layout_drawer.tsx
new file mode 100644
index 0000000..62a997d
--- /dev/null
+++ b/src/module/_global/layout/layout_drawer.tsx
@@ -0,0 +1,20 @@
+import { Box, Drawer, Text } from '@mantine/core';
+import React from 'react';
+import { WARNA } from '../fun/WARNA';
+
+export default function LayoutDrawer({ opened, onClose, title, children }: { children: React.ReactNode, opened: boolean, onClose: () => void, title: React.ReactNode }) {
+ return (
+
+ {title}} onClose={onClose} position={"bottom"} size={"35%"}
+ styles={{
+ content: {
+ backgroundColor: "white",
+ borderRadius: "20px 20px 0px 0px",
+ },
+ }}
+ >
+ {children}
+
+
+ );
+}
diff --git a/src/module/_global/layout/layout_navbar_home.tsx b/src/module/_global/layout/layout_navbar_home.tsx
index 66d22c5..fa35cd1 100644
--- a/src/module/_global/layout/layout_navbar_home.tsx
+++ b/src/module/_global/layout/layout_navbar_home.tsx
@@ -4,16 +4,15 @@ import { WARNA } from '../fun/WARNA';
export const LayoutNavbarHome = ({ children }: { children: React.ReactNode }) => {
return (
- <>
-
{children}
-
);
}
export default LayoutNavbarHome
\ No newline at end of file
diff --git a/src/module/_global/val/idDrawer.ts b/src/module/_global/val/idDrawer.ts
new file mode 100644
index 0000000..eee0f26
--- /dev/null
+++ b/src/module/_global/val/idDrawer.ts
@@ -0,0 +1,5 @@
+'use client'
+
+import { atom } from "jotai"
+
+export const isDrawer = atom(false)
diff --git a/src/module/group/components/list_group.tsx b/src/module/group/components/list_group.tsx
new file mode 100644
index 0000000..a91983c
--- /dev/null
+++ b/src/module/group/components/list_group.tsx
@@ -0,0 +1,80 @@
+import { WARNA } from '@/module/_global';
+import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
+import React from 'react';
+import { HiOutlineOfficeBuilding } from 'react-icons/hi';
+import { HiMagnifyingGlass } from 'react-icons/hi2';
+
+const dataGroup = [
+ {
+ id: 1,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 2,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 3,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 4,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 5,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 6,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 7,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+ {
+ id: 8,
+ name: 'Lembaga Pengkreditan Desa'
+ },
+]
+
+export default function ListGroup() {
+ return (
+
+ }
+ placeholder="Pencarian"
+ />
+ {dataGroup.map((v, i) => {
+ return (
+
+
+
+
+
+
+
+
+ {v.name}
+
+
+
+ )
+ })}
+
+ );
+}
diff --git a/src/module/group/components/ui/drawer_group.tsx b/src/module/group/components/ui/drawer_group.tsx
new file mode 100644
index 0000000..02c708c
--- /dev/null
+++ b/src/module/group/components/ui/drawer_group.tsx
@@ -0,0 +1,62 @@
+import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
+import { Box, Button, Center, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
+import { useAtom } from 'jotai';
+import React, { useState } from 'react';
+import { IoAddCircle } from "react-icons/io5";
+
+export default function DrawerGroup() {
+ const [openDrawerGroup, setOpenDrawerGroup] = useState(false)
+ const [openDrawer, setOpenDrawer] = useAtom(isDrawer)
+
+ function onCLose() {
+ setOpenDrawerGroup(false)
+ setOpenDrawer(false)
+ }
+ return (
+
+
+ setOpenDrawerGroup(true)}
+ >
+
+
+
+
+
+ Tambah Group
+
+
+
+
+ setOpenDrawerGroup(false)} title={'TAMBAH GRUP'}>
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/module/group/components/ui/navbar_group.tsx b/src/module/group/components/ui/navbar_group.tsx
new file mode 100644
index 0000000..06f28f9
--- /dev/null
+++ b/src/module/group/components/ui/navbar_group.tsx
@@ -0,0 +1,38 @@
+"use client"
+import { isDrawer, LayoutDrawer, LayoutIconBack, LayoutNavbarHome, WARNA } from '@/module/_global';
+import { ActionIcon, Box, Drawer, Grid, Group, Text } from '@mantine/core';
+import { useAtom } from 'jotai';
+import { useRouter } from 'next/navigation';
+import React, { useState } from 'react';
+import { HiMenu } from "react-icons/hi";
+import DrawerGroup from './drawer_group';
+
+export default function NavbarGroup() {
+ const [openDrawer, setOpenDrawer] = useAtom(isDrawer)
+ const router = useRouter()
+ return (
+ <>
+
+
+
+
+
+
+ GROUP
+
+
+
+ setOpenDrawer(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
+
+
+
+
+
+
+ setOpenDrawer(false)}>
+
+
+
+ );
+}
+
diff --git a/src/module/group/index.ts b/src/module/group/index.ts
index e69de29..0fac4e6 100644
--- a/src/module/group/index.ts
+++ b/src/module/group/index.ts
@@ -0,0 +1,3 @@
+import ViewGroup from "./view/view_group";
+
+export {ViewGroup}
\ No newline at end of file
diff --git a/src/module/group/view/view_group.tsx b/src/module/group/view/view_group.tsx
new file mode 100644
index 0000000..718ffac
--- /dev/null
+++ b/src/module/group/view/view_group.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import NavbarGroup from '../components/ui/navbar_group';
+import { Box } from '@mantine/core';
+import ListGroup from '../components/list_group';
+
+export default function ViewGroup() {
+ return (
+
+
+
+
+ );
+}
+
diff --git a/src/module/notification/components/list_notification.tsx b/src/module/notification/components/list_notification.tsx
index f62834f..fec0182 100644
--- a/src/module/notification/components/list_notification.tsx
+++ b/src/module/notification/components/list_notification.tsx
@@ -1,6 +1,6 @@
"use client"
import { WARNA } from '@/module/_global';
-import { ActionIcon, Box, Center, Grid, Group, ScrollArea, Text } from '@mantine/core';
+import { ActionIcon, Box, Center, Grid, Group, Text } from '@mantine/core';
import { useRouter } from 'next/navigation';
import React from 'react';
import { HiUser } from 'react-icons/hi2';
diff --git a/src/module/notification/components/ui/navbar_notification.tsx b/src/module/notification/components/ui/navbar_notification.tsx
index 55e6a4b..04dde38 100644
--- a/src/module/notification/components/ui/navbar_notification.tsx
+++ b/src/module/notification/components/ui/navbar_notification.tsx
@@ -7,7 +7,6 @@ import React from 'react';
export default function NavbarNotification() {
const router = useRouter()
return (
-
@@ -19,7 +18,6 @@ export default function NavbarNotification() {
-
);
}
diff --git a/src/module/notification/view/view_notification.tsx b/src/module/notification/view/view_notification.tsx
index 11b4d27..8716ba6 100644
--- a/src/module/notification/view/view_notification.tsx
+++ b/src/module/notification/view/view_notification.tsx
@@ -1,5 +1,5 @@
import { LayoutIconBack, LayoutNavbarHome } from '@/module/_global'
-import { Box, Grid, ScrollArea, Text } from '@mantine/core'
+import { Box, Grid, Text } from '@mantine/core'
import React from 'react'
import NavbarNotification from '../components/ui/navbar_notification'
import ListNotification from '../components/list_notification'
@@ -8,11 +8,9 @@ export default function ViewNotification() {
return (
-
-
-
-
-
+
+
+
)
}