upd: read all notif
Deskripsi: - update disable button saat tidak ada notifikasi yg blm terbaca No Issues
This commit is contained in:
@@ -2,14 +2,19 @@
|
|||||||
import { TEMA } from '@/module/_global';
|
import { TEMA } from '@/module/_global';
|
||||||
import { useHookstate } from '@hookstate/core';
|
import { useHookstate } from '@hookstate/core';
|
||||||
import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
|
import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||||
|
import { useShallowEffect } from '@mantine/hooks';
|
||||||
|
import { useState } from 'react';
|
||||||
import toast from 'react-hot-toast';
|
import toast from 'react-hot-toast';
|
||||||
import { LuCheckCheck } from 'react-icons/lu';
|
import { LuCheckCheck } from 'react-icons/lu';
|
||||||
|
import { funGetHome } from '../lib/api_home';
|
||||||
import { funReadAllNotification } from '../lib/api_notification';
|
import { funReadAllNotification } from '../lib/api_notification';
|
||||||
import { globalRefreshNotif } from '../lib/val_home';
|
import { globalRefreshNotif } from '../lib/val_home';
|
||||||
|
|
||||||
export default function DrawerNotification({ onDone }: { onDone: () => void }) {
|
export default function DrawerNotification({ onDone }: { onDone: () => void }) {
|
||||||
const tema = useHookstate(TEMA)
|
const tema = useHookstate(TEMA)
|
||||||
const reloadNotif = useHookstate(globalRefreshNotif)
|
const reloadNotif = useHookstate(globalRefreshNotif)
|
||||||
|
const [disabled, setDisabled] = useState(false)
|
||||||
|
const [notif, setNotif] = useState(0)
|
||||||
|
|
||||||
async function handleReadAll() {
|
async function handleReadAll() {
|
||||||
try {
|
try {
|
||||||
@@ -28,18 +33,39 @@ export default function DrawerNotification({ onDone }: { onDone: () => void }) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const fetchData = async () => {
|
||||||
|
try {
|
||||||
|
setDisabled(true)
|
||||||
|
const response = await funGetHome('?cat=header')
|
||||||
|
if (response.success) {
|
||||||
|
setNotif(response.data.totalNotif)
|
||||||
|
if (response.data.totalNotif > 0) {
|
||||||
|
setDisabled(false)
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
toast.error(response.message);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
toast.error("Gagal mendapatkan data, coba lagi nanti");
|
||||||
|
console.error(error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useShallowEffect(() => {
|
||||||
|
fetchData();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box>
|
<Box>
|
||||||
<Stack pt={10}>
|
<Stack pt={10}>
|
||||||
<SimpleGrid
|
<SimpleGrid cols={{ base: 3, sm: 3, lg: 3 }} >
|
||||||
cols={{ base: 3, sm: 3, lg: 3 }}
|
<Flex onClick={() => { !disabled && handleReadAll() }} justify={'center'} align={'center'} direction={'column'} >
|
||||||
>
|
|
||||||
<Flex onClick={() => { handleReadAll() }} justify={'center'} align={'center'} direction={'column'} >
|
|
||||||
<Box>
|
<Box>
|
||||||
<LuCheckCheck size={30} color={tema.get().utama} />
|
<LuCheckCheck size={30} color={disabled ? 'gray' : tema.get().utama} />
|
||||||
</Box>
|
</Box>
|
||||||
<Box>
|
<Box>
|
||||||
<Text c={tema.get().utama} ta={"center"}>Tandai Dibaca Semua</Text>
|
<Text c={disabled ? 'gray' : tema.get().utama} ta={"center"}>Tandai Dibaca Semua</Text>
|
||||||
</Box>
|
</Box>
|
||||||
</Flex>
|
</Flex>
|
||||||
</SimpleGrid>
|
</SimpleGrid>
|
||||||
|
|||||||
Reference in New Issue
Block a user