Add support for react-admin v5

.dockerignore

@@ -0,0 +1 @@
+node_modules

package.json

@@ -23,8 +23,9 @@
     "jsonld": "^8.1.0",
     "lodash.isplainobject": "^4.0.6",
     "prop-types": "^15.6.2",
-    "react-admin": "^4.4.0",
-    "react-error-boundary": "^4.0.13"
+    "react-admin": "^5.0.3",
+    "react-error-boundary": "^4.0.13",
+    "@tanstack/react-query": "^5.49.2"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.23.3",

src/AdminGuesser.test.tsx

@@ -2,7 +2,8 @@ import React from 'react';
 import { AdminUI, AuthContext } from 'react-admin';
 import type { AdminProps, AuthProvider } from 'react-admin';
 import ReactTestRenderer from 'react-test-renderer/shallow';
-import AdminGuesser, { AdminResourcesGuesser } from './AdminGuesser.js';
+import AdminGuesser from './AdminGuesser.js';
+import { AdminResourcesGuesser } from './AdminResourcesGuesser.js';
 import ResourceGuesser from './ResourceGuesser.js';
 import schemaAnalyzer from './hydra/schemaAnalyzer.js';
 import resources from './__fixtures__/resources.js';

src/AdminGuesser.tsx

@@ -1,20 +1,12 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import PropTypes from 'prop-types';
-import {
-  AdminContext,
-  AdminUI,
-  ComponentPropType,
-  Loading,
-  defaultI18nProvider,
-} from 'react-admin';
-import { ErrorBoundary } from 'react-error-boundary';
-import type { FallbackProps } from 'react-error-boundary';
-import type { ComponentType, ErrorInfo } from 'react';
-import type { AdminProps, ErrorProps } from 'react-admin';
+import React, { useEffect, useMemo, useState } from 'react';
+import { AdminContext, defaultI18nProvider } from 'react-admin';
+
+import type { ComponentType } from 'react';
+import type { AdminProps } from 'react-admin';
 import type { Resource } from '@api-platform/api-doc-parser';
 
+import { AdminResourcesGuesser } from './AdminResourcesGuesser.js';
 import IntrospectionContext from './IntrospectionContext.js';
-import ResourceGuesser from './ResourceGuesser.js';
 import SchemaAnalyzerContext from './SchemaAnalyzerContext.js';
 import {
   Error as DefaultError,
@@ -23,10 +15,6 @@ import {
   darkTheme,
   lightTheme,
 } from './layout/index.js';
-import getRoutesAndResourcesFromNodes, {
-  isSingleChildFunction,
-} from './getRoutesAndResourcesFromNodes.js';
-import useDisplayOverrideCode from './useDisplayOverrideCode.js';
 import type { ApiPlatformAdminDataProvider, SchemaAnalyzer } from './types.js';
 
 export interface AdminGuesserProps extends AdminProps {
@@ -36,88 +24,18 @@ export interface AdminGuesserProps extends AdminProps {
   includeDeprecated?: boolean;
 }
 
-interface AdminGuesserWithErrorProps extends AdminGuesserProps {
-  error?: ComponentType<ErrorProps>;
-}
-
-interface AdminResourcesGuesserProps extends Omit<AdminProps, 'loading'> {
-  admin?: ComponentType<AdminProps>;
-  includeDeprecated: boolean;
-  loading: boolean;
-  loadingPage?: ComponentType;
-  resources: Resource[];
-}
-
-const getOverrideCode = (resources: Resource[]) => {
-  let code =
-    'If you want to override at least one resource, paste this content in the <AdminGuesser> component of your app:\n\n';
-
-  resources.forEach((r) => {
-    code += `<ResourceGuesser name={"${r.name}"} />\n`;
-  });
-
-  return code;
-};
-
-/**
- * AdminResourcesGuesser automatically renders an `<AdminUI>` component for resources exposed by a web API documented with Hydra, OpenAPI or any other format supported by `@api-platform/api-doc-parser`.
- * If child components are passed (usually `<ResourceGuesser>` or `<Resource>` components, but it can be any other React component), they are rendered in the given order.
- * If no children are passed, a `<ResourceGuesser>` component is created for each resource type exposed by the API, in the order they are specified in the API documentation.
- */
-export const AdminResourcesGuesser = ({
-  // Admin props
-  loadingPage: LoadingPage = Loading,
-  admin: AdminEl = AdminUI,
-  // Props
-  children,
-  includeDeprecated,
-  resources,
-  loading,
-  ...rest
-}: AdminResourcesGuesserProps) => {
-  const displayOverrideCode = useDisplayOverrideCode();
-
-  if (loading) {
-    return <LoadingPage />;
-  }
-
-  let adminChildren = children;
-  const { resources: resourceChildren, customRoutes } =
-    getRoutesAndResourcesFromNodes(children);
-  if (
-    !isSingleChildFunction(adminChildren) &&
-    resourceChildren.length === 0 &&
-    resources
-  ) {
-    const guessResources = includeDeprecated
-      ? resources
-      : resources.filter((r) => !r.deprecated);
-    adminChildren = [
-      ...customRoutes,
-      ...guessResources.map((r) => (
-        <ResourceGuesser name={r.name} key={r.name} />
-      )),
-    ];
-    displayOverrideCode(getOverrideCode(guessResources));
-  }
-
-  return (
-    <AdminEl loading={LoadingPage} {...rest}>
-      {adminChildren}
-    </AdminEl>
-  );
-};
-
 const AdminGuesser = ({
   // Props for SchemaAnalyzerContext
   schemaAnalyzer,
   // Props for AdminResourcesGuesser
   includeDeprecated = false,
   // Admin props
   basename,
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  error = DefaultError as any,
   store,
   dataProvider,
-  i18nProvider,
+  i18nProvider = defaultI18nProvider,
   authProvider,
   queryClient,
   defaultTheme,
@@ -152,10 +70,10 @@ const AdminGuesser = ({
         setIntrospect(false);
         setLoading(false);
       })
-      .catch((error) => {
-        // Allow error to be caught by the error boundary
+      .catch((err) => {
+        // Allow err to be caught by the error boundary
         setError(() => {
-          throw error;
+          throw err;
         });
       });
   }, [introspect, dataProvider]);
@@ -193,6 +111,7 @@ const AdminGuesser = ({
             loginPage={loginPage}
             loadingPage={loadingPage}
             theme={theme}
+            error={error}
             {...rest}>
             {children}
           </AdminResourcesGuesser>
@@ -202,51 +121,4 @@ const AdminGuesser = ({
   );
 };
 
-/* eslint-disable tree-shaking/no-side-effects-in-initialization */
-AdminGuesser.propTypes = {
-  dataProvider: PropTypes.oneOfType([PropTypes.object, PropTypes.func])
-    .isRequired,
-  authProvider: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
-  i18nProvider: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
-  history: PropTypes.object,
-  customSagas: PropTypes.array,
-  initialState: PropTypes.object,
-  schemaAnalyzer: PropTypes.object.isRequired,
-  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-  theme: PropTypes.object,
-  includeDeprecated: PropTypes.bool,
-  admin: PropTypes.elementType,
-};
-/* eslint-enable tree-shaking/no-side-effects-in-initialization */
-
-const AdminGuesserWithError = ({
-  error: ErrorComponent = DefaultError,
-  i18nProvider = defaultI18nProvider,
-  theme = lightTheme,
-  ...props
-}: AdminGuesserWithErrorProps) => {
-  const [errorInfo, setErrorInfo] = useState<ErrorInfo>();
-
-  const handleError = (_error: Error, info: ErrorInfo) => {
-    setErrorInfo(info);
-  };
-
-  const renderError = useCallback(
-    (fallbackRenderProps: FallbackProps) => (
-      <ErrorComponent {...fallbackRenderProps} errorInfo={errorInfo} />
-    ),
-    [ErrorComponent, errorInfo],
-  );
-
-  return (
-    <ErrorBoundary onError={handleError} fallbackRender={renderError}>
-      <AdminGuesser {...props} i18nProvider={i18nProvider} theme={theme} />
-    </ErrorBoundary>
-  );
-};
-
-AdminGuesserWithError.propTypes = {
-  error: ComponentPropType,
-};
-
-export default AdminGuesserWithError;
+export default AdminGuesser;

src/AdminResourcesGuesser.tsx

@@ -0,0 +1,95 @@
+import React from 'react';
+import { AdminUI, Loading } from 'react-admin';
+import type { ComponentType } from 'react';
+import type { AdminProps } from 'react-admin';
+import type { Resource } from '@api-platform/api-doc-parser';
+
+import ResourceGuesser from './ResourceGuesser.js';
+
+import getRoutesAndResourcesFromNodes, {
+  isSingleChildFunction,
+} from './getRoutesAndResourcesFromNodes.js';
+import useDisplayOverrideCode from './useDisplayOverrideCode.js';
+import type { ApiPlatformAdminDataProvider, SchemaAnalyzer } from './types.js';
+
+export interface AdminGuesserProps extends AdminProps {
+  admin?: ComponentType<AdminProps>;
+  dataProvider: ApiPlatformAdminDataProvider;
+  schemaAnalyzer: SchemaAnalyzer;
+  includeDeprecated?: boolean;
+}
+
+interface AdminResourcesGuesserProps extends Omit<AdminProps, 'loading'> {
+  admin?: ComponentType<AdminProps>;
+  includeDeprecated: boolean;
+  loading: boolean;
+  loadingPage?: ComponentType;
+  resources: Resource[];
+}
+
+const getOverrideCode = (resources: Resource[]) => {
+  let code =
+    'If you want to override at least one resource, paste this content in the <AdminGuesser> component of your app:\n\n';
+
+  resources.forEach((r) => {
+    code += `<ResourceGuesser name={"${r.name}"} />\n`;
+  });
+
+  return code;
+};
+
+/**
+ * AdminResourcesGuesser automatically renders an `<AdminUI>` component
+ * for resources exposed by a web API documented with Hydra, OpenAPI
+ * or any other format supported by `@api-platform/api-doc-parser`.
+ *
+ * If child components are passed (usually `<ResourceGuesser>` or `<Resource>`
+ * components, but it can be any other React component), they are rendered in
+ * the given order.
+ * If no children are passed, a `<ResourceGuesser>` component is created for
+ * each resource type exposed by the API, in the order they are specified in
+ * the API documentation.
+ */
+export const AdminResourcesGuesser = ({
+  // Admin props
+  loadingPage: LoadingPage = Loading,
+  admin: AdminEl = AdminUI,
+  // Props
+  children,
+  includeDeprecated,
+  resources,
+  loading,
+  ...rest
+}: AdminResourcesGuesserProps) => {
+  const displayOverrideCode = useDisplayOverrideCode();
+
+  if (loading) {
+    return <LoadingPage />;
+  }
+
+  let adminChildren = children;
+  const { resources: resourceChildren, customRoutes } =
+    getRoutesAndResourcesFromNodes(children);
+  if (
+    !isSingleChildFunction(adminChildren) &&
+    resourceChildren.length === 0 &&
+    resources
+  ) {
+    const guessedResources = includeDeprecated
+      ? resources
+      : resources.filter((r) => !r.deprecated);
+    adminChildren = [
+      ...customRoutes,
+      ...guessedResources.map((r) => (
+        <ResourceGuesser name={r.name} key={r.name} />
+      )),
+    ];
+    displayOverrideCode(getOverrideCode(guessedResources));
+  }
+
+  return (
+    <AdminEl loading={LoadingPage} {...rest}>
+      {adminChildren}
+    </AdminEl>
+  );
+};

src/CreateGuesser.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import {
   Create,
   FormTab,
@@ -102,6 +101,9 @@ export const IntrospectedCreateGuesser = ({
 
 const CreateGuesser = (props: CreateGuesserProps) => {
   const resource = useResourceContext(props);
+  if (!resource) {
+    throw new Error('guesser must be used with a resource');
+  }
 
   return (
     <Introspecter
@@ -112,11 +114,4 @@ const CreateGuesser = (props: CreateGuesserProps) => {
   );
 };
 
-/* eslint-disable tree-shaking/no-side-effects-in-initialization */
-CreateGuesser.propTypes = {
-  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-  resource: PropTypes.string,
-};
-/* eslint-enable tree-shaking/no-side-effects-in-initialization */
-
 export default CreateGuesser;

src/EditGuesser.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import {
   Edit,
   FormTab,
@@ -114,6 +113,9 @@ export const IntrospectedEditGuesser = ({
 
 const EditGuesser = (props: EditGuesserProps) => {
   const resource = useResourceContext(props);
+  if (!resource) {
+    throw new Error('guesser must be used with a resource');
+  }
 
   return (
     <Introspecter
@@ -124,11 +126,4 @@ const EditGuesser = (props: EditGuesserProps) => {
   );
 };
 
-/* eslint-disable tree-shaking/no-side-effects-in-initialization */
-EditGuesser.propTypes = {
-  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-  resource: PropTypes.string,
-};
-/* eslint-enable tree-shaking/no-side-effects-in-initialization */
-
 export default EditGuesser;

src/EnumField.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import {
   ArrayField,
   SingleFieldList,
@@ -34,9 +33,4 @@ const EnumField = ({ transformEnum, source, ...props }: EnumFieldProps) => {
 
 EnumField.displayName = 'EnumField';
 
-EnumField.propTypes = {
-  ...TextField.propTypes,
-  transformEnum: PropTypes.func,
-};
-
 export default EnumField;