@campxdev/shared 0.6.17 → 0.6.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (220) hide show
  1. package/.eslintignore +3 -3
  2. package/.eslintrc.js +33 -33
  3. package/.prettierrc +10 -10
  4. package/antd.customize.less +73 -73
  5. package/exports.ts +16 -16
  6. package/package.json +93 -93
  7. package/publish.sh +1 -1
  8. package/src/assets/fonts/avenir/index.ts +2 -2
  9. package/src/assets/fonts/poppins/index.ts +7 -7
  10. package/src/assets/images/index.ts +17 -17
  11. package/src/assets/images/unauth.svg +92 -92
  12. package/src/components/ActionButton.tsx +28 -28
  13. package/src/components/Attachment.tsx +26 -26
  14. package/src/components/AutocompleteSearch/AutocompleteSearch.tsx +57 -57
  15. package/src/components/AutocompleteSearch/index.tsx +1 -1
  16. package/src/components/Breadcrumbs.tsx +72 -72
  17. package/src/components/Card.tsx +98 -98
  18. package/src/components/CardsGrid.tsx +28 -28
  19. package/src/components/ChangePassword.tsx +164 -164
  20. package/src/components/Chips.tsx +81 -81
  21. package/src/components/Detail.tsx +15 -15
  22. package/src/components/DetailsGrid.tsx +52 -52
  23. package/src/components/DividerHeading.tsx +41 -41
  24. package/src/components/DrawerWrapper/DialogWrapper.tsx +63 -63
  25. package/src/components/DrawerWrapper/DrawerTemplate.tsx +53 -53
  26. package/src/components/DrawerWrapper/DrawerWrapper.tsx +53 -53
  27. package/src/components/DropDownButton.tsx +194 -194
  28. package/src/components/ErrorBoundary/ErrorBoundary.tsx +28 -28
  29. package/src/components/ErrorBoundary/ErrorFallback.tsx +236 -236
  30. package/src/components/ErrorBoundary/GlobalNetworkLoadingIndicator.tsx +13 -13
  31. package/src/components/ErrorBoundary/index.tsx +1 -1
  32. package/src/components/ErrorBox.tsx +42 -42
  33. package/src/components/FloatingContainer.tsx +33 -33
  34. package/src/components/Form/Form.tsx +156 -156
  35. package/src/components/Form/RenderForm.tsx +188 -188
  36. package/src/components/FullCalendar/Actions.tsx +162 -162
  37. package/src/components/FullCalendar/FullCalendarWrapper.tsx +54 -54
  38. package/src/components/FullScreenLoader.tsx +19 -19
  39. package/src/components/HookForm/AutoCompleteSearch.tsx +113 -113
  40. package/src/components/HookForm/DatePicker.tsx +65 -65
  41. package/src/components/HookForm/DateTimePicker.tsx +70 -70
  42. package/src/components/HookForm/FormLabel.tsx +14 -14
  43. package/src/components/HookForm/MultiCheckbox.tsx +82 -82
  44. package/src/components/HookForm/MultiSelect.tsx +100 -100
  45. package/src/components/HookForm/RadioGroup.tsx +106 -106
  46. package/src/components/HookForm/SingleCheckbox.tsx +46 -46
  47. package/src/components/HookForm/SingleSelect.tsx +93 -93
  48. package/src/components/HookForm/TextField.tsx +74 -74
  49. package/src/components/HookForm/TimePicker.tsx +82 -82
  50. package/src/components/HookForm/index.ts +23 -23
  51. package/src/components/IconButtons/IconButtons.tsx +137 -137
  52. package/src/components/IconButtons/Icons.tsx +268 -268
  53. package/src/components/IconButtons/assets/edit.svg +4 -4
  54. package/src/components/IconButtons/assets/eye.svg +6 -6
  55. package/src/components/IconButtons/assets/trash.svg +7 -7
  56. package/src/components/IconButtons/index.tsx +8 -8
  57. package/src/components/IconLabel.tsx +37 -37
  58. package/src/components/Image/Image.tsx +43 -43
  59. package/src/components/Image/index.tsx +1 -1
  60. package/src/components/ImageUpload.tsx +98 -98
  61. package/src/components/Input/AutoCompleteSearch.tsx +113 -113
  62. package/src/components/Input/DatePicker.tsx +60 -60
  63. package/src/components/Input/DateRangePicker.tsx +131 -131
  64. package/src/components/Input/DateTimePicker.tsx +70 -70
  65. package/src/components/Input/FormLabel.tsx +14 -14
  66. package/src/components/Input/MultiCheckbox.tsx +79 -79
  67. package/src/components/Input/MultiSelect.tsx +52 -52
  68. package/src/components/Input/RadioGroup.tsx +61 -61
  69. package/src/components/Input/SingleCheckbox.tsx +23 -23
  70. package/src/components/Input/SingleSelect.tsx +124 -124
  71. package/src/components/Input/TextField.tsx +50 -50
  72. package/src/components/Input/TimePicker.tsx +82 -82
  73. package/src/components/Input/index.ts +26 -26
  74. package/src/components/JsonPreview/JsonPreview.tsx +7 -7
  75. package/src/components/JsonPreview/index.tsx +1 -1
  76. package/src/components/LabelValue/LabelValue.tsx +21 -21
  77. package/src/components/LabelValue/index.tsx +1 -1
  78. package/src/components/Layout/ChangePassword.tsx +49 -49
  79. package/src/components/Layout/Header/AppHeader.tsx +124 -124
  80. package/src/components/Layout/Header/AppsMenu.tsx +92 -92
  81. package/src/components/Layout/Header/CogWheelMenu.tsx +33 -33
  82. package/src/components/Layout/Header/FreshDeskHelpButton.tsx +19 -19
  83. package/src/components/Layout/Header/Notification.tsx +13 -13
  84. package/src/components/Layout/Header/UserBox.tsx +70 -70
  85. package/src/components/Layout/Header/applications.ts +90 -90
  86. package/src/components/Layout/Header/assets/campx.svg +29 -29
  87. package/src/components/Layout/Header/assets/index.ts +29 -32
  88. package/src/components/Layout/Header/assets/newAssets/campx_square_small.svg +9 -9
  89. package/src/components/Layout/Header/assets/newAssets/commutex.svg +14 -14
  90. package/src/components/Layout/Header/assets/newAssets/commutexSmall.svg +11 -11
  91. package/src/components/Layout/Header/assets/newAssets/enroll.svg +14 -14
  92. package/src/components/Layout/Header/assets/newAssets/enrollx.svg +14 -14
  93. package/src/components/Layout/Header/assets/newAssets/exams_small.svg +12 -12
  94. package/src/components/Layout/Header/assets/newAssets/examsx.svg +14 -14
  95. package/src/components/Layout/Header/assets/newAssets/hostel_small.svg +13 -13
  96. package/src/components/Layout/Header/assets/newAssets/hostelx.svg +13 -13
  97. package/src/components/Layout/Header/assets/newAssets/libraryx.svg +12 -12
  98. package/src/components/Layout/Header/assets/newAssets/pay_small.svg +16 -16
  99. package/src/components/Layout/Header/assets/newAssets/payx.svg +19 -19
  100. package/src/components/Layout/Header/assets/newAssets/people_small.svg +9 -9
  101. package/src/components/Layout/Header/assets/newAssets/peoplex.svg +12 -12
  102. package/src/components/Layout/Header/assets/newAssets/squarex.svg +12 -12
  103. package/src/components/Layout/Header/assets/payxHeader.svg +21 -21
  104. package/src/components/Layout/Header/assets/peoplexHeader.svg +14 -14
  105. package/src/components/Layout/Header/icons.tsx +57 -57
  106. package/src/components/Layout/Header/index.tsx +1 -1
  107. package/src/components/Layout/Header/styles.tsx +98 -98
  108. package/src/components/LayoutWrapper.tsx +25 -25
  109. package/src/components/LinearProgress.tsx +19 -19
  110. package/src/components/ListItemButton.tsx +94 -94
  111. package/src/components/LoginForm.tsx +103 -103
  112. package/src/components/MediaRow/MediaRow.tsx +69 -69
  113. package/src/components/MediaRow/index.tsx +1 -1
  114. package/src/components/MenuButton.tsx +103 -103
  115. package/src/components/ModalButtons/DialogButton.tsx +88 -88
  116. package/src/components/ModalButtons/DrawerButton.tsx +89 -89
  117. package/src/components/ModalButtons/index.tsx +4 -4
  118. package/src/components/NoDataIllustration/NoDataIllustration.tsx +32 -32
  119. package/src/components/NoDataIllustration/index.tsx +1 -1
  120. package/src/components/PageContent.tsx +17 -17
  121. package/src/components/PageHeader.tsx +52 -52
  122. package/src/components/PageNotFound.tsx +26 -26
  123. package/src/components/PopupConfirm/ConfirmContextProvider.tsx +40 -40
  124. package/src/components/PopupConfirm/PopupConfirm.tsx +34 -34
  125. package/src/components/PopupConfirm/index.tsx +1 -1
  126. package/src/components/PopupConfirm/useConfirm.ts +47 -47
  127. package/src/components/Router.tsx +7 -7
  128. package/src/components/Row/Row.tsx +24 -24
  129. package/src/components/Row/index.tsx +1 -1
  130. package/src/components/SearchBar/SearchBar.tsx +53 -53
  131. package/src/components/SearchBar/index.tsx +1 -1
  132. package/src/components/SideMenuHeader.tsx +29 -29
  133. package/src/components/SideNav.tsx +168 -168
  134. package/src/components/Spinner.tsx +18 -18
  135. package/src/components/StepsHeader/StepsHeader.tsx +115 -115
  136. package/src/components/StepsHeader/index.tsx +1 -1
  137. package/src/components/StyledTableContainer.tsx +33 -33
  138. package/src/components/SwitchButton/SwitchButton.tsx +41 -41
  139. package/src/components/SwitchButton/index.tsx +1 -1
  140. package/src/components/Table.tsx +42 -42
  141. package/src/components/TableComponent/BatchActionsHeader.tsx +58 -58
  142. package/src/components/TableComponent/Icons/index.tsx +50 -50
  143. package/src/components/TableComponent/ReactTable.tsx +293 -293
  144. package/src/components/TableComponent/RenderTableBody.tsx +64 -64
  145. package/src/components/TableComponent/TableFooter/TableFooter.tsx +102 -102
  146. package/src/components/TableComponent/TableFooter/index.tsx +1 -1
  147. package/src/components/TableComponent/TableFooter/styles.tsx +28 -28
  148. package/src/components/TableComponent/index.tsx +226 -226
  149. package/src/components/TableComponent/react-table-config.d.ts +128 -128
  150. package/src/components/TableComponent/styles.tsx +173 -173
  151. package/src/components/TableComponent/types.ts +57 -57
  152. package/src/components/Tabs/Tabs.tsx +52 -52
  153. package/src/components/Tabs/TabsContainer.tsx +50 -50
  154. package/src/components/Tabs/index.tsx +1 -1
  155. package/src/components/Tabs/styles.tsx +55 -55
  156. package/src/components/ToastContainer/ToastContainer.tsx +42 -42
  157. package/src/components/ToastContainer/index.tsx +1 -1
  158. package/src/components/UploadButton/UploadButton.tsx +126 -126
  159. package/src/components/UploadButton/index.tsx +1 -1
  160. package/src/components/UploadButton/types.ts +19 -19
  161. package/src/components/UploadDocument/UploadDocument.tsx +108 -108
  162. package/src/components/UploadDocument/index.tsx +1 -1
  163. package/src/components/UploadFileDialog/AnimatedUploadFile.gif +0 -0
  164. package/src/components/UploadFileDialog/UploadFileDialog.tsx +238 -240
  165. package/src/components/UploadFileDialog/index.tsx +1 -1
  166. package/src/components/index.ts +86 -86
  167. package/src/config/axios.ts +74 -74
  168. package/src/config/axiosXTenant.ts +57 -57
  169. package/src/constants/UIConstants.ts +97 -97
  170. package/src/constants/formValidations.ts +6 -6
  171. package/src/constants/index.ts +5 -5
  172. package/src/constants/isDevelopment.ts +3 -3
  173. package/src/constants/permissions.ts +67 -67
  174. package/src/constants/validateMessages.ts +12 -12
  175. package/src/contexts/LoginFormProvider.tsx +39 -39
  176. package/src/contexts/Providers.tsx +59 -59
  177. package/src/contexts/QueryClientProvider.tsx +22 -22
  178. package/src/hooks/index.ts +3 -3
  179. package/src/hooks/useAppInit.ts +33 -33
  180. package/src/hooks/useAuth.ts +91 -91
  181. package/src/hooks/useFetch.ts +53 -53
  182. package/src/hooks/useRouter.ts +31 -31
  183. package/src/layouts/Components/DashBoardMenu.tsx +232 -232
  184. package/src/layouts/Components/icons/index.tsx +403 -403
  185. package/src/layouts/Components/styles.tsx +60 -60
  186. package/src/layouts/ComponentsLayout.tsx +3 -3
  187. package/src/permissions/PageWithPermission.tsx +18 -18
  188. package/src/permissions/PermissionDeniedPage.tsx +16 -16
  189. package/src/permissions/PermissionsStore.ts +352 -352
  190. package/src/permissions/ValidateAccess.tsx +18 -18
  191. package/src/permissions/index.ts +3 -3
  192. package/src/react-app-env.d.ts +1 -1
  193. package/src/shared-state/AssetsStore.ts +15 -15
  194. package/src/shared-state/UserStore.ts +13 -13
  195. package/src/shared-state/index.ts +3 -3
  196. package/src/theme/App.less +3 -3
  197. package/src/theme/MuiThemeProvider.tsx +13 -13
  198. package/src/theme/customCssBaseline.ts +78 -78
  199. package/src/theme/index.css +75 -75
  200. package/src/theme/muiTheme.ts +490 -490
  201. package/src/theme/theme.d.ts +75 -75
  202. package/src/utils/alphabet.ts +23 -23
  203. package/src/utils/arrayPadEnd.ts +3 -3
  204. package/src/utils/formatCurrency.ts +9 -9
  205. package/src/utils/getUrlParams.ts +5 -5
  206. package/src/utils/index.ts +8 -8
  207. package/src/utils/logout.ts +24 -24
  208. package/src/utils/ordinalSuffixOf.ts +14 -14
  209. package/src/utils/romanize.ts +40 -40
  210. package/src/utils/withLocalization.tsx +11 -11
  211. package/src/utils/withRouteWrapper.tsx +25 -25
  212. package/src/utils/withSuspense.tsx +6 -6
  213. package/styled-components.tsx +60 -60
  214. package/todo.md +20 -8
  215. package/tsconfig.json +21 -21
  216. package/src/components/Layout/Header/assets/newAssets/commuteX.png +0 -0
  217. package/src/components/Styled/OutlinedIconButton.tsx +0 -7
  218. package/src/components/Styled/index.tsx +0 -1
  219. package/src/components/Swiper/Swiper.tsx +0 -39
  220. package/src/components/Swiper/index.tsx +0 -1
@@ -1,89 +1,89 @@
1
- import { Close } from '@mui/icons-material'
2
- import {
3
- alpha,
4
- Box,
5
- ButtonProps,
6
- Drawer,
7
- IconButton,
8
- styled,
9
- Typography,
10
- } from '@mui/material'
11
- import { createElement, ReactNode, useState } from 'react'
12
-
13
- const StyledDrawerHeader = styled(Box)(({ theme }) => ({
14
- height: '64px',
15
- backgroundColor: alpha(theme.palette.text.secondary, 0.1),
16
- display: 'flex',
17
- justifyContent: 'space-between',
18
- alignItems: 'center',
19
- padding: '0.6rem 1rem',
20
- }))
21
-
22
- const StyledDrawerContent = styled(Box)(({ theme }) => ({
23
- padding: '1rem',
24
- height: 'calc(100vh - 64px)',
25
- overflowY: 'auto',
26
- paddingBottom: '4rem',
27
- }))
28
-
29
- type ContentProps = {
30
- close: () => void
31
- }
32
-
33
- interface DrawerButtonProps {
34
- button: any
35
- content: (props: ContentProps) => ReactNode
36
- title: string | ReactNode
37
- btnTxt?: string | ReactNode
38
- btnProps?: ButtonProps
39
- }
40
-
41
- export default function DrawerButton({
42
- button: Button,
43
- content,
44
- title,
45
- btnTxt,
46
- btnProps,
47
- }: DrawerButtonProps) {
48
- const [open, setOpen] = useState(false)
49
-
50
- const ButtonEl = (props) => (
51
- <Button {...props} {...btnProps} sx={{ fontSize: '14px', fontWeight: 600 }}>
52
- {btnTxt}
53
- </Button>
54
- )
55
-
56
- const MyButton = createElement(ButtonEl, {
57
- onClick: () => setOpen(true),
58
- })
59
-
60
- const onClose = () => {
61
- setOpen(false)
62
- }
63
- return (
64
- <>
65
- {MyButton}
66
- <Drawer
67
- anchor="right"
68
- elevation={10}
69
- onClose={onClose}
70
- open={open}
71
- sx={{
72
- zIndex: 500,
73
- '& .MuiDrawer-paper': {
74
- boxSizing: 'border-box',
75
- width: 600,
76
- },
77
- }}
78
- >
79
- <StyledDrawerHeader>
80
- <Typography fontWeight={600}>{title}</Typography>
81
- <IconButton onClick={onClose}>
82
- <Close />
83
- </IconButton>
84
- </StyledDrawerHeader>
85
- <StyledDrawerContent>{content({ close: onClose })}</StyledDrawerContent>
86
- </Drawer>
87
- </>
88
- )
89
- }
1
+ import { Close } from '@mui/icons-material'
2
+ import {
3
+ alpha,
4
+ Box,
5
+ ButtonProps,
6
+ Drawer,
7
+ IconButton,
8
+ styled,
9
+ Typography,
10
+ } from '@mui/material'
11
+ import { createElement, ReactNode, useState } from 'react'
12
+
13
+ const StyledDrawerHeader = styled(Box)(({ theme }) => ({
14
+ height: '64px',
15
+ backgroundColor: alpha(theme.palette.text.secondary, 0.1),
16
+ display: 'flex',
17
+ justifyContent: 'space-between',
18
+ alignItems: 'center',
19
+ padding: '0.6rem 1rem',
20
+ }))
21
+
22
+ const StyledDrawerContent = styled(Box)(({ theme }) => ({
23
+ padding: '1rem',
24
+ height: 'calc(100vh - 64px)',
25
+ overflowY: 'auto',
26
+ paddingBottom: '4rem',
27
+ }))
28
+
29
+ type ContentProps = {
30
+ close: () => void
31
+ }
32
+
33
+ interface DrawerButtonProps {
34
+ button: any
35
+ content: (props: ContentProps) => ReactNode
36
+ title: string | ReactNode
37
+ btnTxt?: string | ReactNode
38
+ btnProps?: ButtonProps
39
+ }
40
+
41
+ export default function DrawerButton({
42
+ button: Button,
43
+ content,
44
+ title,
45
+ btnTxt,
46
+ btnProps,
47
+ }: DrawerButtonProps) {
48
+ const [open, setOpen] = useState(false)
49
+
50
+ const ButtonEl = (props) => (
51
+ <Button {...props} {...btnProps} sx={{ fontSize: '14px', fontWeight: 600 }}>
52
+ {btnTxt}
53
+ </Button>
54
+ )
55
+
56
+ const MyButton = createElement(ButtonEl, {
57
+ onClick: () => setOpen(true),
58
+ })
59
+
60
+ const onClose = () => {
61
+ setOpen(false)
62
+ }
63
+ return (
64
+ <>
65
+ {MyButton}
66
+ <Drawer
67
+ anchor="right"
68
+ elevation={10}
69
+ onClose={onClose}
70
+ open={open}
71
+ sx={{
72
+ zIndex: 500,
73
+ '& .MuiDrawer-paper': {
74
+ boxSizing: 'border-box',
75
+ width: 600,
76
+ },
77
+ }}
78
+ >
79
+ <StyledDrawerHeader>
80
+ <Typography fontWeight={600}>{title}</Typography>
81
+ <IconButton onClick={onClose}>
82
+ <Close />
83
+ </IconButton>
84
+ </StyledDrawerHeader>
85
+ <StyledDrawerContent>{content({ close: onClose })}</StyledDrawerContent>
86
+ </Drawer>
87
+ </>
88
+ )
89
+ }
@@ -1,4 +1,4 @@
1
- import DialogButton from './DialogButton'
2
- import DrawerButton from './DrawerButton'
3
-
4
- export { DialogButton, DrawerButton }
1
+ import DialogButton from './DialogButton'
2
+ import DrawerButton from './DrawerButton'
3
+
4
+ export { DialogButton, DrawerButton }
@@ -1,32 +1,32 @@
1
- import { Box, Typography } from '@mui/material'
2
- import Image from '../Image'
3
- import { ReactNode } from 'react'
4
-
5
- interface Props {
6
- imageSrc: string
7
- height?: string
8
- message?: string | ReactNode
9
- }
10
-
11
- export default function NoData({
12
- imageSrc,
13
- height = '300px',
14
- message = 'No Data Found',
15
- }: Props) {
16
- return (
17
- <Box
18
- sx={{
19
- marginTop: '20px',
20
- }}
21
- >
22
- <Image alt="No Data Found" height={height} width="auto" src={imageSrc} />
23
- {typeof message === 'string' ? (
24
- <Typography marginTop={'20px'} textAlign={'center'}>
25
- {message}
26
- </Typography>
27
- ) : (
28
- <>{message}</>
29
- )}
30
- </Box>
31
- )
32
- }
1
+ import { Box, Typography } from '@mui/material'
2
+ import Image from '../Image'
3
+ import { ReactNode } from 'react'
4
+
5
+ interface Props {
6
+ imageSrc: string
7
+ height?: string
8
+ message?: string | ReactNode
9
+ }
10
+
11
+ export default function NoData({
12
+ imageSrc,
13
+ height = '300px',
14
+ message = 'No Data Found',
15
+ }: Props) {
16
+ return (
17
+ <Box
18
+ sx={{
19
+ marginTop: '20px',
20
+ }}
21
+ >
22
+ <Image alt="No Data Found" height={height} width="auto" src={imageSrc} />
23
+ {typeof message === 'string' ? (
24
+ <Typography marginTop={'20px'} textAlign={'center'}>
25
+ {message}
26
+ </Typography>
27
+ ) : (
28
+ <>{message}</>
29
+ )}
30
+ </Box>
31
+ )
32
+ }
@@ -1 +1 @@
1
- export { default } from './NoDataIllustration'
1
+ export { default } from './NoDataIllustration'
@@ -1,17 +1,17 @@
1
- import { Box, styled } from '@mui/material'
2
- import ErrorBoundary from './ErrorBoundary'
3
-
4
- const StyledPageContent = styled(Box)(() => ({
5
- paddingLeft: '25px',
6
- paddingRight: '25px',
7
- marginTop: '16px',
8
- paddingBottom: '3rem',
9
- }))
10
-
11
- export function PageContent(props) {
12
- return (
13
- <StyledPageContent style={props.style}>
14
- <ErrorBoundary>{props.children}</ErrorBoundary>
15
- </StyledPageContent>
16
- )
17
- }
1
+ import { Box, styled } from '@mui/material'
2
+ import ErrorBoundary from './ErrorBoundary'
3
+
4
+ const StyledPageContent = styled(Box)(() => ({
5
+ paddingLeft: '25px',
6
+ paddingRight: '25px',
7
+ marginTop: '16px',
8
+ paddingBottom: '3rem',
9
+ }))
10
+
11
+ export function PageContent(props) {
12
+ return (
13
+ <StyledPageContent style={props.style}>
14
+ <ErrorBoundary>{props.children}</ErrorBoundary>
15
+ </StyledPageContent>
16
+ )
17
+ }
@@ -1,52 +1,52 @@
1
- import { Box, styled, Typography } from '@mui/material'
2
- import { ReactNode } from 'react'
3
-
4
- interface PageHeaderProps {
5
- title: string | ReactNode
6
- subtitle?: string | ReactNode
7
- actions?: ReactNode
8
- noPadding?: boolean
9
- }
10
-
11
- const StyledBox = styled(Box, {
12
- shouldForwardProp: (prop) => prop !== 'noPadding',
13
- })<{ noPadding: boolean }>(({ theme, noPadding }) => ({
14
- minHeight: '40px',
15
- padding: noPadding ? 0 : '0 25px',
16
- display: 'flex',
17
- alignItems: 'center',
18
- justifyContent: 'space-between',
19
- margin: '1rem 0',
20
- flexWrap: 'wrap',
21
- '& .actions': {
22
- display: 'flex',
23
- gap: '1rem',
24
- alignItems: 'center',
25
- marginLeft: 'auto',
26
- },
27
- }))
28
-
29
- export default function PageHeader({
30
- title,
31
- subtitle,
32
- actions,
33
- noPadding = false,
34
- }: PageHeaderProps) {
35
- return (
36
- <StyledBox noPadding={noPadding}>
37
- <>
38
- {typeof title === 'string' ? (
39
- <Typography variant="h1">{title}</Typography>
40
- ) : (
41
- title
42
- )}
43
- {typeof subtitle === 'string' ? (
44
- <Typography>{subtitle}</Typography>
45
- ) : (
46
- <Box marginTop={'10px'}>{subtitle}</Box>
47
- )}
48
- </>
49
- <Box className="actions">{actions}</Box>
50
- </StyledBox>
51
- )
52
- }
1
+ import { Box, styled, Typography } from '@mui/material'
2
+ import { ReactNode } from 'react'
3
+
4
+ interface PageHeaderProps {
5
+ title: string | ReactNode
6
+ subtitle?: string | ReactNode
7
+ actions?: ReactNode
8
+ noPadding?: boolean
9
+ }
10
+
11
+ const StyledBox = styled(Box, {
12
+ shouldForwardProp: (prop) => prop !== 'noPadding',
13
+ })<{ noPadding: boolean }>(({ theme, noPadding }) => ({
14
+ minHeight: '40px',
15
+ padding: noPadding ? 0 : '0 25px',
16
+ display: 'flex',
17
+ alignItems: 'center',
18
+ justifyContent: 'space-between',
19
+ margin: '1rem 0',
20
+ flexWrap: 'wrap',
21
+ '& .actions': {
22
+ display: 'flex',
23
+ gap: '1rem',
24
+ alignItems: 'center',
25
+ marginLeft: 'auto',
26
+ },
27
+ }))
28
+
29
+ export default function PageHeader({
30
+ title,
31
+ subtitle,
32
+ actions,
33
+ noPadding = false,
34
+ }: PageHeaderProps) {
35
+ return (
36
+ <StyledBox noPadding={noPadding}>
37
+ <>
38
+ {typeof title === 'string' ? (
39
+ <Typography variant="h1">{title}</Typography>
40
+ ) : (
41
+ title
42
+ )}
43
+ {typeof subtitle === 'string' ? (
44
+ <Typography>{subtitle}</Typography>
45
+ ) : (
46
+ <Box marginTop={'10px'}>{subtitle}</Box>
47
+ )}
48
+ </>
49
+ <Box className="actions">{actions}</Box>
50
+ </StyledBox>
51
+ )
52
+ }
@@ -1,26 +1,26 @@
1
- import { Box, Button, Typography } from '@mui/material'
2
- import axios from 'axios'
3
- import React, { useEffect, useState } from 'react'
4
- import { pagenotfound } from '../assets/images'
5
-
6
- function PageNotFound() {
7
- return (
8
- <>
9
- <Box
10
- sx={{
11
- width: '100%',
12
- display: 'flex',
13
- flexDirection: 'column',
14
- alignItems: 'center',
15
- justifyContent: 'center',
16
- marginTop: '50px',
17
- }}
18
- >
19
- <img src={pagenotfound} alt="page not found" width={470} />
20
- <Typography variant="h1">Page Not Found.</Typography>
21
- </Box>
22
- </>
23
- )
24
- }
25
-
26
- export default PageNotFound
1
+ import { Box, Button, Typography } from '@mui/material'
2
+ import axios from 'axios'
3
+ import React, { useEffect, useState } from 'react'
4
+ import { pagenotfound } from '../assets/images'
5
+
6
+ function PageNotFound() {
7
+ return (
8
+ <>
9
+ <Box
10
+ sx={{
11
+ width: '100%',
12
+ display: 'flex',
13
+ flexDirection: 'column',
14
+ alignItems: 'center',
15
+ justifyContent: 'center',
16
+ marginTop: '50px',
17
+ }}
18
+ >
19
+ <img src={pagenotfound} alt="page not found" width={470} />
20
+ <Typography variant="h1">Page Not Found.</Typography>
21
+ </Box>
22
+ </>
23
+ )
24
+ }
25
+
26
+ export default PageNotFound
@@ -1,40 +1,40 @@
1
- import { createContext, ReactNode, useState } from 'react'
2
- import PopupConfirm from './PopupConfirm'
3
-
4
- interface ConfirmContextProps {
5
- confirm: {
6
- prompt: ReactNode
7
- isOpen: boolean
8
- proceed: () => void
9
- cancel: () => void
10
- }
11
- setConfirm: any
12
- }
13
-
14
- export const ConfirmContext = createContext<ConfirmContextProps>({
15
- confirm: {
16
- cancel: () => {},
17
- proceed: () => {},
18
- prompt: 'Are you sure?',
19
- isOpen: false,
20
- },
21
- setConfirm: () => {},
22
- })
23
-
24
- const ConfirmContextProvider = ({ children }) => {
25
- const [confirm, setConfirm] = useState({
26
- prompt: '',
27
- isOpen: false,
28
- proceed: null,
29
- cancel: null,
30
- })
31
-
32
- return (
33
- <ConfirmContext.Provider value={{ confirm, setConfirm }}>
34
- {children}
35
- <PopupConfirm />
36
- </ConfirmContext.Provider>
37
- )
38
- }
39
-
40
- export default ConfirmContextProvider
1
+ import { createContext, ReactNode, useState } from 'react'
2
+ import PopupConfirm from './PopupConfirm'
3
+
4
+ interface ConfirmContextProps {
5
+ confirm: {
6
+ prompt: ReactNode
7
+ isOpen: boolean
8
+ proceed: () => void
9
+ cancel: () => void
10
+ }
11
+ setConfirm: any
12
+ }
13
+
14
+ export const ConfirmContext = createContext<ConfirmContextProps>({
15
+ confirm: {
16
+ cancel: () => {},
17
+ proceed: () => {},
18
+ prompt: 'Are you sure?',
19
+ isOpen: false,
20
+ },
21
+ setConfirm: () => {},
22
+ })
23
+
24
+ const ConfirmContextProvider = ({ children }) => {
25
+ const [confirm, setConfirm] = useState({
26
+ prompt: '',
27
+ isOpen: false,
28
+ proceed: null,
29
+ cancel: null,
30
+ })
31
+
32
+ return (
33
+ <ConfirmContext.Provider value={{ confirm, setConfirm }}>
34
+ {children}
35
+ <PopupConfirm />
36
+ </ConfirmContext.Provider>
37
+ )
38
+ }
39
+
40
+ export default ConfirmContextProvider
@@ -1,34 +1,34 @@
1
- import {
2
- Button,
3
- Dialog,
4
- DialogActions,
5
- DialogContent,
6
- DialogTitle,
7
- } from '@mui/material'
8
- import useConfirm from './useConfirm'
9
-
10
- const PopupConfirm = () => {
11
- const { prompt = '', isOpen = false, proceed, cancel } = useConfirm()
12
- return (
13
- <Dialog
14
- sx={{ zIndex: 1600 }}
15
- keepMounted
16
- maxWidth="sm"
17
- fullWidth
18
- open={isOpen}
19
- transitionDuration={150}
20
- >
21
- <DialogTitle>Confirm</DialogTitle>
22
- <DialogContent sx={{ minHeight: '40px' }}>{prompt}</DialogContent>
23
- <DialogActions>
24
- <Button variant="contained" color="primary" onClick={proceed}>
25
- Ok
26
- </Button>
27
- <Button color="secondary" variant="outlined" onClick={cancel}>
28
- Cancel
29
- </Button>
30
- </DialogActions>
31
- </Dialog>
32
- )
33
- }
34
- export default PopupConfirm
1
+ import {
2
+ Button,
3
+ Dialog,
4
+ DialogActions,
5
+ DialogContent,
6
+ DialogTitle,
7
+ } from '@mui/material'
8
+ import useConfirm from './useConfirm'
9
+
10
+ const PopupConfirm = () => {
11
+ const { prompt = '', isOpen = false, proceed, cancel } = useConfirm()
12
+ return (
13
+ <Dialog
14
+ sx={{ zIndex: 1600 }}
15
+ keepMounted
16
+ maxWidth="sm"
17
+ fullWidth
18
+ open={isOpen}
19
+ transitionDuration={150}
20
+ >
21
+ <DialogTitle>Confirm</DialogTitle>
22
+ <DialogContent sx={{ minHeight: '40px' }}>{prompt}</DialogContent>
23
+ <DialogActions>
24
+ <Button variant="contained" color="primary" onClick={proceed}>
25
+ Ok
26
+ </Button>
27
+ <Button color="secondary" variant="outlined" onClick={cancel}>
28
+ Cancel
29
+ </Button>
30
+ </DialogActions>
31
+ </Dialog>
32
+ )
33
+ }
34
+ export default PopupConfirm
@@ -1 +1 @@
1
- export { default } from './PopupConfirm'
1
+ export { default } from './PopupConfirm'