[WIP] Add Claim Request

frontend/hospital-portal/src/components/BasePagination.tsx

@@ -1,6 +1,6 @@
 import { Pagination } from "@mui/material";
 import { Box } from "@mui/system";
-import { LaravelPaginatedData } from "../@types/paginated-data";
+import { LaravelPaginatedData } from "@/@types/paginated-data";
 
 
 export interface Props {

frontend/hospital-portal/src/components/BaseTablePagination.tsx

@@ -0,0 +1,25 @@
+/* ---------------------------------- @mui ---------------------------------- */
+import { TablePagination, TablePaginationProps } from '@mui/material';
+import { Box } from '@mui/system';
+
+export default function BaseTablePagination({
+  count,
+  onPageChange,
+  page,
+  rowsPerPage,
+  onRowsPerPageChange,
+}: TablePaginationProps) {
+  return (
+    <Box>
+      <TablePagination
+        component="div"
+        rowsPerPageOptions={[10, 25]}
+        count={count}
+        page={page}
+        onPageChange={onPageChange}
+        rowsPerPage={rowsPerPage}
+        onRowsPerPageChange={onRowsPerPageChange}
+      />
+    </Box>
+  );
+}

frontend/hospital-portal/src/components/LaravelTable.tsx

@@ -1,5 +1,5 @@
 import { Card, Paper, TableContainer } from "@mui/material";
-import { LaravelPaginatedData } from "../@types/paginated-data";
+import { LaravelPaginatedData } from "@/@types/paginated-data";
 import BasePagination from "./BasePagination";
 
 type LaravelTableProps = {

frontend/hospital-portal/src/components/MyDropzone.tsx

@@ -4,7 +4,7 @@ import { useDropzone } from 'react-dropzone';
 import { Box, Stack, Typography } from '@mui/material';
 import BlockContent from './upload/BlockContent';
 import { styled } from '@mui/material/styles';
-import { UploadIllustration } from '../assets';
+import { UploadIllustration } from '@/assets';
 
 const DropZoneStyle = styled('div')(({ theme }) => ({
   outline: 'none',

frontend/hospital-portal/src/components/ThemeColorPresets.tsx

@@ -2,9 +2,9 @@ import { ReactNode, useMemo } from 'react';
 // @mui
 import { alpha, ThemeProvider, createTheme, useTheme } from '@mui/material/styles';
 // hooks
-import useSettings from '../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 //
-import componentsOverride from '../theme/overrides';
+import componentsOverride from '@/theme/overrides';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/UploadImage.tsx

@@ -4,7 +4,7 @@ import { useDropzone } from 'react-dropzone';
 import { Box, Stack, Typography } from '@mui/material';
 import BlockContent from './upload/BlockContent';
 import { styled } from '@mui/material/styles';
-import { UploadIllustration } from '../assets';
+import { UploadIllustration } from '@/assets';
 import Iconify from './Iconify';
 
 const RootStyle = styled('div')(({ theme }) => ({

frontend/hospital-portal/src/components/chart/ChartStyle.tsx

@@ -2,7 +2,7 @@
 import { alpha, useTheme } from '@mui/material/styles';
 import { GlobalStyles } from '@mui/material';
 // utils
-import cssStyles from '../../utils/cssStyles';
+import cssStyles from '@/utils/cssStyles';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/hook-form/RHFDatepicker.tsx

@@ -11,7 +11,7 @@ import { DesktopDatePicker } from '@mui/x-date-pickers/DesktopDatePicker';
 
 import InputAdornment from '@mui/material/InputAdornment';
 import EventIcon from '@mui/icons-material/Event';
-import { fPostFormat } from '../../utils/formatTime';
+import { fPostFormat } from '@/utils/formatTime';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/nav-section/horizontal/NavItem.tsx

@@ -3,11 +3,11 @@ import { NavLink as RouterLink } from 'react-router-dom';
 // @mui
 import { Box, Link } from '@mui/material';
 // config
-import { ICON } from '../../../config';
+import { ICON } from '@/config';
 // type
-import { NavItemProps } from '../type';
+import { NavItemProps } from '@/type';
 //
-import Iconify from '../../Iconify';
+import Iconify from '@/components/Iconify';
 import { ListItemStyle } from './style';
 import { isExternalLink } from '..';
 

frontend/hospital-portal/src/components/nav-section/horizontal/NavList.tsx

@@ -1,7 +1,7 @@
 import { useState, useEffect, useRef } from 'react';
 import { useLocation } from 'react-router-dom';
 // type
-import { NavListProps } from '../type';
+import { NavListProps } from '@/type';
 //
 import { NavItemRoot, NavItemSub } from './NavItem';
 import { PaperStyle } from './style';

frontend/hospital-portal/src/components/nav-section/horizontal/index.tsx

@@ -2,7 +2,7 @@ import { memo } from 'react';
 // @mui
 import { Stack } from '@mui/material';
 // type
-import { NavSectionProps } from '../type';
+import { NavSectionProps } from '@/type';
 //
 import { NavListRoot } from './NavList';
 

frontend/hospital-portal/src/components/nav-section/horizontal/style.ts

@@ -3,7 +3,7 @@ import { ReactNode } from 'react';
 import { alpha, styled } from '@mui/material/styles';
 import { Button, Popover, ButtonProps, LinkProps } from '@mui/material';
 // config
-import { NAVBAR } from '../../../config';
+import { NAVBAR } from '@/config';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/settings/SettingColorPresets.tsx

@@ -2,7 +2,7 @@
 import { alpha, styled } from '@mui/material/styles';
 import { Box, Grid, RadioGroup, CardActionArea } from '@mui/material';
 // hooks
-import useSettings from '../../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 //
 import { BoxMask } from '.';
 

frontend/hospital-portal/src/components/settings/SettingDirection.tsx

@@ -2,9 +2,9 @@
 import { styled } from '@mui/material/styles';
 import { Grid, RadioGroup, CardActionArea } from '@mui/material';
 // hooks
-import useSettings from '../../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 //
-import Iconify from '../Iconify';
+import Iconify from '@/components/Iconify';
 import { BoxMask } from '.';
 
 // ----------------------------------------------------------------------

frontend/hospital-portal/src/components/settings/SettingFullscreen.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react';
 import { alpha } from '@mui/material/styles';
 import { Button } from '@mui/material';
 // components
-import Iconify from '../Iconify';
+import Iconify from '@/components/Iconify';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/settings/SettingLayout.tsx

@@ -2,7 +2,7 @@
 import { styled, alpha } from '@mui/material/styles';
 import { Grid, RadioGroup, CardActionArea, Box, Stack } from '@mui/material';
 // hooks
-import useSettings from '../../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 //
 import { BoxMask } from '.';
 

frontend/hospital-portal/src/components/settings/SettingMode.tsx

@@ -2,9 +2,9 @@
 import { styled } from '@mui/material/styles';
 import { Grid, RadioGroup, CardActionArea } from '@mui/material';
 // hooks
-import useSettings from '../../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 //
-import Iconify from '../Iconify';
+import Iconify from '@/components/Iconify';
 import { BoxMask } from '.';
 
 // ----------------------------------------------------------------------

frontend/hospital-portal/src/components/settings/SettingStretch.tsx

@@ -2,9 +2,9 @@
 import { styled } from '@mui/material/styles';
 import { CardActionArea, Stack } from '@mui/material';
 // hooks
-import useSettings from '../../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 //
-import Iconify from '../Iconify';
+import Iconify from '@/components/Iconify';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/settings/ToggleButton.tsx

@@ -2,10 +2,10 @@
 import { alpha, styled } from '@mui/material/styles';
 import { Tooltip } from '@mui/material';
 // utils
-import cssStyles from '../../utils/cssStyles';
+import cssStyles from '@/utils/cssStyles';
 //
-import Iconify from '../Iconify';
-import { IconButtonAnimate } from '../animate';
+import Iconify from '@/components/Iconify';
+import { IconButtonAnimate } from '@/animate';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/settings/index.tsx

@@ -4,15 +4,15 @@ import { useState, useEffect } from 'react';
 import { alpha, styled } from '@mui/material/styles';
 import { Backdrop, Divider, Typography, Stack, FormControlLabel, Radio } from '@mui/material';
 // hooks
-import useSettings from '../../hooks/useSettings';
+import useSettings from '@/hooks/useSettings';
 // utils
-import cssStyles from '../../utils/cssStyles';
+import cssStyles from '@/utils/cssStyles';
 // config
-import { NAVBAR, defaultSettings } from '../../config';
+import { NAVBAR, defaultSettings } from '@/config';
 //
-import Iconify from '../Iconify';
-import Scrollbar from '../Scrollbar';
-import { IconButtonAnimate, varFade } from '../animate';
+import Iconify from '@/components/Iconify';
+import Scrollbar from '@/Scrollbar';
+import { IconButtonAnimate, varFade } from '@/animate';
 //
 import ToggleButton from './ToggleButton';
 import SettingMode from './SettingMode';

frontend/hospital-portal/src/components/upload/BlockContent.tsx

@@ -1,7 +1,7 @@
 // @mui
 import { Box, Typography, Stack } from '@mui/material';
 // assets
-import { UploadIllustration } from '../../assets';
+import { UploadIllustration } from '@/assets';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/upload/MultiFilePreview.tsx

@@ -4,13 +4,13 @@ import { m, AnimatePresence } from 'framer-motion';
 import { alpha } from '@mui/material/styles';
 import { List, Stack, Button, IconButton, ListItemText, ListItem } from '@mui/material';
 // utils
-import { fData } from '../../utils/formatNumber';
+import { fData } from '@/utils/formatNumber';
 // type
 import { UploadMultiFileProps, CustomFile } from './type';
 //
-import Image from '../Image';
-import Iconify from '../Iconify';
-import { varFade } from '../animate';
+import Image from '@/components/Image';
+import Iconify from '@/components/Iconify';
+import { varFade } from '@/components/animate';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/upload/RejectionFiles.tsx

@@ -5,7 +5,7 @@ import { Box, Paper, Typography } from '@mui/material';
 // type
 import { CustomFile } from './type';
 // utils
-import { fData } from '../../utils/formatNumber';
+import { fData } from '@/utils/formatNumber';
 
 // ----------------------------------------------------------------------
 

frontend/hospital-portal/src/components/upload/UploadAvatar.tsx

@@ -6,8 +6,8 @@ import { styled } from '@mui/material/styles';
 // type
 import { UploadProps } from './type';
 //
-import Image from '../Image';
-import Iconify from '../Iconify';
+import Image from '@/components/Image';
+import Iconify from '@/components/Iconify';
 import RejectionFiles from './RejectionFiles';
 
 // ----------------------------------------------------------------------

frontend/hospital-portal/src/components/upload/UploadSingleFile.tsx

@@ -6,7 +6,7 @@ import { Box } from '@mui/material';
 // type
 import { UploadProps } from './type';
 //
-import Image from '../Image';
+import Image from '@/components/Image';
 import RejectionFiles from './RejectionFiles';
 import BlockContent from './BlockContent';