@campxdev/shared 1.8.29 → 1.8.30

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 (230) hide show
  1. package/antd.customize.less +73 -73
  2. package/exports.ts +19 -19
  3. package/package.json +86 -86
  4. package/src/assets/fonts/avenir/index.ts +13 -13
  5. package/src/assets/fonts/poppins/index.ts +18 -18
  6. package/src/assets/images/index.ts +17 -17
  7. package/src/assets/images/unauth.svg +92 -92
  8. package/src/components/ActionButton.tsx +20 -20
  9. package/src/components/ApplicationProfile/ApplicationProfile.tsx +336 -336
  10. package/src/components/ApplicationProfile/Service.ts +68 -68
  11. package/src/components/ApplicationProfile/UserProfileRelation.tsx +174 -174
  12. package/src/components/ApplicationProfile/index.tsx +1 -1
  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 +123 -123
  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 +67 -67
  25. package/src/components/DrawerWrapper/DrawerTemplate.tsx +53 -53
  26. package/src/components/DrawerWrapper/DrawerWrapper.tsx +53 -53
  27. package/src/components/DropDownButton/AnchorElement.tsx +44 -44
  28. package/src/components/DropDownButton/DropDownButton.tsx +184 -184
  29. package/src/components/DropDownButton/DropdownMenuItem.tsx +110 -110
  30. package/src/components/DropDownButton/index.tsx +1 -1
  31. package/src/components/DropDownButton/styles.tsx +59 -59
  32. package/src/components/ErrorBoundary/ErrorBoundary.tsx +33 -33
  33. package/src/components/ErrorBoundary/ErrorFallback.tsx +241 -241
  34. package/src/components/ErrorBoundary/GlobalNetworkLoadingIndicator.tsx +13 -13
  35. package/src/components/ErrorBoundary/index.tsx +1 -1
  36. package/src/components/ErrorBox.tsx +42 -42
  37. package/src/components/ExcelToJsonInput/ExcelJsonUpload.tsx +50 -50
  38. package/src/components/ExcelToJsonInput/ExcelToJsonInput.tsx +57 -57
  39. package/src/components/ExcelToJsonInput/index.tsx +1 -1
  40. package/src/components/FilterComponents/FilterButton.tsx +56 -56
  41. package/src/components/FilterComponents/SearchBar.tsx +45 -45
  42. package/src/components/FloatingContainer.tsx +33 -33
  43. package/src/components/Form/Form.tsx +147 -147
  44. package/src/components/Form/RenderForm.tsx +189 -189
  45. package/src/components/FullScreenLoader.tsx +19 -19
  46. package/src/components/HookForm/AutoCompleteSearch.tsx +113 -113
  47. package/src/components/HookForm/DatePicker.tsx +40 -40
  48. package/src/components/HookForm/DateTimePicker.tsx +47 -47
  49. package/src/components/HookForm/FormLabel.tsx +14 -14
  50. package/src/components/HookForm/MultiCheckbox.tsx +69 -69
  51. package/src/components/HookForm/MultiSelect.tsx +61 -61
  52. package/src/components/HookForm/RadioGroup.tsx +47 -47
  53. package/src/components/HookForm/SingleCheckbox.tsx +34 -34
  54. package/src/components/HookForm/SingleSelect.tsx +46 -46
  55. package/src/components/HookForm/TextField.tsx +40 -40
  56. package/src/components/HookForm/TimePicker.tsx +40 -40
  57. package/src/components/HookForm/index.ts +23 -23
  58. package/src/components/IconButtons/IconButtons.tsx +137 -137
  59. package/src/components/IconButtons/Icons.tsx +268 -268
  60. package/src/components/IconButtons/assets/edit.svg +4 -4
  61. package/src/components/IconButtons/assets/eye.svg +6 -6
  62. package/src/components/IconButtons/assets/trash.svg +7 -7
  63. package/src/components/IconButtons/index.tsx +8 -8
  64. package/src/components/IconLabel.tsx +37 -37
  65. package/src/components/Image/Image.tsx +45 -45
  66. package/src/components/Image/index.tsx +1 -1
  67. package/src/components/ImageUpload.tsx +98 -98
  68. package/src/components/Input/AsyncSearchSelect/AsyncSearchSelect.tsx +216 -216
  69. package/src/components/Input/AsyncSearchSelect/index.tsx +1 -1
  70. package/src/components/Input/AsyncSearchSelect/styles.tsx +105 -105
  71. package/src/components/Input/AutoCompleteSearch.tsx +121 -121
  72. package/src/components/Input/DatePicker.tsx +87 -87
  73. package/src/components/Input/DateRangePicker.tsx +105 -105
  74. package/src/components/Input/DateTimePicker.tsx +84 -84
  75. package/src/components/Input/FormLabel.tsx +21 -21
  76. package/src/components/Input/MultiCheckbox.tsx +64 -64
  77. package/src/components/Input/MultiSelect.tsx +161 -161
  78. package/src/components/Input/RadioGroup.tsx +104 -104
  79. package/src/components/Input/SingleCheckbox.tsx +78 -78
  80. package/src/components/Input/SingleSelect.tsx +104 -104
  81. package/src/components/Input/TextField.tsx +46 -46
  82. package/src/components/Input/TimePicker.tsx +77 -77
  83. package/src/components/Input/index.ts +26 -26
  84. package/src/components/Input/types.ts +3 -3
  85. package/src/components/JsonPreview.tsx +7 -7
  86. package/src/components/LabelValue.tsx +21 -21
  87. package/src/components/Layout/ChangePassword.tsx +49 -49
  88. package/src/components/Layout/Header/AppHeader.tsx +112 -112
  89. package/src/components/Layout/Header/AppsMenu.tsx +133 -133
  90. package/src/components/Layout/Header/HeaderActions/CogWheelMenu.tsx +33 -33
  91. package/src/components/Layout/Header/HeaderActions/FreshChatButton.tsx +61 -61
  92. package/src/components/Layout/Header/HeaderActions/FreshDeskHelpButton.tsx +28 -28
  93. package/src/components/Layout/Header/HeaderActions/HeaderActions.tsx +18 -18
  94. package/src/components/Layout/Header/HeaderActions/UserBox.tsx +56 -56
  95. package/src/components/Layout/Header/Notification.tsx +13 -13
  96. package/src/components/Layout/Header/applications.ts +97 -97
  97. package/src/components/Layout/Header/assets/campx_square_small.svg +8 -8
  98. package/src/components/Layout/Header/assets/commuteX.png +0 -0
  99. package/src/components/Layout/Header/assets/commutex.svg +14 -14
  100. package/src/components/Layout/Header/assets/commutexSmall.svg +11 -11
  101. package/src/components/Layout/Header/assets/enroll.svg +14 -14
  102. package/src/components/Layout/Header/assets/enrollx.svg +14 -14
  103. package/src/components/Layout/Header/assets/exams_small.svg +11 -11
  104. package/src/components/Layout/Header/assets/examsx.svg +14 -14
  105. package/src/components/Layout/Header/assets/hostel_small.svg +13 -13
  106. package/src/components/Layout/Header/assets/hostelx.svg +13 -13
  107. package/src/components/Layout/Header/assets/index.ts +37 -37
  108. package/src/components/Layout/Header/assets/libraryx.svg +12 -12
  109. package/src/components/Layout/Header/assets/pay_small.svg +15 -15
  110. package/src/components/Layout/Header/assets/payx.svg +19 -19
  111. package/src/components/Layout/Header/assets/people_small.svg +9 -9
  112. package/src/components/Layout/Header/assets/peoplex.svg +12 -12
  113. package/src/components/Layout/Header/assets/squarex.svg +12 -12
  114. package/src/components/Layout/Header/icons.tsx +57 -57
  115. package/src/components/Layout/Header/index.tsx +1 -1
  116. package/src/components/Layout/Header/styles.tsx +133 -133
  117. package/src/components/Layout/Helmet.tsx +105 -105
  118. package/src/components/Layout/LayoutWrapper.tsx +28 -28
  119. package/src/components/Layout/SideMenuHeader.tsx +29 -29
  120. package/src/components/Layout/SideNav.tsx +168 -168
  121. package/src/components/Layout/Tickets/HelpWidget/HelpWidget.tsx +273 -273
  122. package/src/components/Layout/Tickets/HelpWidget/styles.tsx +94 -94
  123. package/src/components/Layout/Tickets/MyTickets.tsx +72 -72
  124. package/src/components/Layout/Tickets/TicketDetails.tsx +65 -65
  125. package/src/components/Layout/Tickets/TimeLine.tsx +64 -64
  126. package/src/components/Layout/Tickets/index.tsx +1 -1
  127. package/src/components/Layout/Tickets/services.ts +11 -11
  128. package/src/components/Layout/Tickets/styles.tsx +136 -136
  129. package/src/components/LinearProgress.tsx +19 -19
  130. package/src/components/ListItemButton.tsx +95 -95
  131. package/src/components/LoginForm.tsx +279 -279
  132. package/src/components/MediaRow/MediaRow.tsx +67 -67
  133. package/src/components/MediaRow/index.tsx +1 -1
  134. package/src/components/ModalButtons/DialogButton.tsx +126 -126
  135. package/src/components/ModalButtons/DrawerButton.tsx +115 -115
  136. package/src/components/ModalButtons/index.tsx +4 -4
  137. package/src/components/NoDataIllustration.tsx +32 -32
  138. package/src/components/PageContent.tsx +12 -12
  139. package/src/components/PageHeader.tsx +55 -55
  140. package/src/components/PageNotFound.tsx +26 -26
  141. package/src/components/PopupConfirm/ConfirmContextProvider.tsx +40 -40
  142. package/src/components/PopupConfirm/PopupConfirm.tsx +67 -67
  143. package/src/components/PopupConfirm/index.tsx +1 -1
  144. package/src/components/PopupConfirm/useConfirm.ts +47 -47
  145. package/src/components/ResetPassword.tsx +107 -107
  146. package/src/components/Row.tsx +24 -24
  147. package/src/components/Spinner.tsx +18 -18
  148. package/src/components/StepsHeader/StepsHeader.tsx +115 -115
  149. package/src/components/StepsHeader/index.tsx +1 -1
  150. package/src/components/StyledTableContainer.tsx +33 -33
  151. package/src/components/SwitchButton.tsx +41 -41
  152. package/src/components/Table.tsx +42 -42
  153. package/src/components/Tables/BasicTable/Table.tsx +198 -198
  154. package/src/components/Tables/BasicTable/TableFooter.tsx +86 -86
  155. package/src/components/Tables/BasicTable/index.tsx +1 -1
  156. package/src/components/Tables/ReactTable/BatchActionsHeader.tsx +58 -58
  157. package/src/components/Tables/ReactTable/ReactTable.tsx +295 -295
  158. package/src/components/Tables/ReactTable/RenderTableBody.tsx +49 -49
  159. package/src/components/Tables/ReactTable/index.tsx +1 -1
  160. package/src/components/Tables/ReactTable/react-table-config.d.ts +128 -128
  161. package/src/components/Tables/common/NoRecordsFound.tsx +27 -27
  162. package/src/components/Tables/common/TableStats.tsx +22 -22
  163. package/src/components/Tables/common/icons.tsx +50 -50
  164. package/src/components/Tables/common/styles.tsx +170 -170
  165. package/src/components/Tables/common/types.ts +57 -57
  166. package/src/components/Tabs/NavigationTabs.tsx +80 -80
  167. package/src/components/Tabs/Tabs.tsx +53 -53
  168. package/src/components/Tabs/TabsContainer.tsx +53 -53
  169. package/src/components/Tabs/index.tsx +1 -1
  170. package/src/components/Tabs/styles.tsx +55 -55
  171. package/src/components/ToastContainer/ToastContainer.tsx +57 -57
  172. package/src/components/ToastContainer/index.tsx +1 -1
  173. package/src/components/UploadButton/UploadButton.tsx +126 -126
  174. package/src/components/UploadButton/index.tsx +1 -1
  175. package/src/components/UploadButton/types.ts +19 -19
  176. package/src/components/UploadDocument.tsx +108 -108
  177. package/src/components/UploadFileDialog/UploadFileDialog.tsx +238 -238
  178. package/src/components/UploadFileDialog/index.tsx +1 -1
  179. package/src/components/index.ts +108 -108
  180. package/src/config/axios.ts +73 -73
  181. package/src/config/axiosEvaluator.ts +53 -53
  182. package/src/config/axiosXTenant.ts +57 -57
  183. package/src/constants/UIConstants.ts +124 -124
  184. package/src/constants/formValidations.ts +6 -6
  185. package/src/constants/index.ts +5 -5
  186. package/src/constants/isDevelopment.ts +4 -4
  187. package/src/constants/permissions.ts +67 -67
  188. package/src/constants/validateMessages.ts +12 -12
  189. package/src/contexts/LoginFormProvider.tsx +39 -39
  190. package/src/contexts/Providers.tsx +52 -52
  191. package/src/contexts/PublicProviders.tsx +30 -30
  192. package/src/contexts/QueryClientProvider.tsx +22 -22
  193. package/src/hooks/index.ts +5 -5
  194. package/src/hooks/useAuth.ts +111 -110
  195. package/src/hooks/useExternalScript.ts +38 -38
  196. package/src/hooks/useFetch.ts +53 -53
  197. package/src/hooks/useFilters.ts +83 -83
  198. package/src/hooks/useRouter.ts +31 -31
  199. package/src/layouts/Components/DashBoardMenu.tsx +232 -232
  200. package/src/layouts/Components/icons/index.tsx +403 -403
  201. package/src/layouts/Components/styles.tsx +74 -74
  202. package/src/layouts/ComponentsLayout.tsx +3 -3
  203. package/src/permissions/PageWithPermission.tsx +18 -18
  204. package/src/permissions/PermissionDeniedPage.tsx +16 -16
  205. package/src/permissions/ValidateAccess.tsx +18 -18
  206. package/src/permissions/index.ts +2 -2
  207. package/src/react-app-env.d.ts +1 -1
  208. package/src/shared-state/AssetsStore.ts +15 -15
  209. package/src/shared-state/PermissionsStore.ts +1053 -534
  210. package/src/shared-state/UserStore.ts +13 -13
  211. package/src/shared-state/index.ts +4 -4
  212. package/src/theme/App.less +3 -3
  213. package/src/theme/MuiThemeProvider.tsx +18 -18
  214. package/src/theme/customCssBaseline.ts +135 -135
  215. package/src/theme/index.css +28 -28
  216. package/src/theme/muiTheme.ts +597 -597
  217. package/src/theme/theme.d.ts +77 -77
  218. package/src/utils/adminAxios.ts +15 -15
  219. package/src/utils/alphabet.ts +23 -23
  220. package/src/utils/arrayPadEnd.ts +3 -3
  221. package/src/utils/formatCurrency.ts +9 -9
  222. package/src/utils/getUrlParams.ts +5 -5
  223. package/src/utils/index.ts +7 -7
  224. package/src/utils/logout.ts +25 -25
  225. package/src/utils/ordinalSuffixOf.ts +14 -14
  226. package/src/utils/romanize.ts +40 -40
  227. package/src/utils/withRouteWrapper.tsx +25 -25
  228. package/src/utils/withSuspense.tsx +6 -6
  229. package/styled-components.tsx +60 -60
  230. package/tsconfig.json +21 -21
@@ -1,50 +1,50 @@
1
- import { Box, Button, ButtonProps, CircularProgress } from '@mui/material'
2
- import { AxiosResponse } from 'axios'
3
- import { useState } from 'react'
4
- import { useMutation } from 'react-query'
5
- import { toast } from 'react-toastify'
6
- import { axiosErrorToast } from '../../config/axios'
7
- import ExcelToJsonInput from './ExcelToJsonInput'
8
-
9
- interface ExcelJsonUploadProps {
10
- postFn: (json) => Promise<AxiosResponse<any, any>>
11
- btnProps?: ButtonProps
12
- }
13
-
14
- export default function ExcelJsonUpload({
15
- postFn,
16
- btnProps,
17
- }: ExcelJsonUploadProps) {
18
- const [json, setJson] = useState([])
19
- const { mutate, isLoading } = useMutation(postFn, {
20
- onSuccess(data) {
21
- toast.success('Data uploaded successfully')
22
- },
23
- onError(error) {
24
- axiosErrorToast(error)
25
- },
26
- })
27
-
28
- const onSubmit = () => {
29
- mutate(json)
30
- }
31
-
32
- return (
33
- <Box>
34
- <Button
35
- sx={{ marginBottom: '20px' }}
36
- onClick={onSubmit}
37
- endIcon={isLoading ? <CircularProgress size={20} /> : null}
38
- disabled={isLoading}
39
- {...btnProps}
40
- >
41
- Submit Data
42
- </Button>
43
- <ExcelToJsonInput
44
- onChange={(jsonValue) => {
45
- setJson(jsonValue)
46
- }}
47
- />
48
- </Box>
49
- )
50
- }
1
+ import { Box, Button, ButtonProps, CircularProgress } from '@mui/material'
2
+ import { AxiosResponse } from 'axios'
3
+ import { useState } from 'react'
4
+ import { useMutation } from 'react-query'
5
+ import { toast } from 'react-toastify'
6
+ import { axiosErrorToast } from '../../config/axios'
7
+ import ExcelToJsonInput from './ExcelToJsonInput'
8
+
9
+ interface ExcelJsonUploadProps {
10
+ postFn: (json) => Promise<AxiosResponse<any, any>>
11
+ btnProps?: ButtonProps
12
+ }
13
+
14
+ export default function ExcelJsonUpload({
15
+ postFn,
16
+ btnProps,
17
+ }: ExcelJsonUploadProps) {
18
+ const [json, setJson] = useState([])
19
+ const { mutate, isLoading } = useMutation(postFn, {
20
+ onSuccess(data) {
21
+ toast.success('Data uploaded successfully')
22
+ },
23
+ onError(error) {
24
+ axiosErrorToast(error)
25
+ },
26
+ })
27
+
28
+ const onSubmit = () => {
29
+ mutate(json)
30
+ }
31
+
32
+ return (
33
+ <Box>
34
+ <Button
35
+ sx={{ marginBottom: '20px' }}
36
+ onClick={onSubmit}
37
+ endIcon={isLoading ? <CircularProgress size={20} /> : null}
38
+ disabled={isLoading}
39
+ {...btnProps}
40
+ >
41
+ Submit Data
42
+ </Button>
43
+ <ExcelToJsonInput
44
+ onChange={(jsonValue) => {
45
+ setJson(jsonValue)
46
+ }}
47
+ />
48
+ </Box>
49
+ )
50
+ }
@@ -1,57 +1,57 @@
1
- import { Box } from '@mui/material'
2
-
3
- function tableToJson(innerText) {
4
- if (!innerText) return []
5
- const matrix = innerText
6
- ?.split('\n')
7
- ?.map((row) => row?.split('\t')?.map((cell) => (cell === '' ? null : cell)))
8
-
9
- const arrayList = matrix.filter((row) => row.length === matrix[0].length)
10
-
11
- var data = []
12
- for (var i = 1; i < arrayList.length; i++) {
13
- var tableRow = arrayList[i]
14
- let rowObj = {}
15
- for (var j = 0; j < arrayList[0].length; j++) {
16
- rowObj[arrayList[0][j]] = tableRow[j]
17
- }
18
- data.push(rowObj)
19
- }
20
- return data
21
- }
22
-
23
- export default function ExcelToJsonInput({ onChange }) {
24
- return (
25
- <Box
26
- onInput={(e) => {
27
- const input = e.currentTarget.innerText
28
- let json = tableToJson(input)
29
- onChange(json)
30
- }}
31
- placeholder="paste"
32
- contentEditable
33
- sx={{
34
- fontSize: '16px',
35
- height: 'auto',
36
- width: '100%',
37
- border: '1px solid #ccc',
38
- color: 'black',
39
- padding: '20px',
40
- '& table': {
41
- borderCollapse: 'collapse',
42
- border: '1px solid #ccc',
43
- '& th, & td': {
44
- border: '1px solid #ccc !important',
45
- padding: '5px',
46
- background: 'white !important',
47
- fontSize: '14px',
48
- },
49
- '& font': {
50
- fontSize: '14px',
51
- fontFamily: 'sans-serif',
52
- },
53
- },
54
- }}
55
- />
56
- )
57
- }
1
+ import { Box } from '@mui/material'
2
+
3
+ function tableToJson(innerText) {
4
+ if (!innerText) return []
5
+ const matrix = innerText
6
+ ?.split('\n')
7
+ ?.map((row) => row?.split('\t')?.map((cell) => (cell === '' ? null : cell)))
8
+
9
+ const arrayList = matrix.filter((row) => row.length === matrix[0].length)
10
+
11
+ var data = []
12
+ for (var i = 1; i < arrayList.length; i++) {
13
+ var tableRow = arrayList[i]
14
+ let rowObj = {}
15
+ for (var j = 0; j < arrayList[0].length; j++) {
16
+ rowObj[arrayList[0][j]] = tableRow[j]
17
+ }
18
+ data.push(rowObj)
19
+ }
20
+ return data
21
+ }
22
+
23
+ export default function ExcelToJsonInput({ onChange }) {
24
+ return (
25
+ <Box
26
+ onInput={(e) => {
27
+ const input = e.currentTarget.innerText
28
+ let json = tableToJson(input)
29
+ onChange(json)
30
+ }}
31
+ placeholder="paste"
32
+ contentEditable
33
+ sx={{
34
+ fontSize: '16px',
35
+ height: 'auto',
36
+ width: '100%',
37
+ border: '1px solid #ccc',
38
+ color: 'black',
39
+ padding: '20px',
40
+ '& table': {
41
+ borderCollapse: 'collapse',
42
+ border: '1px solid #ccc',
43
+ '& th, & td': {
44
+ border: '1px solid #ccc !important',
45
+ padding: '5px',
46
+ background: 'white !important',
47
+ fontSize: '14px',
48
+ },
49
+ '& font': {
50
+ fontSize: '14px',
51
+ fontFamily: 'sans-serif',
52
+ },
53
+ },
54
+ }}
55
+ />
56
+ )
57
+ }
@@ -1 +1 @@
1
- export { default } from './ExcelToJsonInput'
1
+ export { default } from './ExcelToJsonInput'
@@ -1,56 +1,56 @@
1
- import { Tune } from '@mui/icons-material'
2
- import { Box, styled } from '@mui/material'
3
- import { useEffect, useState } from 'react'
4
-
5
- const StyledButtonWrapper = styled(Box)<{ size: 'regular' | 'large' }>(
6
- ({ theme, size }) => ({
7
- width: size === 'regular' ? '40px' : '50px',
8
- height: size === 'regular' ? '40px' : '50px',
9
- flexShrink: 0,
10
- border: theme.borders.grayLight,
11
- display: 'flex',
12
- position: 'relative',
13
- alignItems: 'center',
14
- justifyContent: 'center',
15
- borderRadius: '10px',
16
- cursor: 'pointer',
17
- '&:active': {
18
- border: `1px solid ${theme.palette.primary.main}`,
19
- },
20
- transition: 'border 0.1s ease-in-out',
21
- }),
22
- )
23
-
24
- const StyledNotify = styled(Box)(({ theme }) => ({
25
- height: '5px',
26
- width: '5px',
27
- backgroundColor: theme.palette.error.main,
28
- position: 'absolute',
29
- borderRadius: '50%',
30
- top: 5,
31
- right: 5,
32
- }))
33
-
34
- export default function FilterButton({
35
- onClick,
36
- size = 'large',
37
- filtersApplied,
38
- ...props
39
- }: {
40
- onClick: (e: any) => void
41
- size?: 'regular' | 'large'
42
- filtersApplied?: any
43
- }) {
44
- const handleClick = (e) => {
45
- e.stopPropagation()
46
- if (!onClick) return
47
- onClick(e)
48
- }
49
-
50
- return (
51
- <StyledButtonWrapper size={size} {...props} onClick={handleClick}>
52
- {filtersApplied && <StyledNotify />}
53
- <Tune />
54
- </StyledButtonWrapper>
55
- )
56
- }
1
+ import { Tune } from '@mui/icons-material'
2
+ import { Box, styled } from '@mui/material'
3
+ import { useEffect, useState } from 'react'
4
+
5
+ const StyledButtonWrapper = styled(Box)<{ size: 'regular' | 'large' }>(
6
+ ({ theme, size }) => ({
7
+ width: size === 'regular' ? '40px' : '50px',
8
+ height: size === 'regular' ? '40px' : '50px',
9
+ flexShrink: 0,
10
+ border: theme.borders.grayLight,
11
+ display: 'flex',
12
+ position: 'relative',
13
+ alignItems: 'center',
14
+ justifyContent: 'center',
15
+ borderRadius: '10px',
16
+ cursor: 'pointer',
17
+ '&:active': {
18
+ border: `1px solid ${theme.palette.primary.main}`,
19
+ },
20
+ transition: 'border 0.1s ease-in-out',
21
+ }),
22
+ )
23
+
24
+ const StyledNotify = styled(Box)(({ theme }) => ({
25
+ height: '5px',
26
+ width: '5px',
27
+ backgroundColor: theme.palette.error.main,
28
+ position: 'absolute',
29
+ borderRadius: '50%',
30
+ top: 5,
31
+ right: 5,
32
+ }))
33
+
34
+ export default function FilterButton({
35
+ onClick,
36
+ size = 'large',
37
+ filtersApplied,
38
+ ...props
39
+ }: {
40
+ onClick: (e: any) => void
41
+ size?: 'regular' | 'large'
42
+ filtersApplied?: any
43
+ }) {
44
+ const handleClick = (e) => {
45
+ e.stopPropagation()
46
+ if (!onClick) return
47
+ onClick(e)
48
+ }
49
+
50
+ return (
51
+ <StyledButtonWrapper size={size} {...props} onClick={handleClick}>
52
+ {filtersApplied && <StyledNotify />}
53
+ <Tune />
54
+ </StyledButtonWrapper>
55
+ )
56
+ }
@@ -1,45 +1,45 @@
1
- import { Search } from '@mui/icons-material'
2
- import { InputAdornment } from '@mui/material'
3
- import _ from 'lodash'
4
- import { ReactNode, useMemo, useState } from 'react'
5
- import { TextField } from '../Input'
6
- import { ITextFieldProps } from '../Input/TextField'
7
-
8
- interface SearchBarProps {
9
- onSearch: (v: string) => void
10
- label?: ReactNode
11
- textFieldProps?: ITextFieldProps
12
- }
13
-
14
- export default function SearchBar({
15
- onSearch,
16
- label,
17
- ...restProps
18
- }: SearchBarProps) {
19
- const [, setSearch] = useState('')
20
-
21
- const debouncedChangeHandler = useMemo(
22
- () =>
23
- _.debounce((e) => {
24
- setSearch(e.target.value)
25
- onSearch(e.target.value)
26
- }, 300),
27
- [],
28
- )
29
-
30
- return (
31
- <TextField
32
- label={label}
33
- placeholder="Search"
34
- onChange={debouncedChangeHandler}
35
- InputProps={{
36
- endAdornment: (
37
- <InputAdornment position="end">
38
- <Search />
39
- </InputAdornment>
40
- ),
41
- }}
42
- {...restProps.textFieldProps}
43
- />
44
- )
45
- }
1
+ import { Search } from '@mui/icons-material'
2
+ import { InputAdornment } from '@mui/material'
3
+ import _ from 'lodash'
4
+ import { ReactNode, useMemo, useState } from 'react'
5
+ import { TextField } from '../Input'
6
+ import { ITextFieldProps } from '../Input/TextField'
7
+
8
+ interface SearchBarProps {
9
+ onSearch: (v: string) => void
10
+ label?: ReactNode
11
+ textFieldProps?: ITextFieldProps
12
+ }
13
+
14
+ export default function SearchBar({
15
+ onSearch,
16
+ label,
17
+ ...restProps
18
+ }: SearchBarProps) {
19
+ const [, setSearch] = useState('')
20
+
21
+ const debouncedChangeHandler = useMemo(
22
+ () =>
23
+ _.debounce((e) => {
24
+ setSearch(e.target.value)
25
+ onSearch(e.target.value)
26
+ }, 300),
27
+ [],
28
+ )
29
+
30
+ return (
31
+ <TextField
32
+ label={label}
33
+ placeholder="Search"
34
+ onChange={debouncedChangeHandler}
35
+ InputProps={{
36
+ endAdornment: (
37
+ <InputAdornment position="end">
38
+ <Search />
39
+ </InputAdornment>
40
+ ),
41
+ }}
42
+ {...restProps.textFieldProps}
43
+ />
44
+ )
45
+ }
@@ -1,33 +1,33 @@
1
- import { Box, styled } from '@mui/material'
2
- export const StyledFooter = styled(Box)<{
3
- show: boolean
4
- }>`
5
- position: fixed;
6
- background: #fff;
7
- bottom: ${(props) => (props.show ? '0' : '-70px')};
8
- right: 16px;
9
- width: calc(100% - 236px);
10
- height: 64px;
11
- display: flex;
12
- justify-content: center;
13
- align-items: center;
14
- gap: 1.5rem;
15
- padding: 1rem;
16
- transition: bottom 400ms ease-in-out;
17
- box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
18
- `
19
-
20
- function FloatingContainer({
21
- children,
22
- show,
23
- }: {
24
- show?: boolean
25
- children: React.ReactNode
26
- }) {
27
- return (
28
- <>
29
- <StyledFooter show={show}>{children}</StyledFooter>
30
- </>
31
- )
32
- }
33
- export default FloatingContainer
1
+ import { Box, styled } from '@mui/material'
2
+ export const StyledFooter = styled(Box)<{
3
+ show: boolean
4
+ }>`
5
+ position: fixed;
6
+ background: #fff;
7
+ bottom: ${(props) => (props.show ? '0' : '-70px')};
8
+ right: 16px;
9
+ width: calc(100% - 236px);
10
+ height: 64px;
11
+ display: flex;
12
+ justify-content: center;
13
+ align-items: center;
14
+ gap: 1.5rem;
15
+ padding: 1rem;
16
+ transition: bottom 400ms ease-in-out;
17
+ box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
18
+ `
19
+
20
+ function FloatingContainer({
21
+ children,
22
+ show,
23
+ }: {
24
+ show?: boolean
25
+ children: React.ReactNode
26
+ }) {
27
+ return (
28
+ <>
29
+ <StyledFooter show={show}>{children}</StyledFooter>
30
+ </>
31
+ )
32
+ }
33
+ export default FloatingContainer