Merge branch 'api-platform:main' into main

PawelSuwinski · web-flow · commit 86e5fe281923 · 2026-03-26T09:34:42.000+01:00
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -6,6 +6,10 @@ on:
       - 'v*'
   workflow_dispatch: ~
 
+permissions:
+  id-token: write
+  contents: read
+
 jobs:
   release:
     name: Create and publish a release
@@ -35,5 +39,3 @@ jobs:
       -
         name: Publish to npm
         run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
diff --git a/api/composer.lock b/api/composer.lock
diff --git a/api/config/packages/api_platform.yaml b/api/config/packages/api_platform.yaml
@@ -16,3 +16,4 @@ api_platform:
         stateless: true
         cache_headers:
             vary: ['Content-Type', 'Authorization', 'Origin']
+        pagination_client_items_per_page: true
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@api-platform/admin",
-  "version": "4.0.7",
+  "version": "4.0.9",
   "description": "Automatic administration interface for Hydra-enabled APIs.",
   "files": [
     "*.md",
@@ -21,23 +21,24 @@
     "@api-platform/api-doc-parser": "^0.16.8",
     "jsonld": "^8.3.2",
     "lodash.isplainobject": "^4.0.6",
-    "react-admin": "^5.0.3"
+    "react-admin": "^5.8.3"
   },
   "devDependencies": {
     "@babel/preset-env": "^7.23.3",
     "@babel/preset-react": "^7.23.3",
     "@babel/preset-typescript": "^7.23.3",
-    "@storybook/addon-essentials": "^8.0.5",
-    "@storybook/addon-interactions": "^8.0.5",
-    "@storybook/addon-links": "^8.0.5",
-    "@storybook/addon-mdx-gfm": "^8.0.5",
-    "@storybook/addon-onboarding": "^8.0.5",
+    "@storybook/addon-essentials": "^8.6.15",
+    "@storybook/addon-interactions": "^8.6.15",
+    "@storybook/addon-links": "^8.6.15",
+    "@storybook/addon-mdx-gfm": "^8.6.15",
+    "@storybook/addon-onboarding": "^8.6.15",
     "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
-    "@storybook/blocks": "^8.0.5",
-    "@storybook/react": "^8.0.5",
-    "@storybook/react-webpack5": "^8.0.5",
-    "@storybook/test": "^8.0.5",
+    "@storybook/blocks": "^8.6.15",
+    "@storybook/react": "^8.6.15",
+    "@storybook/react-webpack5": "^8.6.15",
+    "@storybook/test": "^8.6.15",
     "@storybook/test-runner": "^0.17.0",
+    "@tanstack/react-query-devtools": "^5.80.6",
     "@testing-library/jest-dom": "^6.1.0",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.0.0",
@@ -72,7 +73,7 @@
     "react-test-renderer": "^18.0.0",
     "rimraf": "^5.0.0",
     "serve": "^14.2.1",
-    "storybook": "^8.0.5",
+    "storybook": "^8.6.15",
     "ts-jest": "^29.0.0",
     "ts-node": "^10.4.0",
     "typescript": "^5.2.0"
@@ -94,5 +95,9 @@
     "storybook:serve": "serve storybook-static",
     "storybook:test": "test-storybook"
   },
-  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e",
+  "resolutions": {
+    "react-router-dom": "^6",
+    "react-router": "^6"
+  }
 }
diff --git a/src/core/AdminGuesser.tsx b/src/core/AdminGuesser.tsx
@@ -48,7 +48,7 @@ const AdminGuesser = ({
   defaultTheme,
   layout = Layout,
   loginPage = LoginPage,
-  loading: loadingPage,
+  loading: LoadingPage = Loading,
   theme = defaultLightTheme,
   darkTheme = defaultDarkTheme,
   // Other props
@@ -97,7 +97,7 @@ const AdminGuesser = ({
   );
 
   if (loading) {
-    return <Loading />;
+    return <LoadingPage />;
   }
 
   return (
@@ -120,7 +120,7 @@ const AdminGuesser = ({
             dataProvider={dataProvider}
             layout={layout}
             loginPage={loginPage}
-            loadingPage={loadingPage}
+            loadingPage={LoadingPage}
             theme={theme}
             error={error}
             {...rest}>
diff --git a/src/stories/Basic.stories.tsx b/src/stories/Basic.stories.tsx
@@ -3,13 +3,14 @@ import type { Meta, StoryObj } from '@storybook/react';
 import { within } from '@storybook/test';
 import { HydraAdmin, type HydraAdminProps } from '../hydra';
 import { OpenApiAdmin } from '../openapi';
+import DevtoolsLayout from './layout/DevtoolsLayout';
 
 /**
  * # Basic `<HydraAdmin>` component
  * The `<HydraAdmin>` component without any parameter.
  */
 const Basic = ({ entrypoint }: BasicProps) => (
-  <HydraAdmin entrypoint={entrypoint} />
+  <HydraAdmin entrypoint={entrypoint} layout={DevtoolsLayout} />
 );
 
 interface BasicProps extends Pick<HydraAdminProps, 'entrypoint'> {}
diff --git a/src/stories/Basic.tsx b/src/stories/Basic.tsx
@@ -1,12 +1,13 @@
 import React from 'react';
 import { HydraAdmin, type HydraAdminProps } from '../hydra';
+import DevtoolsLayout from './layout/DevtoolsLayout';
 
 /**
  * # Basic `<HydraAdmin>` component
  * The `<HydraAdmin>` component without any parameter.
  */
 const Basic = ({ entrypoint }: BasicProps) => (
-  <HydraAdmin entrypoint={entrypoint} />
+  <HydraAdmin entrypoint={entrypoint} layout={DevtoolsLayout} />
 );
 
 export default Basic;
diff --git a/src/stories/auth/Admin.tsx b/src/stories/auth/Admin.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { HydraAdmin, type HydraAdminProps } from '../../hydra';
 import authProvider from './basicAuth';
+import DevtoolsLayout from '../layout/DevtoolsLayout';
 
 /**
  * # Protected `<HydraAdmin>`
@@ -9,7 +10,12 @@ import authProvider from './basicAuth';
  * Login with: john/123
  */
 const Admin = ({ entrypoint }: JwtAuthProps) => (
-  <HydraAdmin entrypoint={entrypoint} authProvider={authProvider} requireAuth />
+  <HydraAdmin
+    entrypoint={entrypoint}
+    authProvider={authProvider}
+    requireAuth
+    layout={DevtoolsLayout}
+  />
 );
 
 export default Admin;
diff --git a/src/stories/custom/AdvancedCustomization.stories.tsx b/src/stories/custom/AdvancedCustomization.stories.tsx
@@ -10,7 +10,6 @@ import {
   DateField,
   Edit,
   Labeled,
-  Layout,
   List,
   NumberField,
   ReferenceArrayField,
@@ -34,6 +33,7 @@ import ResourceGuesser from '../../core/ResourceGuesser';
 import FieldGuesser from '../../field/FieldGuesser';
 import { HydraAdmin } from '../../hydra';
 import InputGuesser from '../../input/InputGuesser';
+import DevtoolsLayout from '../layout/DevtoolsLayout';
 
 export default {
   title: 'Admin/Custom/AdvancedCustomization',
@@ -222,7 +222,7 @@ const ReviewList = () => (
 export const AdvancedCustomization = () => (
   <HydraAdmin
     entrypoint={process.env.ENTRYPOINT}
-    layout={Layout}
+    layout={DevtoolsLayout}
     theme={defaultLightTheme}
     darkTheme={defaultDarkTheme}>
     <ResourceGuesser
diff --git a/src/stories/custom/UsingGuessers.stories.tsx b/src/stories/custom/UsingGuessers.stories.tsx
@@ -9,6 +9,7 @@ import FieldGuesser from '../../field/FieldGuesser';
 import EditGuesser from '../../edit/EditGuesser';
 import InputGuesser from '../../input/InputGuesser';
 import CreateGuesser from '../../create/CreateGuesser';
+import DevtoolsLayout from '../layout/DevtoolsLayout';
 
 export default {
   title: 'Admin/Custom/UsingGuessers',
@@ -98,7 +99,7 @@ const ReviewList = () => (
 );
 
 export const UsingGuessers = () => (
-  <HydraAdmin entrypoint={process.env.ENTRYPOINT}>
+  <HydraAdmin entrypoint={process.env.ENTRYPOINT} layout={DevtoolsLayout}>
     <ResourceGuesser
       name="books"
       list={BookList}
diff --git a/src/stories/layout/DevtoolsLayout.tsx b/src/stories/layout/DevtoolsLayout.tsx
@@ -0,0 +1,16 @@
+import React from 'react';
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+import { useQueryClient } from '@tanstack/react-query';
+import { Layout, type LayoutProps } from 'react-admin';
+
+const DevtoolsLayout = ({ children, ...props }: LayoutProps) => {
+  const client = useQueryClient();
+  return (
+    <Layout {...props}>
+      {children}
+      <ReactQueryDevtools initialIsOpen={false} client={client} />
+    </Layout>
+  );
+};
+
+export default DevtoolsLayout;
diff --git a/src/types.ts b/src/types.ts
@@ -492,13 +492,18 @@ export type IntrospectedInputGuesserProps = Partial<InputProps> &
     'filter' | 'page' | 'perPage' | 'sort' | 'enableGetChoices'
   >;
 
-export type InputGuesserProps = Omit<
+// Thanks Tkdodo!
+// https://tkdodo.eu/blog/omit-for-discriminated-unions-in-type-script#distributive-omit
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type DistributiveOmit<T, K extends keyof T> = T extends any
+  ? Omit<T, K>
+  : never;
+
+export type InputGuesserProps = DistributiveOmit<
   InputProps & Omit<BaseIntrospecterProps, 'resource'>,
   'component'
 > & {
   transformEnum?: (value: string | number) => string | number;
-  // don't know why this TextInputProps doesn't surface in the final type, re-adding it here
-  multiline?: boolean;
 } & Pick<
     ReferenceInputProps | ReferenceArrayInputProps,
     'filter' | 'page' | 'perPage' | 'sort' | 'enableGetChoices'
diff --git a/yarn.lock b/yarn.lock
