delete form , waiting for API

src/components/dashboard/admin-setting/Form/DeleteForm.jsx

@@ -0,0 +1,67 @@
+import {useTranslations} from "next-intl";
+import {useState} from "react";
+import {
+    Button,
+    Dialog,
+    DialogActions,
+    DialogContent,
+    DialogTitle,
+    IconButton,
+    Tooltip,
+    Typography
+} from "@mui/material";
+import DeleteIcon from '@mui/icons-material/Delete';
+import {DELETE_ADMIN_SETTING} from "@/core/data/apiRoutes";
+import useRequest from "@/lib/app/hooks/useRequest";
+import useNotification from "@/lib/app/hooks/useNotification";
+
+const Delete = ({rowId, mutate}) => {
+    const t = useTranslations();
+    const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
+    const [isSubmitting, setIsSubmitting] = useState(false)
+    const requestServer = useRequest({auth: true})
+    const {update_notification} = useNotification()
+    const handleSubmit = () => {
+        setIsSubmitting(true)
+        requestServer(`${DELETE_ADMIN_SETTING}/${rowId}`, 'delete').then((response) => {
+            mutate()
+            update_notification()
+        }).catch(() => {
+        }).finally(() => {
+            setIsSubmitting(false)
+        });
+    }
+
+    return (
+        <>
+            <Tooltip title={t("DeleteDialog.delete")}>
+                <IconButton
+                    color="primary"
+                    onClick={() => {
+                        setOpenConfirmDialog(true)
+                    }}
+                >
+                    <DeleteIcon/>
+                </IconButton>
+            </Tooltip>
+            <Dialog maxWidth="sm" open={openConfirmDialog}
+                    PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
+                <DialogTitle>{t("DeleteDialog.delete")}</DialogTitle>
+                <DialogContent>
+                    <Typography>{t("DeleteDialog.typography")}</Typography>
+                </DialogContent>
+                <DialogActions>
+                    <Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
+                            disabled={isSubmitting} autoFocus>
+                        {t("DeleteDialog.button-cancel")}
+                    </Button>
+                    <Button onClick={handleSubmit} variant="contained" color="primary"
+                            disabled={isSubmitting}>
+                        {t("DeleteDialog.button-delete")}
+                    </Button>
+                </DialogActions>
+            </Dialog>
+        </>
+    );
+};
+export default Delete;

src/components/dashboard/admin-setting/TableRowActions.jsx

@@ -1,5 +1,6 @@
 import {Box} from "@mui/material";
 import Update from "src/components/dashboard/admin-setting/Form/UpdateForm";
+import Delete from "@/components/dashboard/admin-setting/Form/DeleteForm";
 
 const TableRow = ({row, mutate}) => {
     return (
@@ -8,6 +9,10 @@ const TableRow = ({row, mutate}) => {
                 row={row}
                 mutate={mutate}
             />
+            <Delete
+                rowId={row.getValue("id")}
+                mutate={mutate}
+            />
         </Box>
     );
 };

src/components/dashboard/admin-setting/index.jsx

@@ -15,8 +15,8 @@ function DashboardAdminSettingComponent() {
                 id: "id",
                 header: t("AdminSetting.id"),
                 enableColumnFilter: true,
-                datatype: "text",
-                filterFn: "contains",
+                datatype: "number",
+                filterFn: "equals",
                 columnFilterModeOptions: ["contains", "equals", "notEquals"],
                 Cell: ({renderedCellValue}) => (
                     <Typography variant="body2">{renderedCellValue}</Typography>
@@ -29,7 +29,7 @@ function DashboardAdminSettingComponent() {
                 enableColumnFilter: true,
                 datatype: "text",
                 filterFn: "contains",
-                columnFilterModeOptions: ["contains", "equals", "notEquals"],
+                columnFilterModeOptions: ["contains", "equals"],
                 Cell: ({renderedCellValue}) => (
                     <Typography variant="body2">{renderedCellValue}</Typography>
                 ),
@@ -52,19 +52,9 @@ function DashboardAdminSettingComponent() {
         ],
         []
     );
-    const data = [{
-        id: 1,
-        name: "amin",
-        value: "hi"
-    }, {
-        id: 1,
-        name: "amin",
-        value: "hi"
-    }]
     return (
         <Box sx={{px: 3}}>
             <DataTable
-                data={data}
                 tableUrl={GET_ADMIN_SETTING}
                 columns={columns}
                 selectableRow={false}

src/core/data/apiRoutes.js

@@ -235,9 +235,10 @@ export const GET_HISTORY_DETAIL = BASE_URL + "/dashboard/navgan_loans"
 export const EXPORT_LOAN_HISTORY = BASE_URL + "/dashboard/navgan_loans/export"
 
 //admin setting
-export const GET_ADMIN_SETTING = BASE_URL + ""
-export const ADD_ADMIN_SETTING = BASE_URL + ""
-export const UPDATE_ADMIN_SETTING = BASE_URL + ""
+export const GET_ADMIN_SETTING = BASE_URL + "/dashboard/settings/show"
+export const ADD_ADMIN_SETTING = BASE_URL + "/dashboard/settings/store"
+export const UPDATE_ADMIN_SETTING = BASE_URL + "/dashboard/settings/update"
+export const DELETE_ADMIN_SETTING = BASE_URL + "/dashboard/settings/delete"
 
 // loan statistics
 export const GET_LOAN_STATISTICS = BASE_URL + "/dashboard/reports/navgan/statistics"

src/core/data/sidebarMenu.jsx

@@ -207,7 +207,7 @@ const sidebarMenu = [
             route: "/dashboard/admin-setting",
             icon: <SettingsIcon sx={{width: 'inherit', height: 'inherit'}}/>,
             selected: false,
-            permissions: ["manage_roles"],
+            permissions: ["view_settings"],
         }
     ],
 ];

src/pages/dashboard/admin-setting/index.jsx

@@ -15,7 +15,7 @@ export async function getServerSideProps({req, locale}) {
             title: "Dashboard.admin_setting",
             isBot,
             locale,
-            layout: {name: 'DashboardLayout'}
+            layout: {name: 'DashboardLayout', props: {permissions: ["view_settings"]}}
         },
     };
 }