TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix loading animation in manage group

Browse Source
This commit is contained in:
Raja Oktafrianto
2025-04-28 14:48:20 +07:00
parent de0f4e594a
commit 254d168396
2 changed files with 17 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/pages/groups/ManageGroups.tsx
View File

@ -24,7 +24,7 @@ import CloseIcon from '@mui/icons-material/Close';
import Divider from '@mui/material/Divider';
import ConfirmDialog from '@/components/confirm';
import { toast } from 'sonner';
import { Container, DataGridProvider, LoaderTransparant } from '@/components';
import { Container, DataGridLoader, DataGridProvider, LoaderTransparant } from '@/components';
import { ListToolBar } from './ListToolbar';
import { RefreshCw } from 'lucide-react';
import { setgroups } from 'process';
@ -54,16 +54,15 @@ const ManageGroups = () => {
const [isReloading, setIsReloading] = useState(false);
// const closeDialog = () => {
// setIsDialogOpen(false);
// setgroups(initGroup);
// setgroups(initGroup);
// };
useEffect(() => {
setLoading(true);
fetchGroups();
setLoading(false);
fetchGroups();
}, []);
async function fetchGroups(): Promise<void> {
setIsReloading(true);
try {
let groups = await axios.get(`${BASE_URL}/groups/list`, {
params: {
@ -88,7 +87,7 @@ const ManageGroups = () => {
alert(error.message);
console.log(error);
} finally {
setLoading(false);
// setLoading(false);
setIsReloading(false);
}
}
@ -150,6 +149,7 @@ const ManageGroups = () => {
};
const handleYes = async () => {
setIsReloading(true);
try {
if (dialogType === 'create') {
await axios.post(`${BASE_URL}/groups/create`, {
@ -223,14 +223,15 @@ const ManageGroups = () => {
<div className="grid gap-5 lg:gap-7.5 mt-5 relative">
{isReloading && (
<div className="fixed inset-0 bg-white/25 flex items-center justify-center z-50 text-muted-foreground px-4 py-2">
<div className="bg-card flex items-center border shadow-sm rounded-md">
<div className="flex flex-col items-center">
<RefreshCw className="animate-spin h-8 w-8 text-slate-500 mb-2" />
<span className="text-slate-500 font-medium">Refreshing data...</span>
</div>
</div>
</div>
<DataGridLoader />
// <div className="fixed inset-0 bg-white/25 flex items-center justify-center z-50 text-muted-foreground px-4 py-2">
// <div className="bg-card flex items-center border shadow-sm rounded-md">
// <div className="flex flex-col items-center">
// <RefreshCw className="animate-spin h-8 w-8 text-slate-500 mb-2" />
// <span className="text-slate-500 font-medium">Refreshing data...</span>
// </div>
// </div>
// </div>
)}
<DataGridProvider
data={dataGroup}