fix: tests with useRelation

packages/core/admin/admin/src/content-manager/components/RelationInputDataManager/tests/RelationInputDataManger.test.js

@@ -232,22 +232,6 @@ describe('RelationInputDataManager', () => {
     expect(container.querySelector('input')).toHaveAttribute('disabled');
   });
 
-  /**
-   * TODO: this needs to be moved to `useRelation` hook.
-   */
-  test.skip('Stores the loaded relations in the store', async () => {
-    const { loadRelation } = useCMEditViewDataManager();
-
-    setup();
-
-    expect(loadRelation).toBeCalledWith({
-      target: {
-        name: 'relation',
-        value: [expect.objectContaining({ id: 1 }), expect.objectContaining({ id: 2 })],
-      },
-    });
-  });
-
   test('Renders <NotAllowedInput /> if entity is created and field is not allowed', async () => {
     useCMEditViewDataManager.mockReturnValueOnce({
       isCreatingEntry: true,

packages/core/admin/admin/src/content-manager/hooks/useRelation/tests/useRelation.test.js

@@ -33,13 +33,14 @@ const ComponentFixture = ({ children }) => (
   <QueryClientProvider client={client}>{children}</QueryClientProvider>
 );
 
-function setup(name = 'test', args) {
+function setup(args, name = 'test') {
   return new Promise((resolve) => {
     act(() => {
       resolve(
         renderHook(
           () =>
             useRelation(name, {
+              name,
               relation: {
                 enabled: true,
                 endpoint: '/',
@@ -47,6 +48,11 @@ function setup(name = 'test', args) {
                   limit: 10,
                   ...(args?.relation?.pageParams ?? {}),
                 },
+                normalizeArguments: {
+                  mainFieldName: 'name',
+                  shouldAddLink: false,
+                  targetModel: 'api::tag.tag',
+                },
                 ...(args?.relation ?? {}),
               },
 
@@ -71,19 +77,31 @@ describe('useRelation', () => {
     jest.clearAllMocks();
   });
 
-  test('fetch relations', async () => {
-    const { result, waitForNextUpdate } = await setup(undefined);
+  test('fetch relations and calls onLoadRelationsCallback', async () => {
+    const onLoadRelationsCallbackMock = jest.fn();
+    const { waitFor } = await setup({
+      relation: {
+        onLoadRelationsCallback: onLoadRelationsCallbackMock,
+      },
+    });
 
-    await waitForNextUpdate();
+    await waitFor(() => expect(axiosInstance.get).toBeCalledTimes(1));
 
-    expect(result.current.relations.isSuccess).toBe(true);
-    expect(axiosInstance.get).toBeCalledTimes(1);
     expect(axiosInstance.get).toBeCalledWith('/', {
       params: {
         limit: 10,
         page: 1,
       },
     });
+
+    await waitFor(() =>
+      expect(onLoadRelationsCallbackMock).toBeCalledWith({
+        target: {
+          name: 'test',
+          value: [expect.objectContaining({ id: 1 }), expect.objectContaining({ id: 2 })],
+        },
+      })
+    );
   });
 
   test('fetch and normalize relations for xToOne', async () => {
@@ -98,7 +116,7 @@ describe('useRelation', () => {
       },
     });
 
-    const { result, waitForNextUpdate } = await setup(undefined);
+    const { result, waitForNextUpdate } = await setup();
 
     await waitForNextUpdate();
 
@@ -108,7 +126,7 @@ describe('useRelation', () => {
   });
 
   test('fetch relations with different limit', async () => {
-    const { waitForNextUpdate } = await setup(undefined, {
+    const { waitForNextUpdate } = await setup({
       relation: { pageParams: { limit: 5 } },
     });
 
@@ -123,7 +141,7 @@ describe('useRelation', () => {
   });
 
   test('does not fetch relations if it was not enabled', async () => {
-    await setup(undefined, { relation: { enabled: false } });
+    await setup({ relation: { enabled: false } });
 
     expect(axiosInstance.get).not.toBeCalled();
   });
@@ -154,7 +172,7 @@ describe('useRelation', () => {
       },
     });
 
-    const { result, waitForNextUpdate } = await setup(undefined);
+    const { result, waitForNextUpdate } = await setup();
 
     await waitForNextUpdate();
 
@@ -190,7 +208,7 @@ describe('useRelation', () => {
       },
     });
 
-    const { result, waitForNextUpdate } = await setup(undefined);
+    const { result, waitForNextUpdate } = await setup();
 
     await waitForNextUpdate();
 
@@ -232,7 +250,7 @@ describe('useRelation', () => {
   });
 
   test('does fetch search results with a different limit', async () => {
-    const { result, waitForNextUpdate } = await setup(undefined, {
+    const { result, waitForNextUpdate } = await setup({
       search: { pageParams: { limit: 5 } },
     });
 
@@ -260,7 +278,7 @@ describe('useRelation', () => {
   });
 
   test('fetch search next page, if there is one', async () => {
-    const { result, waitForNextUpdate } = await setup(undefined);
+    const { result, waitForNextUpdate } = await setup();
 
     const spy = jest
       .fn()
@@ -297,7 +315,7 @@ describe('useRelation', () => {
   });
 
   test("does not fetch search next page, if there isn't one", async () => {
-    const { result, waitForNextUpdate } = await setup(undefined);
+    const { result, waitForNextUpdate } = await setup();
 
     const spy = jest.fn().mockResolvedValueOnce({
       data: { results: [], pagination: { page: 1, pageCount: 1 } },

packages/core/admin/admin/src/content-manager/hooks/useRelation/useRelation.js

@@ -42,7 +42,7 @@ export const useRelation = (cacheKey, { name, relation, search }) => {
     }
   };
 
-  const { onLoadRelationsCallback, normalizeArguments } = relation;
+  const { onLoadRelationsCallback, normalizeArguments = {} } = relation;
 
   const relationsRes = useInfiniteQuery(['relation', cacheKey], fetchRelations, {
     cacheTime: 0,
@@ -91,7 +91,7 @@ export const useRelation = (cacheKey, { name, relation, search }) => {
   const { status, data } = relationsRes;
 
   useEffect(() => {
-    if (status === 'success' && data && data.pages?.at(-1)?.results) {
+    if (status === 'success' && data && data.pages?.at(-1)?.results && onLoadRelationsCallback) {
       // everytime we fetch, we normalize prior to adding to redux
       const normalizedResults = normalizeRelations(data.pages?.at(-1)?.results, normalizeArguments);