@applica-software-guru/react-admin 1.4.0-beta.6 → 1.4.0-beta.8

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 (48) hide show
  1. package/dist/components/ActionsMenu.d.ts.map +1 -1
  2. package/dist/components/Layout/Header/Profile/buttons/StopImpersonateButton.d.ts.map +1 -1
  3. package/dist/components/Layout/Navigation/NavGroup.d.ts +1 -14
  4. package/dist/components/Layout/Navigation/NavGroup.d.ts.map +1 -1
  5. package/dist/components/Layout/Provider.d.ts.map +1 -1
  6. package/dist/components/MenuPopover/styles.d.ts.map +1 -1
  7. package/dist/components/ra-buttons/CreateInDialogButton.d.ts +25 -5
  8. package/dist/components/ra-buttons/CreateInDialogButton.d.ts.map +1 -1
  9. package/dist/components/ra-buttons/EditInDialogButton.d.ts +3 -2
  10. package/dist/components/ra-buttons/EditInDialogButton.d.ts.map +1 -1
  11. package/dist/components/ra-fields/ReferenceManyField.d.ts.map +1 -1
  12. package/dist/components/ra-forms/Create.d.ts +1 -1
  13. package/dist/components/ra-forms/SimpleForm.d.ts.map +1 -1
  14. package/dist/components/ra-forms/TabbedForm.d.ts.map +1 -1
  15. package/dist/contexts/MenuConfigContext.d.ts.map +1 -1
  16. package/dist/index.d.ts +1 -1
  17. package/dist/react-admin.cjs.js +77 -73
  18. package/dist/react-admin.cjs.js.map +1 -1
  19. package/dist/react-admin.es.js +12717 -11514
  20. package/dist/react-admin.es.js.map +1 -1
  21. package/dist/react-admin.umd.js +76 -72
  22. package/dist/react-admin.umd.js.map +1 -1
  23. package/dist/themes/overrides/Dialog.d.ts +10 -1
  24. package/dist/themes/overrides/Dialog.d.ts.map +1 -1
  25. package/package.json +1 -1
  26. package/src/components/ActionsMenu.tsx +0 -3
  27. package/src/components/Layout/Header/Profile/buttons/StopImpersonateButton.tsx +4 -2
  28. package/src/components/Layout/Navigation/NavGroup.tsx +1 -13
  29. package/src/components/Layout/Provider.tsx +6 -2
  30. package/src/components/MenuPopover/styles.jsx +2 -3
  31. package/src/components/ra-buttons/CreateInDialogButton.tsx +44 -31
  32. package/src/components/ra-buttons/EditInDialogButton.tsx +29 -30
  33. package/src/components/ra-fields/ReferenceManyField.tsx +1 -2
  34. package/src/components/ra-forms/CardForm.tsx +2 -2
  35. package/src/components/ra-forms/Create.tsx +2 -2
  36. package/src/components/ra-forms/Edit.tsx +2 -2
  37. package/src/components/ra-forms/LongForm/BaseForm.tsx +1 -1
  38. package/src/components/ra-forms/SimpleForm.tsx +12 -11
  39. package/src/components/ra-forms/TabbedForm.tsx +8 -6
  40. package/src/components/ra-pages/RecoverPage.tsx +1 -1
  41. package/src/contexts/MenuConfigContext.tsx +2 -3
  42. package/src/dev/ErrorEventHandler.ts +2 -2
  43. package/src/index.jsx +3 -0
  44. package/src/playground/components/ra-forms/UserForm.jsx +14 -1
  45. package/src/playground/menu.jsx +1 -1
  46. package/src/themes/index.jsx +1 -1
  47. package/src/themes/overrides/Dialog.jsx +10 -1
  48. package/src/themes/overrides/index.jsx +1 -1
@@ -1,10 +1,19 @@
1
- export default function Dialog(): {
1
+ export default function Dialog(theme: any): {
2
2
  MuiDialog: {
3
3
  styleOverrides: {
4
4
  root: {
5
5
  '& .MuiBackdrop-root': {
6
6
  backgroundColor: string;
7
7
  };
8
+ '& .MuiCardContent-root': {
9
+ [x: number]: {
10
+ paddingBottom: string;
11
+ };
12
+ };
13
+ '& .MuiPaper-root:has(.tabbed-form)': {
14
+ overflowY: string;
15
+ width: string;
16
+ };
8
17
  };
9
18
  };
10
19
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/themes/overrides/Dialog.jsx"],"names":[],"mappings":"AAKA;;;;;;;;;;EAYC"}
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/themes/overrides/Dialog.jsx"],"names":[],"mappings":"AAKA;;;;;;;;;;;;;;;;;;;EAqBC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@applica-software-guru/react-admin",
3
- "version": "1.4.0-beta.6",
3
+ "version": "1.4.0-beta.8",
4
4
  "private": false,
5
5
  "repository": {
6
6
  "type": "git",
@@ -17,7 +17,6 @@ const StyledMenuPopover = styled(MenuPopover, {
17
17
  '& .MuiMenuItem-root': {
18
18
  padding: 0,
19
19
  margin: 0,
20
- // backgroundColor: theme.palette.background.paper,
21
20
  '& .MuiButton-startIcon': {
22
21
  marginRight: theme.spacing(0)
23
22
  }
@@ -65,8 +64,6 @@ export function ActionsMenu({ horizontal = false, children }: ActionsMenuProps):
65
64
  }
66
65
 
67
66
  const handleOnClick = useCallback((e: any) => {
68
- e.stopPropagation();
69
- e.preventDefault();
70
67
  setOpen(null);
71
68
 
72
69
  if (typeof e.currentTarget?.onClick === 'function') {
@@ -8,16 +8,18 @@ const StopImpersonateButton = () => {
8
8
  const translate = useTranslate();
9
9
  const authProvider = useAuthProvider();
10
10
  const stopImpersonating = useCallback(
11
- () => authProvider?.stopImpersonate().then(() => (document.location.href = '/')),
11
+ () => authProvider.stopImpersonate().then(() => (document.location.href = '/')),
12
12
  [authProvider?.stopImpersonating]
13
13
  );
14
14
  const [isImpersonating, setIsImpersonating] = useState(false);
15
15
 
16
16
  useEffect(() => {
17
17
  if (!authProvider.isImpersonating) {
18
+ // eslint-disable-next-line no-console
19
+ console.warn('The authProvider does not support the isImpersonating feature', authProvider);
18
20
  return;
19
21
  }
20
- authProvider?.isImpersonating().then((isImpersonating: boolean) => setIsImpersonating(isImpersonating));
22
+ authProvider.isImpersonating().then((isImpersonating: boolean) => setIsImpersonating(isImpersonating));
21
23
  }, [authProvider, setIsImpersonating]);
22
24
 
23
25
  if (!isImpersonating) {
@@ -1,12 +1,11 @@
1
1
  import { Box, ClickAwayListener, List, ListItemButton, ListItemIcon, ListItemText, Paper, Popper, Typography, Theme } from '@mui/material';
2
2
  import { DownOutlined, RightOutlined } from '@ant-design/icons';
3
- import { Fragment, useEffect, useState } from 'react';
3
+ import React, { Fragment, useEffect, useState } from 'react';
4
4
  import { styled, useTheme } from '@mui/material/styles';
5
5
  import { useMenuConfig } from '../../../hooks';
6
6
 
7
7
  import NavCollapse from './NavCollapse';
8
8
  import NavItem from './NavItem';
9
- import PropTypes from 'prop-types';
10
9
  import { Transitions } from '../../@extended';
11
10
  import { useTranslate } from 'react-admin';
12
11
  import { useLayoutMediaState } from '../Provider';
@@ -336,15 +335,4 @@ const NavGroup = ({
336
335
  );
337
336
  };
338
337
 
339
- NavGroup.propTypes = {
340
- item: PropTypes.object,
341
- lastItem: PropTypes.number,
342
- remItems: PropTypes.array,
343
- lastItemId: PropTypes.string,
344
- setSelectedItems: PropTypes.func,
345
- selectedItems: PropTypes.string,
346
- setSelectedLevel: PropTypes.func,
347
- selectedLevel: PropTypes.number
348
- };
349
-
350
338
  export { NavGroup };
@@ -132,8 +132,6 @@ const DefaultState: ILayoutState = {
132
132
 
133
133
  function LayoutProvider(props: ILayoutProviderProps) {
134
134
  const authProvider = useAuthProvider<IApplicaAuthProvider>();
135
- // eslint-disable-next-line no-console
136
- console.log('authProvider: ', authProvider);
137
135
  const identity = useGetIdentity() as UseGetIdentityResult,
138
136
  theme = useTheme(),
139
137
  downMd = useMediaQuery(theme.breakpoints.down('md')),
@@ -219,6 +217,12 @@ function LayoutProvider(props: ILayoutProviderProps) {
219
217
  }, [theme.palette.mode]);
220
218
 
221
219
  useEffect(() => {
220
+ // Check if authProvider contains a method called isImpersonating
221
+ if (!authProvider.isImpersonating) {
222
+ // eslint-disable-next-line no-console
223
+ console.warn('authProvider does not contain a method called isImpersonating', authProvider);
224
+ return;
225
+ }
222
226
  authProvider?.isImpersonating().then((isImpersonating: boolean) => {
223
227
  setNeedToChangePassword(!isImpersonating && identity?.data?.needToChangePassword === true);
224
228
  });
@@ -5,8 +5,7 @@ export const StyledArrow = styled('span')(({ arrow, theme }) => {
5
5
 
6
6
  const POSITION = -(SIZE / 2);
7
7
 
8
- const borderStyle =
9
- theme.palette.mode === 'dark' ? `solid 1px ${theme.palette.grey[100]}` : `solid 1px ${alpha(theme.palette.grey[500], 0.12)}`;
8
+ const borderStyle = theme.palette.mode === 'dark' ? `none` : `solid 1px ${alpha(theme.palette.grey[500], 0.12)}`;
10
9
 
11
10
  const topStyle = {
12
11
  borderRadius: '0 0 3px 0',
@@ -31,7 +30,7 @@ export const StyledArrow = styled('span')(({ arrow, theme }) => {
31
30
 
32
31
  const rightStyle = {
33
32
  borderRadius: '0 0 0 3px',
34
- right: POSITION - 1,
33
+ right: POSITION,
35
34
  borderBottom: borderStyle,
36
35
  borderLeft: borderStyle
37
36
  };
@@ -2,6 +2,7 @@ import {
2
2
  Button,
3
3
  CreateButtonClasses,
4
4
  CreateContextProvider,
5
+ CreateControllerProps,
5
6
  CreateControllerResult,
6
7
  RedirectionSideEffect,
7
8
  SaveButton,
@@ -9,16 +10,17 @@ import {
9
10
  useNotify,
10
11
  useRedirect,
11
12
  useResourceContext,
12
- useTranslate
13
+ useTranslate,
14
+ UseCreateMutateParams
13
15
  } from 'react-admin';
14
- import { Dialog, Fab, useMediaQuery, useTheme } from '@mui/material';
16
+ import { Dialog, Fab, useMediaQuery } from '@mui/material';
15
17
  import React, { useCallback, useState } from 'react';
16
18
  import { SxProps, Theme, styled } from '@mui/material/styles';
17
- import { PlusCircleOutlined } from '@ant-design/icons';
18
19
  import { Toolbar } from '../ra-forms';
19
20
  import clsx from 'clsx';
20
21
  import { useAppConfig } from '../../hooks';
21
22
  import { useQueryClient } from 'react-query';
23
+ import ContentAdd from '@mui/icons-material/Add';
22
24
 
23
25
  const updateColl = (old: any, data: any) => {
24
26
  const id = data.id;
@@ -38,13 +40,23 @@ const setManyQueryData = (coll: any, data: any) => (coll && coll.length > 0 ? up
38
40
  const setListQueryData = (res: any, data: any) =>
39
41
  res && res.data ? { ...res, data: updateColl(res.data, data), total: res.total + 1 } : res;
40
42
 
41
- export type CreateInDialogContentProps = {
43
+ export type CreateInDialogContentProps = CreateControllerProps & {
42
44
  onClose: () => void;
43
45
  record?: any;
44
46
  redirect: RedirectionSideEffect | boolean | undefined;
45
47
  children: React.ReactElement;
48
+ /**
49
+ * You can use it to handle the form submission yourself.
50
+ * Good luck with that.
51
+ */
46
52
  onSubmit?: (record: any, close: () => void) => void;
47
- onSuccess?: (data: any) => void;
53
+ /**
54
+ * @deprecated Use mutationOptions.onSuccess instead
55
+ */
56
+ onSuccess?: (data: any, close: () => void) => void;
57
+ /**
58
+ * @deprecated Use mutationOptions.onError instead
59
+ */
48
60
  onError?: (error: any) => void;
49
61
  };
50
62
 
@@ -55,14 +67,15 @@ const CreateInDialogContent = ({
55
67
  redirect: _redirect = false,
56
68
  onSubmit,
57
69
  onSuccess,
58
- onError
70
+ onError,
71
+ ...props
59
72
  }: CreateInDialogContentProps) => {
60
73
  const queryClient = useQueryClient();
61
74
  const resource = useResourceContext();
62
75
  const redirect = useRedirect();
63
76
  const notify = useNotify();
64
77
  const handleSuccess = useCallback(
65
- (data: any) => {
78
+ (data: any, variables: UseCreateMutateParams<any>, context: unknown) => {
66
79
  const now = Date.now();
67
80
  const updatedAt = now;
68
81
 
@@ -81,13 +94,18 @@ const CreateInDialogContent = ({
81
94
  redirect(_redirect as RedirectionSideEffect, resource, data.id, data);
82
95
  }
83
96
  if (onSuccess) {
84
- onSuccess(data);
97
+ onSuccess(data, onClose);
98
+ }
99
+ if (props?.mutationOptions?.onSuccess) {
100
+ props.mutationOptions.onSuccess(data, variables, { ...(context as any), onClose });
85
101
  }
86
102
  },
87
103
  [onClose, onSuccess, queryClient, resource, notify, redirect, _redirect]
88
104
  );
89
105
  const { save, ...createProps } = useCreateController({
106
+ ...props,
90
107
  mutationOptions: {
108
+ ...props?.mutationOptions,
91
109
  onSuccess: handleSuccess,
92
110
  onError: onError
93
111
  }
@@ -115,6 +133,7 @@ const CreateInDialogContent = ({
115
133
  >
116
134
  {React.cloneElement(children, {
117
135
  ...children.props,
136
+ modal: true,
118
137
  toolbar: (
119
138
  <Toolbar>
120
139
  <Button variant="text" size="medium" label="ra.action.cancel" onClick={onClose} disabled={createProps?.saving} />
@@ -144,7 +163,7 @@ const StyledFab = styled(Fab, { overridesResolver: (_props, styles) => styles.ro
144
163
  }
145
164
  }));
146
165
 
147
- export type CreateInDialogButtonProps = {
166
+ export type CreateInDialogButtonProps = CreateControllerProps & {
148
167
  fullWidth?: boolean;
149
168
  maxWidth?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
150
169
  label?: string;
@@ -159,8 +178,18 @@ export type CreateInDialogButtonProps = {
159
178
  * If set to false, the button will always render as a regular button, regardless of the screen size.
160
179
  */
161
180
  fab: boolean;
181
+ /**
182
+ * @deprecated Use mutationOptions.onSubmit instead
183
+ */
162
184
  onSubmit?: (record: any, close: () => void) => void;
185
+ /**
186
+ * @deprecated Use mutationOptions.onSuccess instead
187
+ */
163
188
  onSuccess?: (data: any) => void;
189
+ /**
190
+ *
191
+ * @deprecated Use mutationOptions.onError instead
192
+ */
164
193
  onError?: (error: any) => void;
165
194
  };
166
195
 
@@ -181,14 +210,12 @@ export function CreateInDialogButton({
181
210
  onSubmit,
182
211
  onSuccess,
183
212
  onError,
184
- ...props
213
+ ...controllerProps
185
214
  }: CreateInDialogButtonProps): JSX.Element {
186
215
  const [open, setOpen] = useState(false);
187
216
  const translate = useTranslate();
188
217
  const resource = useResourceContext();
189
218
  const { openDialog, closeDialog } = useAppConfig();
190
- const theme = useTheme();
191
-
192
219
  const handleOpen = useCallback(() => openDialog(resource, () => setOpen(true)), [openDialog, resource]);
193
220
  const handleClose = useCallback(() => closeDialog(resource, () => setOpen(false)), [closeDialog, resource]);
194
221
  const isSmall = fab && useMediaQuery((theme: Theme) => theme.breakpoints.down('md'));
@@ -196,7 +223,6 @@ export function CreateInDialogButton({
196
223
  <>
197
224
  {isSmall ? (
198
225
  <StyledFab
199
- {...props}
200
226
  // @ts-ignore
201
227
  state={scrollStates[String(scrollToTop)]}
202
228
  color="primary"
@@ -204,29 +230,16 @@ export function CreateInDialogButton({
204
230
  aria-label={label && translate(label)}
205
231
  onClick={handleOpen}
206
232
  >
207
- <PlusCircleOutlined />
233
+ <ContentAdd />
208
234
  </StyledFab>
209
235
  ) : (
210
- <Button {...props} sx={sx} label={label} onClick={handleOpen} style={style}>
211
- <PlusCircleOutlined />
236
+ <Button sx={sx} label={label} onClick={handleOpen} style={style}>
237
+ <ContentAdd />
212
238
  </Button>
213
239
  )}
214
- <Dialog
215
- open={open}
216
- scroll="body"
217
- sx={{
218
- '& .MuiToolbar-root': {
219
- borderTop: `1px solid ${theme.palette.divider}`,
220
- position: 'initial',
221
- padding: 2.5
222
- }
223
- }}
224
- onClose={handleClose}
225
- fullWidth={fullWidth}
226
- maxWidth={maxWidth}
227
- >
240
+ <Dialog open={open} scroll="body" onClose={handleClose} fullWidth={fullWidth} maxWidth={maxWidth}>
228
241
  <CreateInDialogContent
229
- {...props}
242
+ {...controllerProps}
230
243
  redirect={redirect}
231
244
  record={record}
232
245
  onClose={handleClose}
@@ -2,6 +2,7 @@
2
2
  import {
3
3
  Button,
4
4
  EditContextProvider,
5
+ EditControllerProps,
5
6
  SaveButton,
6
7
  useEditController,
7
8
  useGetOne,
@@ -11,36 +12,44 @@ import {
11
12
  } from 'react-admin';
12
13
  import React, { useCallback, useState } from 'react';
13
14
 
14
- import { Breakpoint, Dialog, useTheme } from '@mui/material';
15
+ import { Breakpoint, Dialog } from '@mui/material';
15
16
  import { Edit } from '@mui/icons-material';
16
17
  import { Toolbar } from '../ra-forms';
17
18
  import { useAppConfig } from '../../hooks';
18
19
 
19
- type EditInDialogContentProps = {
20
+ type EditInDialogContentProps = EditControllerProps & {
20
21
  onClose: () => void;
21
22
  children: React.ReactElement;
22
23
  };
23
- const EditInDialogContent = ({ onClose, children }: EditInDialogContentProps) => {
24
+ const EditInDialogContent = ({ onClose, children, mutationMode = 'pessimistic', ...props }: EditInDialogContentProps) => {
24
25
  const notify = useNotify();
25
26
  const record = useRecordContext();
26
27
  const resource = useResourceContext();
27
28
  const { id } = record;
28
29
  const { isLoading, data } = useGetOne(resource, { id });
29
30
 
30
- const handleSuccess = useCallback(() => {
31
- notify('ra.notification.updated', {
32
- type: 'info',
33
- messageArgs: {
34
- smart_count: 1
31
+ const handleSuccess = useCallback(
32
+ (...args: any) => {
33
+ notify('ra.notification.updated', {
34
+ type: 'info',
35
+ messageArgs: {
36
+ smart_count: 1
37
+ }
38
+ });
39
+ onClose();
40
+ if (props.onSuccess) {
41
+ props.onSuccess(...args);
35
42
  }
36
- });
37
- onClose();
38
- }, [onClose, notify]);
43
+ },
44
+ [onClose, notify]
45
+ );
39
46
  const { save, saving } = useEditController({
47
+ ...props,
40
48
  resource,
41
49
  id,
42
- mutationMode: 'pessimistic',
50
+ mutationMode,
43
51
  mutationOptions: {
52
+ ...props?.mutationOptions,
44
53
  onSuccess: handleSuccess
45
54
  }
46
55
  });
@@ -56,6 +65,8 @@ const EditInDialogContent = ({ onClose, children }: EditInDialogContentProps) =>
56
65
  }}
57
66
  >
58
67
  {React.cloneElement(children, {
68
+ ...children.props,
69
+ modal: true,
59
70
  toolbar: (
60
71
  <Toolbar>
61
72
  <Button variant="text" size="medium" label="ra.action.cancel" onClick={onClose} />
@@ -67,7 +78,7 @@ const EditInDialogContent = ({ onClose, children }: EditInDialogContentProps) =>
67
78
  );
68
79
  };
69
80
 
70
- export type EditInDialogButtonProps = {
81
+ export type EditInDialogButtonProps = EditControllerProps & {
71
82
  fullWidth?: boolean;
72
83
  maxWidth?: false | Breakpoint | undefined;
73
84
  label?: string;
@@ -80,6 +91,7 @@ export function EditInDialogButton({
80
91
  maxWidth = 'md',
81
92
  label = 'ra.action.edit',
82
93
  style,
94
+ children,
83
95
  ...props
84
96
  }: EditInDialogButtonProps): JSX.Element {
85
97
  const [open, setOpen] = useState(false);
@@ -87,28 +99,15 @@ export function EditInDialogButton({
87
99
  const resource = useResourceContext();
88
100
  const handleOpen = useCallback(() => openDialog(resource, () => setOpen(true)), [openDialog, resource]);
89
101
  const handleClose = useCallback(() => closeDialog(resource, () => setOpen(false)), [closeDialog, resource]);
90
- const theme = useTheme();
91
-
92
102
  return (
93
103
  <>
94
104
  <Button label={label} onClick={handleOpen} style={style}>
95
105
  <Edit />
96
106
  </Button>
97
- <Dialog
98
- open={open}
99
- scroll="body"
100
- sx={{
101
- '& .MuiToolbar-root': {
102
- borderTop: `1px solid ${theme.palette.divider}`,
103
- position: 'initial',
104
- padding: 2.5
105
- }
106
- }}
107
- onClose={handleClose}
108
- fullWidth={fullWidth}
109
- maxWidth={maxWidth}
110
- >
111
- <EditInDialogContent onClose={handleClose}>{props?.children}</EditInDialogContent>
107
+ <Dialog open={open} scroll="body" onClose={handleClose} fullWidth={fullWidth} maxWidth={maxWidth}>
108
+ <EditInDialogContent {...props} onClose={handleClose}>
109
+ {children}
110
+ </EditInDialogContent>
112
111
  </Dialog>
113
112
  </>
114
113
  );
@@ -37,8 +37,7 @@ const StyledRoot = styled(StyledDiv, { slot: 'root' })(({ theme, bulkActionButto
37
37
  },
38
38
  [theme.breakpoints.down('md')]: {
39
39
  marginTop: 0,
40
- display: 'none',
41
- visibility: 'hidden'
40
+ display: 'contents'
42
41
  }
43
42
  }
44
43
  },
@@ -71,10 +71,10 @@ const StyledForm = styled(Form, { slot: 'root' })(({ theme, spacing }: StyledFor
71
71
  minHeight: 'unset'
72
72
  },
73
73
  '& .RaToolbar-mobileToolbar': {
74
- paddingTop: '20px !important',
74
+ paddingTop: `${theme.spacing(2.5)} !important`,
75
75
  paddingRight: '0 !important',
76
76
  paddingLeft: '0 !important',
77
- paddingBottom: 0,
77
+ paddingBottom: '0 !important',
78
78
  }
79
79
  }));
80
80
 
@@ -83,8 +83,8 @@ export const Create = styled(CreateWithDefaults, { slot: 'root' })(({ theme }) =
83
83
  },
84
84
  '& .RaToolbar-mobileToolbar': {
85
85
  position: 'initial !important',
86
- paddingLeft: '20px !important',
87
- paddingRight: '20px !important',
86
+ paddingLeft: `${theme.spacing(2.5)} !important`,
87
+ paddingRight: `${theme.spacing(2.5)} !important`,
88
88
  paddingTop: '0 !important',
89
89
  },
90
90
  // Ci ho messo 4 ore per scrivere questa riga di codice e risolvere un problema con react-sticky-box ed i Long Form.
@@ -16,8 +16,8 @@ const StyledEdit = styled(RaEdit, { slot: 'root' })(({ theme }) => ({
16
16
 
17
17
  '& .RaToolbar-mobileToolbar': {
18
18
  position: 'initial !important',
19
- paddingLeft: '20px !important',
20
- paddingRight: '20px !important',
19
+ paddingLeft: `${theme.spacing(2.5)} !important`,
20
+ paddingRight: `${theme.spacing(2.5)} !important`,
21
21
  paddingTop: '0 !important'
22
22
  },
23
23
  '& .RaEdit-main': {
@@ -31,7 +31,7 @@ const StyledGrid = styled(Grid, {
31
31
  },
32
32
  '& .RaToolbar-mobileToolbar': {
33
33
  position: 'initial !important',
34
- paddingTop: '20px !important',
34
+ paddingTop: `${theme.spacing(2.5)} !important`,
35
35
  paddingLeft: '0 !important',
36
36
  paddingRight: '0 !important',
37
37
  paddingBottom: '0 !important',
@@ -5,19 +5,16 @@ import {
5
5
  SaveButton,
6
6
  useRecordContext
7
7
  } from 'react-admin';
8
- import { styled } from '@mui/system';
8
+ import { styled, useTheme } from '@mui/system';
9
9
  import { useResourceTitle } from '../../hooks';
10
10
  import ActionsMenu from '../ActionsMenu';
11
11
  import MainCard from '../MainCard';
12
12
  import Toolbar from './Toolbar';
13
13
 
14
- const StyledSimpleForm = styled(RaSimpleForm, { slot: 'Root' })(({ theme, modal }: { theme: any; modal: boolean }) => ({
15
- '& .MuiGrid-root.MuiGrid-container': {
16
- paddingBottom: theme.spacing(modal ? 0 : 2.5)
17
- } as any,
18
- // [theme.breakpoints.down('sm')]: {
19
- paddingBottom: '0 !important',
20
- // }
14
+ const StyledSimpleForm = styled(RaSimpleForm, { slot: 'Root' })(({ theme }: { theme: any }) => ({
15
+ [theme.breakpoints.down('sm')]: {
16
+ paddingBottom: `${theme.spacing(2.5)}`
17
+ }
21
18
  }));
22
19
 
23
20
  export type SimpleFormProps = RaSimpleFormProps & {
@@ -49,6 +46,7 @@ export function SimpleForm({
49
46
  }: SimpleFormProps): JSX.Element {
50
47
  const cardTitle = useResourceTitle(title);
51
48
  const record = useRecordContext();
49
+ const theme = useTheme();
52
50
  return (
53
51
  // @ts-ignore
54
52
  <MainCard
@@ -59,9 +57,12 @@ export function SimpleForm({
59
57
  sx={{
60
58
  ...sx,
61
59
  '& .MuiToolbar-root': {
62
- paddingLeft: 2.5,
63
- paddingRight: 2.5,
64
- paddingBottom: 2.5
60
+ position: 'initial',
61
+ paddingLeft: theme.spacing(2.5),
62
+ paddingRight: theme.spacing(2.5),
63
+ paddingBottom: theme.spacing(2.5),
64
+ paddingTop: modal ? theme.spacing(2.5) : 0,
65
+ borderTop: modal ? `1px solid ${theme.palette.divider}` : undefined,
65
66
  }
66
67
  }}
67
68
  border={!modal}
@@ -1,4 +1,4 @@
1
- import { Box } from '@mui/material';
1
+ import { Box, useTheme } from '@mui/material';
2
2
  import { styled } from '@mui/system';
3
3
  import {
4
4
  TabbedForm as RaTabbedForm,
@@ -25,9 +25,9 @@ export type TabbedFormProps = RaTabbedFormProps & {
25
25
  noPadding?: boolean;
26
26
  };
27
27
 
28
- const StyledTabbedForm = styled(RaTabbedForm, { slot: 'Root' })(({ theme, modal }: { theme: any; modal: boolean }) => ({
28
+ const StyledTabbedForm = styled(RaTabbedForm, { slot: 'Root' })(({ theme }: { theme: any }) => ({
29
29
  '& .MuiGrid-root.MuiGrid-container': {
30
- paddingBottom: theme.spacing(modal ? 0 : 1)
30
+ paddingBottom: 0
31
31
  } as any,
32
32
  [theme.breakpoints.down('sm')]: {
33
33
  paddingBottom: 0,
@@ -62,6 +62,7 @@ export function TabbedForm(props: TabbedFormProps): JSX.Element {
62
62
  ...rest
63
63
  } = props;
64
64
  const title = useResourceTitle(_title);
65
+ const theme = useTheme();
65
66
 
66
67
  return (
67
68
  <MainCard
@@ -76,16 +77,17 @@ export function TabbedForm(props: TabbedFormProps): JSX.Element {
76
77
  m: 2.5,
77
78
  mb: 0
78
79
  },
79
- '& .tabbed-form .MuiDivider-root': {
80
+ '& .tabbed-form > .MuiDivider-root': {
80
81
  ml: 2.5,
81
82
  mr: 2.5
82
83
  },
83
84
  '& .MuiToolbar-root.RaToolbar-desktopToolbar': {
84
85
  position: 'initial',
85
- paddingTop: 0
86
+ paddingTop: modal ? theme.spacing(2.5) : 0
86
87
  },
87
88
  '& .MuiToolbar-root': {
88
- padding: 2.5
89
+ padding: theme.spacing(2.5),
90
+ borderTop: modal ? `1px solid ${theme.palette.divider}` : undefined
89
91
  }
90
92
  }}
91
93
  border={!modal}
@@ -29,7 +29,7 @@ const RecoverPage = ({ name, copy, logo, version, background }: BaseAuthProps) =
29
29
  redirect('/login');
30
30
  })
31
31
  .catch((error: any) => {
32
- notify(error, { type: 'error' });
32
+ notify(error?.message || error?.toString(), { type: 'error' });
33
33
  })
34
34
  .finally(() => setLoading(false));
35
35
  };
@@ -1,6 +1,5 @@
1
1
  import { MenuProps } from '../types';
2
- import { createContext, useEffect } from 'react';
3
- import { useLocalStorage } from '../hooks';
2
+ import { createContext, useEffect, useState } from 'react';
4
3
 
5
4
  export type MenuConfigContextProps = {
6
5
  openItem: string[];
@@ -40,7 +39,7 @@ export type MenuConfigProviderProps = {
40
39
  };
41
40
 
42
41
  const MenuConfigProvider = ({ menu, children }: MenuConfigProviderProps) => {
43
- const [menuConfig, setMenuConfig] = useLocalStorage('menu-config', { ...initialState, menu }) as any;
42
+ const [menuConfig, setMenuConfig] = useState({ ...initialState, menu }) as any;
44
43
  const setMenu = (menu: MenuProps) => setMenuConfig((menuConfig: MenuConfigContextProps) => ({ ...menuConfig, menu }));
45
44
  const activeItem = (openItem: string) => setMenuConfig((menuConfig: MenuConfigContextProps) => ({ ...menuConfig, openItem }));
46
45
  const activeID = (selectedID: string) => setMenuConfig((menuConfig: MenuConfigContextProps) => ({ ...menuConfig, selectedID }));
@@ -39,9 +39,9 @@ class ErrorEventHandler implements IErrorEventHandler {
39
39
  column: error.colno,
40
40
  stack: error.error?.stack,
41
41
  })
42
- }).catch(() => {
42
+ }).catch((error) => {
43
43
  // eslint-disable-next-line no-console
44
- console.log('Unable to send error to server');
44
+ console.warn('Unable to send error to server', error);
45
45
  this.#handledErrors.delete(hash);
46
46
  });
47
47
  return;
package/src/index.jsx CHANGED
@@ -57,9 +57,11 @@ export {
57
57
  useAuthProvider,
58
58
  useChoices,
59
59
  useChoicesContext,
60
+ useCreateContext,
60
61
  useCreateController,
61
62
  useDataProvider,
62
63
  useEditContext,
64
+ useEditController,
63
65
  useGetIdentity,
64
66
  useGetList,
65
67
  useGetMany,
@@ -67,6 +69,7 @@ export {
67
69
  useGetOne,
68
70
  useInput,
69
71
  useListContext,
72
+ useListController,
70
73
  useLocaleState,
71
74
  useNotify,
72
75
  usePermissions,