@campxdev/shared 1.8.40 → 1.8.42

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 +122 -122
  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 +113 -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 +101 -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 +108 -108
  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 +152 -152
  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 +1066 -1064
  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,68 +1,68 @@
1
- import * as yup from 'yup'
2
- import axios from '../../config/axios'
3
- export const defaultFilterObj = {
4
- search: null,
5
- limit: 10,
6
- offset: 0,
7
- }
8
-
9
- export const userProfileSchema = yup.object().shape({
10
- userId: yup
11
- .object()
12
- .shape({
13
- label: yup.string().required('User is required'),
14
- value: yup.string().required('User is required'),
15
- })
16
- .required('User is required'),
17
- profileIds: yup.string().required('Profile is required'),
18
- })
19
- export const fetchUsers = (params) => {
20
- return axios
21
- .get(`/square/profile-permissions/new-users`, {
22
- params: params,
23
- })
24
- .then((res) => res.data)
25
- }
26
-
27
- export const fetchApplicationUsers = (params) => {
28
- return axios
29
- .get(`/square/profile-permissions/application-users`, {
30
- params: params,
31
- })
32
- .then((res) => res.data)
33
- }
34
-
35
- export const fetchProfiles = (application) => {
36
- return axios
37
- .get(`/square/profiles`, {
38
- params: application,
39
- })
40
- .then((res) => res.data)
41
- }
42
-
43
- interface ApplicationUserProfile {
44
- application: string
45
- userId: number
46
- profileIds: number[]
47
- }
48
- export const createApplicationUserProfile = (
49
- postBody: ApplicationUserProfile,
50
- ) => {
51
- return axios
52
- .post(`/square/profile-permissions/add-user`, postBody)
53
- .then((res) => res.data)
54
- }
55
-
56
- export const removeUserApplicationProfile = (postBody) => {
57
- return axios
58
- .post(`/square/profile-permissions/remove-user`, postBody)
59
- .then((res) => res.data)
60
- }
61
-
62
- export const updateUserApplicationProfile = (
63
- postBody: ApplicationUserProfile,
64
- ) => {
65
- return axios
66
- .put(`/square/profile-permissions/edit-user-permissions`, postBody)
67
- .then((res) => res.data)
68
- }
1
+ import * as yup from 'yup'
2
+ import axios from '../../config/axios'
3
+ export const defaultFilterObj = {
4
+ search: null,
5
+ limit: 10,
6
+ offset: 0,
7
+ }
8
+
9
+ export const userProfileSchema = yup.object().shape({
10
+ userId: yup
11
+ .object()
12
+ .shape({
13
+ label: yup.string().required('User is required'),
14
+ value: yup.string().required('User is required'),
15
+ })
16
+ .required('User is required'),
17
+ profileIds: yup.string().required('Profile is required'),
18
+ })
19
+ export const fetchUsers = (params) => {
20
+ return axios
21
+ .get(`/square/profile-permissions/new-users`, {
22
+ params: params,
23
+ })
24
+ .then((res) => res.data)
25
+ }
26
+
27
+ export const fetchApplicationUsers = (params) => {
28
+ return axios
29
+ .get(`/square/profile-permissions/application-users`, {
30
+ params: params,
31
+ })
32
+ .then((res) => res.data)
33
+ }
34
+
35
+ export const fetchProfiles = (application) => {
36
+ return axios
37
+ .get(`/square/profiles`, {
38
+ params: application,
39
+ })
40
+ .then((res) => res.data)
41
+ }
42
+
43
+ interface ApplicationUserProfile {
44
+ application: string
45
+ userId: number
46
+ profileIds: number[]
47
+ }
48
+ export const createApplicationUserProfile = (
49
+ postBody: ApplicationUserProfile,
50
+ ) => {
51
+ return axios
52
+ .post(`/square/profile-permissions/add-user`, postBody)
53
+ .then((res) => res.data)
54
+ }
55
+
56
+ export const removeUserApplicationProfile = (postBody) => {
57
+ return axios
58
+ .post(`/square/profile-permissions/remove-user`, postBody)
59
+ .then((res) => res.data)
60
+ }
61
+
62
+ export const updateUserApplicationProfile = (
63
+ postBody: ApplicationUserProfile,
64
+ ) => {
65
+ return axios
66
+ .put(`/square/profile-permissions/edit-user-permissions`, postBody)
67
+ .then((res) => res.data)
68
+ }
@@ -1,174 +1,174 @@
1
- import { yupResolver } from '@hookform/resolvers/yup'
2
- import {
3
- Autocomplete,
4
- CircularProgress,
5
- Popper,
6
- Stack,
7
- styled,
8
- } from '@mui/material'
9
- import { useState } from 'react'
10
- import { Controller, useForm } from 'react-hook-form'
11
- import { useMutation, useQueryClient } from 'react-query'
12
- import { toast } from 'react-toastify'
13
- import {
14
- createApplicationUserProfile,
15
- fetchUsers,
16
- userProfileSchema,
17
- } from './Service'
18
- import { useImmer } from 'use-immer'
19
- import { axiosErrorToast } from '../../config/axios'
20
- import { FormMultiSelect, FormSingleSelect } from '../HookForm'
21
- import ActionButton from '../ActionButton'
22
- interface UserProps {
23
- options: {
24
- label: any
25
- value: any
26
- }[]
27
- inputValue: string
28
- }
29
- function UserProfileRelation({ close, application, profiles }) {
30
- const [state, setState] = useImmer<UserProps>({
31
- options: [],
32
- inputValue: '',
33
- })
34
- const queryClient = useQueryClient()
35
-
36
- const { control, handleSubmit, formState } = useForm({
37
- defaultValues: {},
38
- resolver: yupResolver(userProfileSchema),
39
- })
40
-
41
- const { mutate, isLoading: creatingUserProfile } = useMutation(
42
- createApplicationUserProfile,
43
- {
44
- onSuccess: (res) => {
45
- queryClient.invalidateQueries(`application-users`)
46
- toast.success('User profile added to application successfully')
47
- close()
48
- },
49
- onError: (err) => {
50
- // eslint-disable-next-line no-console
51
- console.log(err)
52
- axiosErrorToast(err)
53
- },
54
- },
55
- )
56
-
57
- const { mutate: fetchUsersFn, isLoading: gettingUsers } = useMutation(
58
- fetchUsers,
59
- {
60
- onSuccess: (res) => {
61
- setState((s) => {
62
- s.options = res.users?.map((item) => ({
63
- label: item.fullName,
64
- value: item.id,
65
- }))
66
- })
67
- },
68
- },
69
- )
70
- const onSubmit = (formData) => {
71
- mutate({
72
- application: application,
73
- profileIds: [+formData.profileIds],
74
- userId: +formData.userId?.value,
75
- })
76
- }
77
- const onError = (err) => {
78
- // eslint-disable-next-line no-console
79
- console.log(err)
80
- }
81
-
82
- const handleInputChange = (e) => {
83
- if (e) {
84
- setState((s) => {
85
- s.inputValue = e.target.value
86
- })
87
- if (e.target.value.length > 3) {
88
- fetchUsersFn({
89
- application: application,
90
- search: e.target.value,
91
- })
92
- }
93
- }
94
- }
95
-
96
- return (
97
- <>
98
- <form onSubmit={handleSubmit(onSubmit, onError)}>
99
- <Stack gap={4} sx={{ padding: '10px' }}>
100
- <FormMultiSelect
101
- multiple={false}
102
- label={'User'}
103
- name={'userId'}
104
- onInputChange={handleInputChange}
105
- loading={gettingUsers}
106
- control={control}
107
- options={state.options ?? []}
108
- required
109
- />
110
-
111
- <FormSingleSelect
112
- label={'Profile'}
113
- name={'profileIds'}
114
- control={control}
115
- options={
116
- profiles?.map((profile) => ({
117
- label: profile.name,
118
- value: profile.id,
119
- })) ?? []
120
- }
121
- required
122
- />
123
- <Stack gap={2} direction={'row'} sx={{ justifyContent: 'flex-end' }}>
124
- <ActionButton variant="outlined" onClick={close}>
125
- Cancel
126
- </ActionButton>
127
- <ActionButton type="submit" loading={creatingUserProfile}>
128
- Confirm
129
- </ActionButton>
130
- </Stack>
131
- </Stack>
132
- </form>
133
- </>
134
- )
135
- }
136
- export default UserProfileRelation
137
-
138
- const StyledPopper = styled(Popper)(({ theme }) => ({
139
- '& .MuiPaper-root': {
140
- borderRadius: '10px',
141
- borderTopRightRadius: 0,
142
- borderTopLeftRadius: 0,
143
- boxShadow: '0px 4px 16px #0000000F',
144
- marginTop: '1px',
145
- '& .MuiAutocomplete-listbox': {
146
- minWidth: '240px',
147
- padding: '10px',
148
- '& .MuiAutocomplete-option': {
149
- padding: '10px',
150
- background: 'none',
151
- '&.Mui-focused': {
152
- background: 'none',
153
- },
154
- },
155
- '& .MuiCheckbox-root': {
156
- padding: 0,
157
- marginRight: '10px',
158
- },
159
- },
160
- '&::-webkit-scrollbar': {
161
- width: '0.5em',
162
- height: '0.5em',
163
- },
164
-
165
- '&::-webkit-scrollbar-thumb': {
166
- backgroundColor: 'rgba(0, 0, 0, 0.15)',
167
- borderRadius: '3px',
168
-
169
- '&:hover': {
170
- background: 'rgba(0, 0, 0, 0.2)',
171
- },
172
- },
173
- },
174
- }))
1
+ import { yupResolver } from '@hookform/resolvers/yup'
2
+ import {
3
+ Autocomplete,
4
+ CircularProgress,
5
+ Popper,
6
+ Stack,
7
+ styled,
8
+ } from '@mui/material'
9
+ import { useState } from 'react'
10
+ import { Controller, useForm } from 'react-hook-form'
11
+ import { useMutation, useQueryClient } from 'react-query'
12
+ import { toast } from 'react-toastify'
13
+ import {
14
+ createApplicationUserProfile,
15
+ fetchUsers,
16
+ userProfileSchema,
17
+ } from './Service'
18
+ import { useImmer } from 'use-immer'
19
+ import { axiosErrorToast } from '../../config/axios'
20
+ import { FormMultiSelect, FormSingleSelect } from '../HookForm'
21
+ import ActionButton from '../ActionButton'
22
+ interface UserProps {
23
+ options: {
24
+ label: any
25
+ value: any
26
+ }[]
27
+ inputValue: string
28
+ }
29
+ function UserProfileRelation({ close, application, profiles }) {
30
+ const [state, setState] = useImmer<UserProps>({
31
+ options: [],
32
+ inputValue: '',
33
+ })
34
+ const queryClient = useQueryClient()
35
+
36
+ const { control, handleSubmit, formState } = useForm({
37
+ defaultValues: {},
38
+ resolver: yupResolver(userProfileSchema),
39
+ })
40
+
41
+ const { mutate, isLoading: creatingUserProfile } = useMutation(
42
+ createApplicationUserProfile,
43
+ {
44
+ onSuccess: (res) => {
45
+ queryClient.invalidateQueries(`application-users`)
46
+ toast.success('User profile added to application successfully')
47
+ close()
48
+ },
49
+ onError: (err) => {
50
+ // eslint-disable-next-line no-console
51
+ console.log(err)
52
+ axiosErrorToast(err)
53
+ },
54
+ },
55
+ )
56
+
57
+ const { mutate: fetchUsersFn, isLoading: gettingUsers } = useMutation(
58
+ fetchUsers,
59
+ {
60
+ onSuccess: (res) => {
61
+ setState((s) => {
62
+ s.options = res.users?.map((item) => ({
63
+ label: item.fullName,
64
+ value: item.id,
65
+ }))
66
+ })
67
+ },
68
+ },
69
+ )
70
+ const onSubmit = (formData) => {
71
+ mutate({
72
+ application: application,
73
+ profileIds: [+formData.profileIds],
74
+ userId: +formData.userId?.value,
75
+ })
76
+ }
77
+ const onError = (err) => {
78
+ // eslint-disable-next-line no-console
79
+ console.log(err)
80
+ }
81
+
82
+ const handleInputChange = (e) => {
83
+ if (e) {
84
+ setState((s) => {
85
+ s.inputValue = e.target.value
86
+ })
87
+ if (e.target.value.length > 3) {
88
+ fetchUsersFn({
89
+ application: application,
90
+ search: e.target.value,
91
+ })
92
+ }
93
+ }
94
+ }
95
+
96
+ return (
97
+ <>
98
+ <form onSubmit={handleSubmit(onSubmit, onError)}>
99
+ <Stack gap={4} sx={{ padding: '10px' }}>
100
+ <FormMultiSelect
101
+ multiple={false}
102
+ label={'User'}
103
+ name={'userId'}
104
+ onInputChange={handleInputChange}
105
+ loading={gettingUsers}
106
+ control={control}
107
+ options={state.options ?? []}
108
+ required
109
+ />
110
+
111
+ <FormSingleSelect
112
+ label={'Profile'}
113
+ name={'profileIds'}
114
+ control={control}
115
+ options={
116
+ profiles?.map((profile) => ({
117
+ label: profile.name,
118
+ value: profile.id,
119
+ })) ?? []
120
+ }
121
+ required
122
+ />
123
+ <Stack gap={2} direction={'row'} sx={{ justifyContent: 'flex-end' }}>
124
+ <ActionButton variant="outlined" onClick={close}>
125
+ Cancel
126
+ </ActionButton>
127
+ <ActionButton type="submit" loading={creatingUserProfile}>
128
+ Confirm
129
+ </ActionButton>
130
+ </Stack>
131
+ </Stack>
132
+ </form>
133
+ </>
134
+ )
135
+ }
136
+ export default UserProfileRelation
137
+
138
+ const StyledPopper = styled(Popper)(({ theme }) => ({
139
+ '& .MuiPaper-root': {
140
+ borderRadius: '10px',
141
+ borderTopRightRadius: 0,
142
+ borderTopLeftRadius: 0,
143
+ boxShadow: '0px 4px 16px #0000000F',
144
+ marginTop: '1px',
145
+ '& .MuiAutocomplete-listbox': {
146
+ minWidth: '240px',
147
+ padding: '10px',
148
+ '& .MuiAutocomplete-option': {
149
+ padding: '10px',
150
+ background: 'none',
151
+ '&.Mui-focused': {
152
+ background: 'none',
153
+ },
154
+ },
155
+ '& .MuiCheckbox-root': {
156
+ padding: 0,
157
+ marginRight: '10px',
158
+ },
159
+ },
160
+ '&::-webkit-scrollbar': {
161
+ width: '0.5em',
162
+ height: '0.5em',
163
+ },
164
+
165
+ '&::-webkit-scrollbar-thumb': {
166
+ backgroundColor: 'rgba(0, 0, 0, 0.15)',
167
+ borderRadius: '3px',
168
+
169
+ '&:hover': {
170
+ background: 'rgba(0, 0, 0, 0.2)',
171
+ },
172
+ },
173
+ },
174
+ }))
@@ -1 +1 @@
1
- export { default } from "./ApplicationProfile";
1
+ export { default } from "./ApplicationProfile";
@@ -1,26 +1,26 @@
1
- import React from 'react'
2
- import styled from 'styled-components'
3
-
4
- interface AttachemntProps {
5
- name: string
6
- onClick?: Function
7
- actions?: any
8
- }
9
-
10
- const AttachmentContainer = styled.div`
11
- background: rgba(0, 0, 0, 0.1);
12
- border-radius: 8px;
13
- padding: 8px;
14
- display: flex;
15
- justify-content: space-between;
16
- cursor: pointer;
17
- `
18
-
19
- export default function Attachment(props: AttachemntProps) {
20
- return (
21
- <AttachmentContainer onClick={() => props.onClick && props.onClick()}>
22
- <div>{props.name}</div>
23
- <div onClick={(e) => e.stopPropagation()}>{props.actions}</div>
24
- </AttachmentContainer>
25
- )
26
- }
1
+ import React from 'react'
2
+ import styled from 'styled-components'
3
+
4
+ interface AttachemntProps {
5
+ name: string
6
+ onClick?: Function
7
+ actions?: any
8
+ }
9
+
10
+ const AttachmentContainer = styled.div`
11
+ background: rgba(0, 0, 0, 0.1);
12
+ border-radius: 8px;
13
+ padding: 8px;
14
+ display: flex;
15
+ justify-content: space-between;
16
+ cursor: pointer;
17
+ `
18
+
19
+ export default function Attachment(props: AttachemntProps) {
20
+ return (
21
+ <AttachmentContainer onClick={() => props.onClick && props.onClick()}>
22
+ <div>{props.name}</div>
23
+ <div onClick={(e) => e.stopPropagation()}>{props.actions}</div>
24
+ </AttachmentContainer>
25
+ )
26
+ }
@@ -1,57 +1,57 @@
1
- import { Autocomplete as MuiAutocomplete, TextField } from '@mui/material'
2
- import _ from 'lodash'
3
- import { useEffect, useMemo, useState } from 'react'
4
-
5
- export default function AutocompleteSearch({
6
- name,
7
- value,
8
- onInputChange,
9
- onChange,
10
- label,
11
- options: _options,
12
- ...props
13
- }) {
14
- const [options, setOptions] = useState([])
15
-
16
- const debouncedChangeHandler = useMemo(
17
- () =>
18
- _.debounce((e, newInput) => {
19
- onInputChange(newInput)
20
- }, 300),
21
- [],
22
- )
23
-
24
- useEffect(() => {
25
- if (!_options) return
26
- setOptions((prev) => [..._options])
27
- }, [_options])
28
-
29
- return (
30
- <MuiAutocomplete
31
- id="autocomplete-search"
32
- fullWidth
33
- getOptionLabel={(option) =>
34
- typeof option === 'string' ? option : option?.label
35
- }
36
- filterOptions={(x) => x}
37
- options={options || []}
38
- autoComplete
39
- includeInputInList
40
- filterSelectedOptions
41
- value={value}
42
- onChange={(event: any, newValue: any) => {
43
- if (!newValue) return
44
- // onInputChange(newValue)
45
- onChange(newValue)
46
- }}
47
- onInputChange={debouncedChangeHandler}
48
- renderInput={(params) => (
49
- <TextField {...params} label={label} fullWidth />
50
- )}
51
- renderOption={(props, option) => {
52
- return <li {...props}>{option?.label}</li>
53
- }}
54
- {...props}
55
- />
56
- )
57
- }
1
+ import { Autocomplete as MuiAutocomplete, TextField } from '@mui/material'
2
+ import _ from 'lodash'
3
+ import { useEffect, useMemo, useState } from 'react'
4
+
5
+ export default function AutocompleteSearch({
6
+ name,
7
+ value,
8
+ onInputChange,
9
+ onChange,
10
+ label,
11
+ options: _options,
12
+ ...props
13
+ }) {
14
+ const [options, setOptions] = useState([])
15
+
16
+ const debouncedChangeHandler = useMemo(
17
+ () =>
18
+ _.debounce((e, newInput) => {
19
+ onInputChange(newInput)
20
+ }, 300),
21
+ [],
22
+ )
23
+
24
+ useEffect(() => {
25
+ if (!_options) return
26
+ setOptions((prev) => [..._options])
27
+ }, [_options])
28
+
29
+ return (
30
+ <MuiAutocomplete
31
+ id="autocomplete-search"
32
+ fullWidth
33
+ getOptionLabel={(option) =>
34
+ typeof option === 'string' ? option : option?.label
35
+ }
36
+ filterOptions={(x) => x}
37
+ options={options || []}
38
+ autoComplete
39
+ includeInputInList
40
+ filterSelectedOptions
41
+ value={value}
42
+ onChange={(event: any, newValue: any) => {
43
+ if (!newValue) return
44
+ // onInputChange(newValue)
45
+ onChange(newValue)
46
+ }}
47
+ onInputChange={debouncedChangeHandler}
48
+ renderInput={(params) => (
49
+ <TextField {...params} label={label} fullWidth />
50
+ )}
51
+ renderOption={(props, option) => {
52
+ return <li {...props}>{option?.label}</li>
53
+ }}
54
+ {...props}
55
+ />
56
+ )
57
+ }
@@ -1 +1 @@
1
- export { default } from './AutocompleteSearch'
1
+ export { default } from './AutocompleteSearch'