refactor: Remove unnecessary content library class

src/Designer/frontend/app-development/features/appContentLibrary/AppContentLibrary.test.tsx

@@ -14,7 +14,6 @@ import type {
   CodeListWithMetadata,
   ContentLibraryConfig,
   PagesConfig,
-  ResourceContentLibraryImpl,
   TextResourceWithLanguage,
 } from '@studio/content-library';
 import { optionList1Data, optionListDataList } from './test-data/optionListDataList';
@@ -25,18 +24,10 @@ import { codeListTitles } from './test-data/codeListTitles';
 // Mocks:
 jest.mock('@studio/content-library', () => ({
   ...jest.requireActual('@studio/content-library'),
-  ResourceContentLibraryImpl: mockContentLibrary,
+  ContentLibrary: (props) => MockContentLibrary(props),
 }));
 
-function mockContentLibrary(
-  ...args: ConstructorParameters<typeof ResourceContentLibraryImpl>
-): Partial<ResourceContentLibraryImpl> {
-  mockConstructor(...args);
-  return { getContentResourceLibrary };
-}
-
-const mockConstructor = jest.fn();
-const getContentResourceLibrary = jest
+const MockContentLibrary = jest
   .fn()
   .mockImplementation(() => <div data-testid={resourceLibraryTestId} />);
 const resourceLibraryTestId = 'resource-library';
@@ -248,5 +239,5 @@ function retrievePagesConfig(): PagesConfig {
 }
 
 function retrieveConfig(): ContentLibraryConfig {
-  return mockConstructor.mock.calls[0][0];
+  return MockContentLibrary.mock.calls[0][0];
 }

src/Designer/frontend/app-development/features/appContentLibrary/AppContentLibrary.tsx

@@ -4,10 +4,9 @@ import type {
   CodeListWithMetadata,
   TextResourceWithLanguage,
 } from '@studio/content-library';
-import { ResourceContentLibraryImpl } from '@studio/content-library';
+import { ContentLibrary } from '@studio/content-library';
 import type { ReactElement } from 'react';
 import React, { useCallback } from 'react';
-
 import {
   useOptionListsQuery,
   useOptionListsReferencesQuery,
@@ -130,31 +129,33 @@ function AppContentLibraryWithData({
     [updateTextResource],
   );
 
-  const { getContentResourceLibrary } = new ResourceContentLibraryImpl({
-    heading: t('app_content_library.library_heading'),
-    pages: {
-      codeListsWithTextResources: {
-        codeListDataList,
-        onCreateCodeList: handleCreate,
-        onDeleteCodeList: deleteOptionList,
-        onUpdateCodeListId: handleUpdateCodeListId,
-        onUpdateCodeList: handleUpdate,
-        onCreateTextResource: handleUpdateTextResource,
-        onUpdateTextResource: handleUpdateTextResource,
-        onUploadCodeList: handleUpload,
-        codeListsUsages,
-        textResources,
-        externalResources: availableOrgResources,
-        onImportCodeListFromOrg: handleImportCodeListFromOrg,
-      },
-      images: {
-        images: [],
-        onUpdateImage: () => {},
-      },
-    },
-  });
-
-  return <div>{getContentResourceLibrary()}</div>;
+  return (
+    <div>
+      <ContentLibrary
+        heading={t('app_content_library.library_heading')}
+        pages={{
+          codeListsWithTextResources: {
+            codeListDataList,
+            onCreateCodeList: handleCreate,
+            onDeleteCodeList: deleteOptionList,
+            onUpdateCodeListId: handleUpdateCodeListId,
+            onUpdateCodeList: handleUpdate,
+            onCreateTextResource: handleUpdateTextResource,
+            onUpdateTextResource: handleUpdateTextResource,
+            onUploadCodeList: handleUpload,
+            codeListsUsages,
+            textResources,
+            externalResources: availableOrgResources,
+            onImportCodeListFromOrg: handleImportCodeListFromOrg,
+          },
+          images: {
+            images: [],
+            onUpdateImage: () => {},
+          },
+        }}
+      />
+    </div>
+  );
 }
 
 function useUploadOptionList(org: string, app: string): (file: File) => void {

src/Designer/frontend/dashboard/pages/OrgContentLibraryPage/OrgContentLibraryPage.test.tsx

@@ -12,7 +12,6 @@ import type {
   CodeListData as LibraryCodeListData,
   ContentLibraryConfig,
   PagesConfig,
-  ResourceContentLibraryImpl,
   TextResources,
   TextResourceWithLanguage,
 } from '@studio/content-library';
@@ -52,26 +51,18 @@ const sharedResourcesByPathQueryKey: string[] = [
 // Mocks:
 jest.mock('@studio/content-library', () => ({
   ...jest.requireActual('@studio/content-library'),
-  ResourceContentLibraryImpl: mockContentLibrary,
+  ContentLibrary: (props) => MockContentLibrary(props),
 }));
 
-function mockContentLibrary(
-  ...args: ConstructorParameters<typeof ResourceContentLibraryImpl>
-): Partial<ResourceContentLibraryImpl> {
-  mockConstructor(...args);
-  return { getContentResourceLibrary };
-}
-
-const mockConstructor = jest.fn();
-const getContentResourceLibrary = jest
+const MockContentLibrary = jest
   .fn()
   .mockImplementation(() => <div data-testid={resourceLibraryTestId} />);
 const resourceLibraryTestId = 'resource-library';
 
 jest.mock('react-router-dom', () => jest.requireActual('react-router-dom')); // Todo: Remove this when we have removed the global mock: https://github.com/Altinn/altinn-studio/issues/14597
 
 describe('OrgContentLibraryPage', () => {
-  beforeEach(mockConstructor.mockClear);
+  beforeEach(MockContentLibrary.mockClear);
 
   it('Renders the content library', () => {
     renderOrgContentLibraryWithData();
@@ -428,5 +419,5 @@ function retrievePagesConfig(): PagesConfig {
 }
 
 function retrieveConfig(): ContentLibraryConfig {
-  return mockConstructor.mock.calls[0][0];
+  return MockContentLibrary.mock.calls[0][0];
 }

src/Designer/frontend/dashboard/pages/OrgContentLibraryPage/OrgContentLibraryPage.tsx

@@ -1,6 +1,6 @@
 import type { ReactElement } from 'react';
 import React, { useMemo, useCallback } from 'react';
-import { ResourceContentLibraryImpl } from '@studio/content-library';
+import { ContentLibrary } from '@studio/content-library';
 import type {
   CodeListWithMetadata,
   PagesConfig,
@@ -164,27 +164,25 @@ function OrgContentLibraryWithContextAndData({
     createCodeList({ title, data: codeList });
   };
 
-  const { getContentResourceLibrary } = new ResourceContentLibraryImpl({
-    heading: t('org_content_library.library_heading'),
-    pages: {
-      codeListsWithTextResources: {
-        codeListDataList,
-        onCreateCodeList: handleCreate,
-        onCreateTextResource: handleUpdateTextResource,
-        onDeleteCodeList: deleteCodeList,
-        onUpdateCodeListId: handleUpdateCodeListId,
-        onUpdateCodeList: handleUpdate,
-        onUpdateTextResource: handleUpdateTextResource,
-        onUploadCodeList: handleUpload,
-        textResources,
-      },
-      ...pagesFromFeatureFlags,
-    },
-  });
-
   return (
     <div>
-      {getContentResourceLibrary()}
+      <ContentLibrary
+        heading={t('org_content_library.library_heading')}
+        pages={{
+          codeListsWithTextResources: {
+            codeListDataList,
+            onCreateCodeList: handleCreate,
+            onCreateTextResource: handleUpdateTextResource,
+            onDeleteCodeList: deleteCodeList,
+            onUpdateCodeListId: handleUpdateCodeListId,
+            onUpdateCodeList: handleUpdate,
+            onUpdateTextResource: handleUpdateTextResource,
+            onUploadCodeList: handleUpload,
+            textResources,
+          },
+          ...pagesFromFeatureFlags,
+        }}
+      />
       <FeedbackForm />
     </div>
   );

src/Designer/frontend/libs/studio-content-library/src/config/ContentResourceLibraryImpl.test.tsx → src/Designer/frontend/libs/studio-content-library/src/ContentLibraryWithProvider/ContentLibraryWithProvider.test.tsx

@@ -1,18 +1,19 @@
 import { screen } from '@testing-library/react';
 import type { PagesConfig } from '../types/PagesProps';
-import { ResourceContentLibraryImpl } from './ContentResourceLibraryImpl';
+import React from 'react';
+import { ContentLibraryWithProvider } from './ContentLibraryWithProvider';
 import { textMock } from '@studio/testing/mocks/i18nMock';
 import { renderWithProviders } from '../../test-utils/renderWithProviders';
 import { mockPagesConfig } from '../../mocks/mockPagesConfig';
 import type { ContentLibraryConfig } from '../types/ContentLibraryConfig';
 
-describe('ContentResourceLibraryImpl', () => {
-  it('renders ContentResourceLibraryImpl with given pages', () => {
+describe('ContentLibraryWithProvider', () => {
+  it('renders content library with given pages', () => {
     const pages: PagesConfig = {
       codeListsWithTextResources: mockPagesConfig.codeListsWithTextResources,
       images: mockPagesConfig.images,
     };
-    renderContentResourceLibraryImpl({ pages, heading: 'Lorem ipsum' });
+    renderContentLibrary({ pages, heading: 'Lorem ipsum' });
     const libraryTitle = screen.getByRole('heading', {
       name: textMock('app_content_library.landing_page.title'),
     });
@@ -25,8 +26,8 @@ describe('ContentResourceLibraryImpl', () => {
     expect(imagesMenuElement).toBeInTheDocument();
   });
 
-  it('renders ContentResourceLibraryImpl with landingPage when no pages are passed', () => {
-    renderContentResourceLibraryImpl({ pages: {}, heading: 'Lorem ipsum' });
+  it('renders content library with landing page when no pages are passed', () => {
+    renderContentLibrary({ pages: {}, heading: 'Lorem ipsum' });
     const libraryTitle = screen.getByRole('heading', {
       name: textMock('app_content_library.landing_page.title'),
     });
@@ -42,13 +43,11 @@ describe('ContentResourceLibraryImpl', () => {
   it('Renders the given heading', () => {
     const heading = 'The test library';
     const config: ContentLibraryConfig = { pages: mockPagesConfig, heading };
-    renderContentResourceLibraryImpl(config);
+    renderContentLibrary(config);
     expect(screen.getByRole('heading', { name: heading })).toBeInTheDocument();
   });
 });
 
-const renderContentResourceLibraryImpl = (config: ContentLibraryConfig): void => {
-  const contentResourceLibraryImpl = new ResourceContentLibraryImpl(config);
-  const { getContentResourceLibrary } = contentResourceLibraryImpl;
-  renderWithProviders(getContentResourceLibrary());
+const renderContentLibrary = (config: ContentLibraryConfig): void => {
+  renderWithProviders(<ContentLibraryWithProvider {...config} />);
 };

src/Designer/frontend/libs/studio-content-library/src/ContentLibraryWithProvider/ContentLibraryWithProvider.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { ReactElement } from 'react';
+import { RouterContextProvider } from '../contexts/RouterContext';
+import { ContentLibrary } from '../ContentLibrary/ContentLibrary';
+import type { ContentLibraryConfig } from '../types/ContentLibraryConfig';
+
+export type ContentLibraryWithProviderProps = Readonly<ContentLibraryConfig>;
+
+export function ContentLibraryWithProvider(props: ContentLibraryWithProviderProps): ReactElement {
+  return (
+    <RouterContextProvider>
+      <ContentLibrary {...props} />
+    </RouterContextProvider>
+  );
+}

src/Designer/frontend/libs/studio-content-library/src/ContentLibraryWithProvider/index.ts

@@ -0,0 +1 @@
+export * from './ContentLibraryWithProvider';

src/Designer/frontend/libs/studio-content-library/src/index.ts

@@ -1,4 +1,4 @@
-export { ResourceContentLibraryImpl } from './config/ContentResourceLibraryImpl';
+export { ContentLibraryWithProvider as ContentLibrary } from './ContentLibraryWithProvider';
 export type { ContentLibraryConfig } from './types/ContentLibraryConfig';
 export type {
   CodeListWithMetadata,