Merge pull request #16 from bipproduction/amalia/4-jul-24

Amalia/4 jul 24

package.json

@@ -35,7 +35,6 @@
     "dayjs": "^1.11.11",
     "embla-carousel-autoplay": "^7.1.0",
     "embla-carousel-react": "^7.1.0",
-    "jotai": "^2.8.4",
     "lodash": "^4.17.21",
     "next": "14.2.4",
     "react": "^18",

src/module/_global/index.ts

@@ -4,7 +4,7 @@ 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";
+import { isDrawer } from "./val/isDrawer";
 
 export { WARNA }
 export { LayoutLogin }

src/module/_global/val/idDrawer.ts

@@ -1,5 +0,0 @@
-'use client'
-
-import { atom } from "jotai"
-
-export const isDrawer = atom(false)

src/module/_global/val/isDrawer.ts

@@ -0,0 +1,4 @@
+'use client'
+import { hookstate } from '@hookstate/core';
+
+export const isDrawer = hookstate(false)

src/module/group/components/ui/drawer_group.tsx

@@ -1,16 +1,16 @@
 import { isDrawer, LayoutDrawer, WARNA } from '@/module/_global';
+import { useHookstate } from '@hookstate/core';
 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)
+  const openDrawer = useHookstate(isDrawer)
 
   function onCLose() {
     setOpenDrawerGroup(false)
-    setOpenDrawer(false)
+    openDrawer.set(false)
   }
   return (
     <Box>
@@ -55,7 +55,7 @@ export default function DrawerGroup() {
               MASUK
             </Button>
           </Box>
-          </Box>
+        </Box>
       </LayoutDrawer>
     </Box>
   );

src/module/group/components/ui/navbar_group.tsx

@@ -1,14 +1,14 @@
 "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 React from 'react';
 import { HiMenu } from "react-icons/hi";
 import DrawerGroup from './drawer_group';
+import { useHookstate } from '@hookstate/core';
 
 export default function NavbarGroup() {
-  const [openDrawer, setOpenDrawer] = useAtom(isDrawer)
+  const openDrawer = useHookstate(isDrawer)
   const router = useRouter()
   return (
     <>
@@ -22,14 +22,14 @@ export default function NavbarGroup() {
           </Grid.Col>
           <Grid.Col span="auto">
             <Group justify='flex-end'>
-              <ActionIcon onClick={() => setOpenDrawer(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
+              <ActionIcon onClick={() => openDrawer.set(true)} variant="light" bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
                 <HiMenu size={20} color='white' />
               </ActionIcon>
             </Group>
           </Grid.Col>
         </Grid>
       </LayoutNavbarHome>
-      <LayoutDrawer opened={openDrawer} title={'MENU'} onClose={() => setOpenDrawer(false)}>
+      <LayoutDrawer opened={openDrawer.get()} title={'MENU'} onClose={() => openDrawer.set(false)}>
         <DrawerGroup />
       </LayoutDrawer>
     </>

yarn.lock

@@ -2270,11 +2270,6 @@ jiti@^1.21.0:
   resolved "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz"
   integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==
 
-jotai@^2.8.4:
-  version "2.8.4"
-  resolved "https://registry.yarnpkg.com/jotai/-/jotai-2.8.4.tgz#ea82b013d640016100e360d19d565862816c96d0"
-  integrity sha512-f6jwjhBJcDtpeauT2xH01gnqadKEySwwt1qNBLvAXcnojkmb76EdqRt05Ym8IamfHGAQz2qMKAwftnyjeSoHAA==
-
 "js-tokens@^3.0.0 || ^4.0.0":
   version "4.0.0"
   resolved "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"