@dashadmin/dash-admin 1.3.24 → 1.3.26

package/src/templates/ResourceTemplate.tsx

@@ -0,0 +1,240 @@
+/* eslint-disable no-mixed-spaces-and-tabs */
+
+import { CustomRoutes, NotFound, ResourceContextProvider, ResourceProps, RestoreScrollPosition, useLocaleState } from 'react-admin';
+import { Route, Routes, useParams } from 'react-router-dom';
+import { isValidElementType } from 'react-is';
+//import { Outlet } from 'react-router';
+import {
+    IDashAutoAdminResourceConfig,
+    evalActionPermission,
+} from 'dash-auto-admin';
+import React, { ComponentType, PropsWithChildren, ReactElement, isValidElement, useEffect } from 'react';
+import MotionWrapper from '../layout/MotionWrapper';
+import Redirect from '../components/Redirect';
+import { ResourceTemplateCreate } from './ResourceTemplateCreate';
+import { ResourceTemplateEdit } from './ResourceTemplateEdit';
+import { ResourceTemplateList } from './ResourceTemplateList';
+import { ResourceTemplateShow } from './ResourceTemplateShow';
+import { DASHAdminSystemConstants } from 'dash-constants'
+
+import TrashTemplate from './TrashTemplate';
+import { DashResourceProvider } from '../contexts/DashResourceContext';
+import { Resource } from '../react-admin-dash/Resource';
+
+//import {Resource} from "react-admin";
+export interface IResourceTemplate {
+    resourceConfig: IDashAutoAdminResourceConfig;
+    locale?: string;
+}
+
+export const ResourceTemplate = (resourceConfig: IDashAutoAdminResourceConfig & { locale?: string }) => {
+    // const [locale] = useLocaleState(); // Removed hook to allow function call
+    const locale = resourceConfig.locale;
+    const debug = false;
+
+    const _create = evalActionPermission(resourceConfig, resourceConfig?.create);
+    const _edit = evalActionPermission(resourceConfig, resourceConfig?.edit);
+    const _view = evalActionPermission(resourceConfig, resourceConfig?.view);
+    const _list = evalActionPermission(resourceConfig, resourceConfig?.list); // TODO: when view is false, the show routes still works.
+    const _delete = evalActionPermission(resourceConfig, resourceConfig?.delete);
+
+    const URL_PREFIX = DASHAdminSystemConstants.system.URL_PREFIX;
+    const PATH = resourceConfig.model;
+
+    /*if (debug) {
+      
+        console.info(`${PATH} ResourceTemplate`, {
+            path: resourceConfig.path,
+            resourceConfig: resourceConfig,
+            evaluatedPermissions: {
+                create: _create,
+                edit: _edit,
+                view: _view,
+                list: _list,
+                delete: _delete,
+            },
+        });
+        
+    }*/
+    const a = '*';
+    const idParamName = resourceConfig?.idParamName || 'id';
+    //const { [idParamName]: id, [a]: all } = useParams();
+
+    /*useEffect(()=> {
+        console.log('ResourceTemplate useEffect', resourceConfig);
+         console.log('ResourceTemplate _view', _view);
+     },[]);*/
+
+    return (
+        <>
+            <CustomRoutes>
+                {/* Custom routes from resource config - rendered at top level */}
+                {typeof resourceConfig.customRoutes === 'function'
+                    ? resourceConfig.customRoutes(resourceConfig)
+                    : null}
+
+                {/* Automatic trash routes if trash is enabled */}
+                {/* Moved outside */}
+
+                <Route element={<MotionWrapper />}>
+
+                    {resourceConfig?.drawer === true && resourceConfig?.drawerOptions?.create !== false ? (
+                        <Route
+                            path={URL_PREFIX + PATH + '/create'}
+                            element={
+                                <DashResourceProvider resourceConfig={resourceConfig}><Redirect
+                                    stateHashPattern={
+                                        URL_PREFIX + PATH + '/inline/create'
+                                    }
+                                    method='list'
+                                    drawerMethod='create'
+                                    resourceConfig={resourceConfig}
+                                /></DashResourceProvider>
+                            }
+                        />
+                    ) : null}
+                    {resourceConfig?.drawer === true && resourceConfig?.drawerOptions?.edit !== false ? (
+                        <Route
+                            path={URL_PREFIX + PATH + '/inline'}
+                            element={
+                                <DashResourceProvider resourceConfig={resourceConfig}><Redirect
+                                    stateHashPattern={URL_PREFIX + PATH + '/inline'}
+                                    method='list'
+                                    drawerMethod='edit'
+                                    resourceConfig={resourceConfig}
+                                /></DashResourceProvider>
+                            }
+                        />
+                    ) : null}
+                    {resourceConfig?.drawer === true && resourceConfig?.drawerOptions?.view !== false ? (
+                        <Route
+                            path={URL_PREFIX + PATH + '/inline/:' + idParamName}
+                            element={
+                                <DashResourceProvider resourceConfig={resourceConfig}><Redirect
+                                    stateHashPattern={
+                                        URL_PREFIX +
+                                        PATH +
+                                        '/inline/:' +
+                                        idParamName +
+                                        '/:method'
+                                    }
+                                    method='list'
+                                    drawerMethod='edit'
+                                    resourceConfig={resourceConfig}
+                                /></DashResourceProvider>
+                            }
+                        />
+                    ) : null}
+                    {resourceConfig?.drawer === true && resourceConfig?.drawerOptions?.edit !== false ? (
+                        <Route
+                            path={URL_PREFIX + PATH + '/inline/:' + idParamName + '/edit'}
+                            element={
+                                <DashResourceProvider resourceConfig={resourceConfig}><Redirect
+                                    stateHashPattern={
+                                        URL_PREFIX +
+                                        PATH +
+                                        '/inline/:' +
+                                        idParamName +
+                                        '/:method'
+                                    }
+                                    method='list'
+                                    drawerMethod='edit'
+                                    resourceConfig={resourceConfig}
+                                /></DashResourceProvider>
+                            }
+                        />
+                    ) : null}
+                    {resourceConfig?.drawer === true && resourceConfig?.drawerOptions?.view !== false ? (
+                        <Route
+                            path={URL_PREFIX + PATH + '/inline/:' + idParamName + '/show'}
+                            element={
+                                <DashResourceProvider resourceConfig={resourceConfig}><Redirect
+                                    stateHashPattern={
+                                        URL_PREFIX +
+                                        PATH +
+                                        '/inline/:' +
+                                        idParamName +
+                                        '/:method'
+                                    }
+                                    method='list'
+                                    drawerMethod='show'
+                                    resourceConfig={resourceConfig}
+                                /></DashResourceProvider>
+                            }
+                        />
+                    ) : null}
+                    {resourceConfig?.drawer === true && resourceConfig?.drawerOptions?.create !== false ? (
+                        <Route
+                            path={URL_PREFIX + PATH + '/inline/create'}
+                            element={
+                                <DashResourceProvider resourceConfig={resourceConfig}><Redirect
+                                    stateHashPattern={URL_PREFIX + PATH + '/inline/create'}
+                                    method='list'
+                                    drawerMethod='create'
+                                    resourceConfig={resourceConfig}
+                                /></DashResourceProvider>
+                            }
+                        />
+                    ) : null}
+
+                </Route>
+
+                <Route
+                    path="*"
+                    element={
+                        debug ? (
+                            <div>
+                                <h3>ResourceTemplate Debug</h3>
+                                <p>Resource: {resourceConfig.model}</p>
+                                <p>Current Path: {window.location.pathname}</p>
+                                <p>Expected: /{resourceConfig.model}</p>
+                            </div>
+                        ) : (
+                            <NotFound />
+                        )
+                    }
+                />
+            </CustomRoutes>
+
+            {/* Automatic trash routes if trash is enabled */}
+            {resourceConfig.trash ? TrashTemplate(resourceConfig, locale) : null}
+
+            <Resource
+                options={{ label: resourceConfig.label, group: resourceConfig.group }}
+                name={PATH}
+                recordRepresentation={resourceConfig?.recordRepresentation || "name"}
+                resourceConfig={resourceConfig}
+                // @ts-ignore Expected mismatch types, nevertheless compatible 
+                icon={resourceConfig?.icon || null}
+
+                {..._list && {
+                    list: () => {
+                        return <ResourceTemplateList resourceConfig={resourceConfig} locale={locale} />;
+                    }
+                }}
+
+                {..._create && {
+                    create: () => {
+                        return <ResourceTemplateCreate resourceConfig={resourceConfig} locale={locale} />;
+                    }
+                }}
+
+                {..._view && {
+                    show: () => {
+
+                        return <ResourceTemplateShow resourceConfig={resourceConfig} locale={locale} />;
+                    }
+                }}
+
+                {..._edit && {
+                    edit: () => {
+
+                        return <ResourceTemplateEdit resourceConfig={resourceConfig} locale={locale} />;
+                    }
+                }}
+            />
+        </>
+
+    );
+};
+export default ResourceTemplate;

package/src/templates/ResourceTemplateCreate.tsx

@@ -0,0 +1,167 @@
+/* eslint-disable no-mixed-spaces-and-tabs */
+
+import { useNotify, useTranslate } from 'react-admin';
+import { useRedirect } from 'react-admin';
+import { useRefresh } from 'react-admin';
+import { FC } from 'react';
+import { SimpleForm } from 'react-admin';
+import { Create } from 'react-admin';
+import {
+	DashAutoDrawer,
+	DashAutoCreate,
+} from 'dash-auto-admin';
+import { useDialog } from 'dash-dialog';
+import React from 'react';
+import ResourceLayout from '../layout/ResoureLayout';
+import { IResourceTemplate } from './ResourceTemplate';
+import { parseAxiosError } from '../helpers/parseAxiosError';
+import { useDashResource } from '../contexts/DashResourceContext';
+
+export const ResourceTemplateCreate: FC<IResourceTemplate> = (props) => {
+	//const {resourceConfig} = useDashResource()};
+    const {resourceConfig, locale} = props;
+	const notify = useNotify();
+	const translate = useTranslate();
+	const redirect = useRedirect();
+	const refresh = useRefresh();
+	//console.log("CREATE", resourceConfig)
+	const dialog = useDialog();
+
+	const _showNotifyAfterSubmit =
+		resourceConfig?.showNotifyAfterSubmit === false ? false : true;
+	const _showDialogAfterSubmit =
+		resourceConfig?.showDialogAfterSubmit === false ? false : true;
+
+	// @deprecated - removed currentAppPath logic that caused path duplication
+	const getRedirectPath = (path: string) => {
+		return `/${path}`.replace(/\/+/g, '/');
+	};
+
+	const onCreate = (data: any) => {
+
+		const translatedLabel = translate(resourceConfig.label, { _: resourceConfig.label });
+
+		if (_showNotifyAfterSubmit) {
+			notify('dash.resource.created', { type: 'success' });
+		}
+		if (_showDialogAfterSubmit) {
+			dialog({
+				variant: 'info',
+				title: translate('dash.resource.created'),
+				content: translate('dash.resource.created_message', { label: translatedLabel }),
+				onConfirm: () => {
+					switch (resourceConfig?.redirectAfterCreate) {
+						case false:
+							return;
+						case 'create':
+							redirect(getRedirectPath(`${resourceConfig.model}/create`));
+							break;
+						case 'view':
+							redirect(getRedirectPath(`${resourceConfig.model}/${data.id}/show`));
+							break;
+						case 'edit':
+							redirect(getRedirectPath(`${resourceConfig.model}/${data.id}`));
+							break;
+						case 'list':
+						default:
+							redirect(getRedirectPath(resourceConfig.model));
+							break;
+					}
+				},
+				onClose: () => {},
+			});
+		}
+
+		if (!_showDialogAfterSubmit && resourceConfig.redirectAfterCreate) {
+			switch (resourceConfig?.redirectAfterCreate) {
+				case 'create':
+					redirect(getRedirectPath(`${resourceConfig.model}/create`));
+					break;
+				case 'view':
+					redirect(getRedirectPath(`${resourceConfig.model}/${data.id}/show`));
+					break;
+				case 'edit':
+					redirect(getRedirectPath(`${resourceConfig.model}/${data.id}`));
+					break;
+				case 'list':
+				default:
+					redirect(getRedirectPath(resourceConfig.model));
+					break;
+			}
+		}
+
+		if (resourceConfig?.refreshAfter !== false) {
+			refresh();
+		}
+	};
+
+    const onError = (_error: any) => {
+        
+		if (resourceConfig.onError) {
+			resourceConfig.onError('create', _error);
+            return;
+		} 
+
+        const translatedLabel = translate(resourceConfig.label, { _: resourceConfig.label });
+
+        dialog({
+            variant: 'danger',
+            title: translate('dash.resource.error', { label: translatedLabel }),
+            content: `${parseAxiosError(_error)}`,
+            onConfirm: () => {},
+            onClose: () => {},
+        });
+
+	};
+	const onBeforeSubmit = (values: any) => {
+		return resourceConfig.beforeSubmit
+			? resourceConfig.beforeSubmit(values)
+			: values;
+	};
+
+	/*const ToolBar = () => (
+		<Toolbar>
+			<DashAutoAdminSaveButton
+				resourceConfig={resourceConfig}
+				onSubmit={onCreate}
+			/>
+		</Toolbar>
+	);*/
+
+	return resourceConfig.createComponent ? (
+		<ResourceLayout resourceConfig={resourceConfig} locale={locale}>
+			<Create>
+				<SimpleForm>
+					{resourceConfig.createComponent(resourceConfig)}
+				</SimpleForm>
+			</Create>
+			{resourceConfig.drawer && (
+				<DashAutoDrawer
+					resourceConfig={resourceConfig}
+					{...(resourceConfig.drawerProps && {
+						...resourceConfig.drawerProps,
+					})}
+				/>
+			)}
+		</ResourceLayout>
+	) : (
+		<ResourceLayout resourceConfig={resourceConfig} locale={locale}>
+			<DashAutoCreate
+				//toolbar={<ToolBar />}
+				onError={onError}
+				onSubmit={onCreate}
+				beforeSubmit={onBeforeSubmit}
+				resourceConfig={resourceConfig}
+				locale={locale}
+			/>
+			{resourceConfig.drawer && (
+				<DashAutoDrawer
+					resourceConfig={resourceConfig}
+					{...(resourceConfig.drawerProps && {
+						...resourceConfig.drawerProps,
+					})}
+				/>
+			)}
+		</ResourceLayout>
+	);
+};

package/src/templates/ResourceTemplateEdit.tsx

@@ -0,0 +1,176 @@
+/* eslint-disable no-mixed-spaces-and-tabs */
+import { useNotify, useTranslate } from 'react-admin';
+import { useRedirect } from 'react-admin';
+import { useRefresh } from 'react-admin';
+import { Toolbar } from 'react-admin';
+import { FC } from 'react';
+import { SimpleForm } from 'react-admin';
+import { Edit } from 'react-admin';
+import {
+	DashAutoDrawer,
+	DashAutoEdit,
+} from 'dash-auto-admin';
+import { useDialog } from 'dash-dialog';
+import DashAutoAdminSaveButton from 'dash-auto-admin/src/DashAutoAdminSaveButton';
+import React from 'react';
+import ResourceLayout from '../layout/ResoureLayout';
+import { IResourceTemplate } from './ResourceTemplate';
+import { parseAxiosError } from '../helpers/parseAxiosError';
+import { useDashResource } from '../contexts/DashResourceContext';
+
+export const ResourceTemplateEdit: FC<IResourceTemplate> = (props) => {
+	const {resourceConfig, locale} = props;
+	const notify = useNotify();
+	const translate = useTranslate();
+
+	const redirect = useRedirect();
+
+	const dialog = useDialog();
+
+	const refresh = useRefresh();
+
+	// @deprecated - removed currentAppPath logic that caused path duplication
+	const getRedirectPath = (path: string) => {
+		return `/${path}`.replace(/\/+/g, '/');
+	};
+
+	//const location = useLocation();
+
+	const _showNotifyAfterSubmit =
+		resourceConfig?.showNotifyAfterSubmit === false ? false : true;
+	const _showDialogAfterSubmit =
+		resourceConfig?.showDialogAfterSubmit === false ? false : true;
+
+	const onEdit = (data: any) => {
+
+		const translatedLabel = translate(resourceConfig.label, { _: resourceConfig.label });
+
+		if (_showNotifyAfterSubmit) {
+			notify('dash.resource.edited', { type: 'success' });
+		}
+
+		if (_showDialogAfterSubmit) {
+			dialog({
+				variant: 'info',
+				title: translate('dash.resource.updated'),
+				content: translate('dash.resource.updated_message', { label: translatedLabel }),
+				onConfirm: () => {
+					//resourceConfig.refreshAfter && refresh();
+					switch (resourceConfig.redirectAfterUpdate) {
+						case false:
+							return;
+						case 'view':
+							redirect(getRedirectPath(`${resourceConfig.model}/${data.id}/show`));
+							break;
+						case 'edit':
+							redirect(getRedirectPath(`${resourceConfig.model}/${data.id}`));
+							break;
+						case 'list':
+						default:
+							redirect(getRedirectPath(resourceConfig.model));
+							break;
+					}
+				},
+				onClose: () => {},
+			});
+		}
+
+		if (!_showDialogAfterSubmit && resourceConfig.redirectAfterUpdate) {
+			switch (resourceConfig.redirectAfterUpdate) {
+				case 'view':
+					redirect(getRedirectPath(`${resourceConfig.model}/${data.id}/show`));
+					break;
+				case 'edit':
+					redirect(getRedirectPath(`${resourceConfig.model}/${data.id}`));
+					break;
+				case 'list':
+					redirect(getRedirectPath(resourceConfig.model));
+					break;
+				default:
+					break;
+			}
+		}
+
+
+		if (resourceConfig?.refreshAfter !== false) {
+			refresh();
+		}
+	};
+
+    const onError = (_error: any) => {
+       
+        const _errorParser = resourceConfig.errorParser || parseAxiosError
+        
+		if (resourceConfig.onError) {
+			resourceConfig.onError('edit', _error);
+            return;
+		} 
+       
+        const translatedLabel = translate(resourceConfig.label, { _: resourceConfig.label });
+
+        dialog({
+            variant: 'danger',
+            title: translate('dash.resource.error', { label: translatedLabel }),
+            content: _errorParser(_error),
+            onConfirm: () => {},
+            onClose: () => {},
+        });
+
+	};
+
+	const onBeforeSubmit = (values: any) => {
+       
+		return resourceConfig.beforeSubmit
+			? resourceConfig.beforeSubmit(values)
+			: values;
+	};
+
+	const ToolBar = () => (
+		<Toolbar>
+           
+			<DashAutoAdminSaveButton resourceConfig={resourceConfig} />
+		</Toolbar>
+	);
+   
+	return resourceConfig.editComponent ? (
+		<ResourceLayout resourceConfig={resourceConfig} locale={locale}>
+			<Edit>
+				<SimpleForm  reValidateMode="onBlur" toolbar={<ToolBar />}>
+					{resourceConfig.editComponent(resourceConfig)}
+				</SimpleForm>
+			</Edit>
+			{resourceConfig.drawer && (
+				<DashAutoDrawer
+					onError={onError}
+					onSubmit={onEdit}
+					resourceConfig={resourceConfig}
+					{...(resourceConfig.drawerProps && {
+						...resourceConfig.drawerProps,
+					})}
+				/>
+			)}
+		</ResourceLayout>
+	) : (
+		<ResourceLayout resourceConfig={resourceConfig} locale={locale}>
+            
+			<DashAutoEdit
+				//toolbar={<ToolBar />}
+				onError={onError}
+				onSubmit={onEdit}
+				beforeSubmit={onBeforeSubmit}
+				resourceConfig={resourceConfig}
+				locale={locale}
+			/>
+			{resourceConfig.drawer && (
+				<DashAutoDrawer
+					onError={onError}
+					onSubmit={onEdit}
+					resourceConfig={resourceConfig}
+					{...(resourceConfig.drawerProps && {
+						...resourceConfig.drawerProps,
+					})}
+				/>
+			)}
+		</ResourceLayout>
+	);
+};