@itwin/reports-config-widget-react 0.5.0 → 0.6.0

package/src/test/ReportMappings.test.tsx

@@ -1,12 +1,13 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import React from "react";
 import "@testing-library/jest-dom";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import {
   act,
+  mockExtractionRequestDetails,
   mockIModelId1,
   mockIModelId2,
   mockIModelsResponse,
@@ -18,16 +19,8 @@ import {
   within,
 } from "./test-utils";
 import * as moq from "typemoq";
-import type {
-  MappingsClient,
-  MappingSingle,
-  Report,
-  ReportMappingCollection,
-} from "@itwin/insights-client";
-import {
-  ExtractionClient,
-  ReportsClient,
-} from "@itwin/insights-client";
+import type { MappingContainer, MappingsClient, Report, ReportMappingCollection } from "@itwin/insights-client";
+import { ExtractionClient, ReportsClient } from "@itwin/insights-client";
 import { ReportMappings } from "../widget/components/ReportMappings";
 import type { GetSingleIModelParams, IModelsClient } from "@itwin/imodels-client-management";
 import { BulkExtractor } from "../widget/components/BulkExtractor";
@@ -108,29 +101,25 @@ const mockReportMappingsFactory = (): ReportMappingCollection => {
   };
 };
 
-const mockMappingsFactory = (
-  mockReportMappings: ReportMappingCollection
-): MappingSingle[] => {
-  const mockMappings: MappingSingle[] = mockReportMappings.mappings.map(
-    (mapping, index) => ({
-      mapping: {
-        id: mapping.mappingId,
-        mappingName: `mOcKMaPpIngNaMe${index}`,
-        description: `mOcKmApPInGDeScRiPtIoN${index}`,
-        extractionEnabled: false,
-        createdOn: "",
-        createdBy: "",
-        modifiedOn: "",
-        modifiedBy: "",
-        _links: {
-          imodel: {
-            // Tie the mapping to to the iModel Id
-            href: mapping.imodelId,
-          },
+const mockMappingsFactory = (mockReportMappings: ReportMappingCollection): MappingContainer[] => {
+  const mockMappings: MappingContainer[] = mockReportMappings.mappings.map((mapping, index) => ({
+    mapping: {
+      id: mapping.mappingId,
+      mappingName: `mOcKMaPpIngNaMe${index}`,
+      description: `mOcKmApPInGDeScRiPtIoN${index}`,
+      extractionEnabled: false,
+      createdOn: "",
+      createdBy: "",
+      modifiedOn: "",
+      modifiedBy: "",
+      _links: {
+        iModel: {
+          // Tie the mapping to to the iModel Id
+          href: mapping.imodelId,
         },
       },
-    })
-  );
+    },
+  }));
 
   return mockMappings;
 };
@@ -142,10 +131,12 @@ jest.mock("../widget/components/Constants.ts", () => ({
 
 jest.mock("../widget/components/ReportMappingHorizontalTile", () => ({
   ReportMappingHorizontalTile: (props: ReportMappingHorizontalTileProps) => {
-    return (<div data-testid="horizontal-tile">
-      <Text>{props.mapping.mappingName}</Text>
-      <Text title={props.mapping.mappingDescription}>{props.mapping.iModelName}</Text>
-    </div>);
+    return (
+      <div data-testid="horizontal-tile">
+        <Text>{props.mapping.mappingName}</Text>
+        <Text title={props.mapping.mappingDescription}>{props.mapping.iModelName}</Text>
+      </div>
+    );
   },
 }));
 
@@ -178,15 +169,16 @@ const mockMappingsClient = moq.Mock.ofType<MappingsClient>();
 beforeAll(async () => {
   const localization = new EmptyLocalization();
   await ReportsConfigWidget.initialize(localization);
-  mockIModelsClientOperations.setup(async (x) => x.getSingle(moq.It.isObjectWith<GetSingleIModelParams>({ iModelId: mockIModelId1 })))
+  mockIModelsClientOperations
+    .setup(async (x) => x.getSingle(moq.It.isObjectWith<GetSingleIModelParams>({ iModelId: mockIModelId1 })))
     .returns(async () => mockIModelsResponse[0].iModel);
-  mockIModelsClientOperations.setup(async (x) => x.getSingle(moq.It.isObjectWith<GetSingleIModelParams>({ iModelId: mockIModelId2 })))
+  mockIModelsClientOperations
+    .setup(async (x) => x.getSingle(moq.It.isObjectWith<GetSingleIModelParams>({ iModelId: mockIModelId2 })))
     .returns(async () => mockIModelsResponse[1].iModel);
-  mockIModelsClient.setup((x) => x.iModels)
-    .returns(() => mockIModelsClientOperations.object);
+  mockIModelsClient.setup((x) => x.iModels).returns(() => mockIModelsClientOperations.object);
   mockReportsClient.setup(async (x) => x.getReportMappings(moq.It.isAny(), moq.It.isAny())).returns(mockGetReportMappings);
   mockMappingsClient.setup(async (x) => x.getMappings(moq.It.isAny(), moq.It.isAny())).returns(mockGetMappings);
-  mockMappingsClient.setup(async (x) => x.getMapping(moq.It.isAny(), moq.It.isAny(), moq.It.isAny())).returns(mockGetMapping);
+  mockMappingsClient.setup(async (x) => x.getMapping(moq.It.isAny(), moq.It.isAny())).returns(mockGetMapping);
 });
 
 afterEach(() => {
@@ -203,7 +195,11 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, { reportsClient: mockReportsClient.object, mappingsClient: mockMappingsClient.object, iModelsClient: mockIModelsClient.object });
+    render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+      reportsClient: mockReportsClient.object,
+      mappingsClient: mockMappingsClient.object,
+      iModelsClient: mockIModelsClient.object,
+    });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
@@ -218,7 +214,11 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, { reportsClient: mockReportsClient.object, mappingsClient: mockMappingsClient.object, iModelsClient: mockIModelsClient.object });
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+      reportsClient: mockReportsClient.object,
+      mappingsClient: mockMappingsClient.object,
+      iModelsClient: mockIModelsClient.object,
+    });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
@@ -232,29 +232,20 @@ describe("Report Mappings View", () => {
     // Be an exact match on display name.
     await user.type(searchInput, mockMappings[0].mapping.mappingName);
     expect(screen.getAllByTestId("horizontal-tile")).toHaveLength(1);
-    expect(
-      screen.getByText(mockMappings[0].mapping.mappingName)
-    ).toBeInTheDocument();
+    expect(screen.getByText(mockMappings[0].mapping.mappingName)).toBeInTheDocument();
 
     // Be an exact match on description.
     await user.clear(searchInput);
     await user.type(searchInput, mockMappings[0].mapping.description ?? "");
     expect(screen.getAllByTestId("horizontal-tile")).toHaveLength(1);
-    expect(
-      screen.getByTitle(mockMappings[0].mapping.description ?? "")
-    ).toBeInTheDocument();
+    expect(screen.getByTitle(mockMappings[0].mapping.description ?? "")).toBeInTheDocument();
 
     // Be an exact match on iModel Name.
-    const iModel = mockIModelsResponse.find(
-      (mockIModel) =>
-        mockIModel.iModel.id === mockMappings[0].mapping._links.imodel.href
-    );
+    const iModel = mockIModelsResponse.find((mockIModel) => mockIModel.iModel.id === mockMappings[0].mapping._links.iModel.href);
     await user.clear(searchInput);
     await user.type(searchInput, iModel?.iModel.displayName ?? "");
     expect(screen.getAllByTestId("horizontal-tile")).toHaveLength(1);
-    expect(
-      screen.getByText(iModel?.iModel.displayName ?? "")
-    ).toBeInTheDocument();
+    expect(screen.getByText(iModel?.iModel.displayName ?? "")).toBeInTheDocument();
   });
 
   it("add mapping", async () => {
@@ -264,11 +255,15 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, { reportsClient: mockReportsClient.object, mappingsClient: mockMappingsClient.object, iModelsClient: mockIModelsClient.object });
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+      reportsClient: mockReportsClient.object,
+      mappingsClient: mockMappingsClient.object,
+      iModelsClient: mockIModelsClient.object,
+    });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
-    mockGetMappings.mockReturnValueOnce(mockMappings.map((m: MappingSingle) => m.mapping));
+    mockGetMappings.mockReturnValueOnce(mockMappings.map((m: MappingContainer) => m.mapping));
 
     const addMappingButton = screen.getByRole("button", {
       name: /addmapping/i,
@@ -290,7 +285,11 @@ describe("Report Mappings View", () => {
   });
 
   it("odata feed url", async () => {
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, { reportsClient: mockReportsClient.object, mappingsClient: mockMappingsClient.object, iModelsClient: mockIModelsClient.object });
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+      reportsClient: mockReportsClient.object,
+      mappingsClient: mockMappingsClient.object,
+      iModelsClient: mockIModelsClient.object,
+    });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
@@ -298,11 +297,7 @@ describe("Report Mappings View", () => {
       name: /odatafeedurl/i,
     });
     expect(urlTextbox).toBeInTheDocument();
-    expect(
-      screen.getByDisplayValue(
-        `https://api.bentley.com/insights/reporting/odata/${mockReport.id}`
-      )
-    ).toBeInTheDocument();
+    expect(screen.getByDisplayValue(`https://api.bentley.com/insights/reporting/odata/${mockReport.id}`)).toBeInTheDocument();
 
     const copyButton = screen.getByRole("button", {
       name: /copy/i,
@@ -319,13 +314,16 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    const iModels = mockIModelsResponse.map((iModel) => iModel.iModel.id);
-
     const bulkExtractor = new BulkExtractor(new ReportsClient(), new ExtractionClient(), jest.fn().mockResolvedValue("mockAccessToken"), jest.fn, jest.fn);
 
     const runIModelExtractionsMock = jest.spyOn(bulkExtractor, "runIModelExtractions").mockImplementation(async () => Promise.resolve());
 
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, { reportsClient: mockReportsClient.object, mappingsClient: mockMappingsClient.object, iModelsClient: mockIModelsClient.object, bulkExtractor });
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+      reportsClient: mockReportsClient.object,
+      mappingsClient: mockMappingsClient.object,
+      iModelsClient: mockIModelsClient.object,
+      bulkExtractor,
+    });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
@@ -336,31 +334,18 @@ describe("Report Mappings View", () => {
     await waitFor(() => expect(extractAllButton).toBeEnabled());
 
     // Check that the mocked method was called with the expected arguments
-    expect(runIModelExtractionsMock).toHaveBeenCalledWith(iModels);
+    expect(runIModelExtractionsMock).toHaveBeenCalledWith(mockExtractionRequestDetails);
   });
 
-  const assertHorizontalTiles = (horizontalTiles: HTMLElement[], mockMappings: MappingSingle[]) => {
+  const assertHorizontalTiles = (horizontalTiles: HTMLElement[], mockMappings: MappingContainer[]) => {
     expect(horizontalTiles).toHaveLength(mockMappings.length);
 
     for (const [index, horizontalTile] of horizontalTiles.entries()) {
       const reportMappingTile = within(horizontalTile);
-      const mockiModel = mockIModelsResponse.find(
-        (iModel) =>
-          iModel.iModel.id === mockMappings[index].mapping._links.imodel.href
-      );
-      expect(
-        reportMappingTile.getByText(
-          mockMappings[index].mapping.mappingName
-        )
-      ).toBeInTheDocument();
-      expect(
-        reportMappingTile.getByTitle(
-          mockMappings[index].mapping.description ?? ""
-        )
-      ).toBeInTheDocument();
-      expect(
-        reportMappingTile.getByText(mockiModel?.iModel.displayName ?? "")
-      ).toBeInTheDocument();
+      const mockiModel = mockIModelsResponse.find((iModel) => iModel.iModel.id === mockMappings[index].mapping._links.iModel.href);
+      expect(reportMappingTile.getByText(mockMappings[index].mapping.mappingName)).toBeInTheDocument();
+      expect(reportMappingTile.getByTitle(mockMappings[index].mapping.description ?? "")).toBeInTheDocument();
+      expect(reportMappingTile.getByText(mockiModel?.iModel.displayName ?? "")).toBeInTheDocument();
     }
   };
 });

package/src/test/Reports.test.tsx

@@ -1,15 +1,10 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import React from "react";
 import "@testing-library/jest-dom";
-import {
-  render,
-  screen,
-  waitForElementToBeRemoved,
-  within,
-} from "../test/test-utils";
+import { render, screen, waitForElementToBeRemoved, within } from "../test/test-utils";
 import { Reports } from "../widget/components/Reports";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import faker from "@faker-js/faker";
@@ -19,20 +14,17 @@ import { EmptyLocalization } from "@itwin/core-common";
 import * as moq from "typemoq";
 
 const reportsFactory = (): ReportCollection => ({
-  reports: Array.from(
-    { length: faker.datatype.number({ min: 3, max: 5 }) },
-    (_, index) => ({
-      id: `${faker.datatype.uuid()}`,
-      displayName: `mOcKRePoRT${index}`,
-      description: `mOcKRePoRTDeScRiPtIoN${index}`,
-      deleted: false,
-      _links: {
-        project: {
-          href: "",
-        },
+  reports: Array.from({ length: faker.datatype.number({ min: 3, max: 5 }) }, (_, index) => ({
+    id: `${faker.datatype.uuid()}`,
+    displayName: `mOcKRePoRT${index}`,
+    description: `mOcKRePoRTDeScRiPtIoN${index}`,
+    deleted: false,
+    _links: {
+      project: {
+        href: "",
       },
-    })
-  ),
+    },
+  })),
   _links: {
     next: undefined,
     self: {
@@ -78,7 +70,7 @@ describe("Reports View", () => {
     mockGetReports.mockReturnValueOnce([]);
 
     const onClickAddMock = jest.fn();
-    const { user } = render(<Reports onClickAddReport={onClickAddMock} />,  { reportsClient: mockReportsClient.object });
+    const { user } = render(<Reports onClickAddReport={onClickAddMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
     const newButton = screen.getByRole("button", {
@@ -92,7 +84,7 @@ describe("Reports View", () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
 
-    render(<Reports />,  { reportsClient: mockReportsClient.object });
+    render(<Reports />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
     const horizontalTiles = screen.getAllByTestId("horizontal-tile");
@@ -101,16 +93,8 @@ describe("Reports View", () => {
 
     for (const [index, horizontalTile] of horizontalTiles.entries()) {
       const reportMappingTile = within(horizontalTile);
-      expect(
-        reportMappingTile.getByText(
-          mockedReports?.reports[index].displayName ?? ""
-        )
-      ).toBeInTheDocument();
-      expect(
-        reportMappingTile.getByTitle(
-          mockedReports?.reports[index].description ?? ""
-        )
-      ).toBeInTheDocument();
+      expect(reportMappingTile.getByText(mockedReports?.reports[index].displayName ?? "")).toBeInTheDocument();
+      expect(reportMappingTile.getByTitle(mockedReports?.reports[index].description ?? "")).toBeInTheDocument();
     }
   });
 
@@ -118,13 +102,11 @@ describe("Reports View", () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
     const onClickModifyMock = jest.fn();
-    const { user } = render(<Reports onClickReportModify={onClickModifyMock} />,  { reportsClient: mockReportsClient.object });
+    const { user } = render(<Reports onClickReportModify={onClickModifyMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
-    const firstMenuDropdown = within(
-      screen.getAllByTestId(/tile-action-button/i)[0]
-    ).getByRole("button");
+    const firstMenuDropdown = within(screen.getAllByTestId(/tile-action-button/i)[0]).getByRole("button");
     await user.click(firstMenuDropdown);
     const modifyButton = screen.getByRole("menuitem", { name: /modify/i });
     await user.click(modifyButton);
@@ -137,13 +119,11 @@ describe("Reports View", () => {
 
     mockGetReports.mockReturnValue(mockedReports.reports);
 
-    const { user } = render(<Reports />,  { reportsClient: mockReportsClient.object });
+    const { user } = render(<Reports />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
-    const firstMenuDropdown = within(
-      screen.getAllByTestId(/tile-action-button/i)[0]
-    ).getByRole("button");
+    const firstMenuDropdown = within(screen.getAllByTestId(/tile-action-button/i)[0]).getByRole("button");
     await user.click(firstMenuDropdown);
     const removeButton = screen.getByRole("menuitem", { name: /remove/i });
     await user.click(removeButton);
@@ -178,38 +158,26 @@ describe("Reports View", () => {
     });
 
     // Be an exact match on display name.
-    await userEvent.type(
-      searchInput,
-      mockedReports.reports[0].displayName
-    );
+    await userEvent.type(searchInput, mockedReports.reports[0].displayName);
     expect(screen.getAllByTestId("horizontal-tile")).toHaveLength(1);
-    expect(
-      screen.getByText(mockedReports.reports[0].displayName)
-    ).toBeInTheDocument();
+    expect(screen.getByText(mockedReports.reports[0].displayName)).toBeInTheDocument();
 
     // Be an exact match on description.
     await userEvent.clear(searchInput);
-    await userEvent.type(
-      searchInput,
-      mockedReports.reports[0].description ?? ""
-    );
+    await userEvent.type(searchInput, mockedReports.reports[0].description ?? "");
     expect(screen.getAllByTestId("horizontal-tile")).toHaveLength(1);
-    expect(
-      screen.getByText(mockedReports.reports[0].displayName)
-    ).toBeInTheDocument();
+    expect(screen.getByText(mockedReports.reports[0].displayName)).toBeInTheDocument();
   });
 
   it("modify a report", async () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
     const onClickModifyMock = jest.fn();
-    const { user } = render(<Reports onClickReportModify={onClickModifyMock} />,  { reportsClient: mockReportsClient.object });
+    const { user } = render(<Reports onClickReportModify={onClickModifyMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
-    const firstMenuDropdown = within(
-      screen.getAllByTestId(/tile-action-button/i)[0]
-    ).getByRole("button");
+    const firstMenuDropdown = within(screen.getAllByTestId(/tile-action-button/i)[0]).getByRole("button");
     await user.click(firstMenuDropdown);
     const modifyButton = screen.getByRole("menuitem", { name: /modify/i });
     await user.click(modifyButton);
@@ -220,13 +188,11 @@ describe("Reports View", () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
     const onClickTitleMock = jest.fn();
-    const { user } = render(<Reports onClickReportTitle={onClickTitleMock} />,  { reportsClient: mockReportsClient.object });
+    const { user } = render(<Reports onClickReportTitle={onClickTitleMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
 
-    const reportName = screen.getByText(
-      mockedReports.reports[0].displayName
-    );
+    const reportName = screen.getByText(mockedReports.reports[0].displayName);
     await user.click(reportName);
     expect(onClickTitleMock).toBeCalled();
   });

package/src/test/WidgetHeader.test.tsx

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import React from "react";
 import "@testing-library/jest-dom";
 import { render, screen } from "../test/test-utils";

package/src/test/test-utils.tsx

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 import * as React from "react";
 import { render as rtlRender } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
@@ -14,6 +14,9 @@ export const mockAccessToken = async () => "Bearer eyJhbGci";
 export const mockIModelId1 = "mockIModelId1";
 export const mockIModelId2 = "mockIModelId2";
 
+export const mockMappingId1 = "mockMappingId1";
+export const mockMappingId2 = "mockMappingId2";
+
 export const mockReportId = "mockReportId";
 export const mockITwinId: string = "mockiTwinId";
 
@@ -72,17 +75,24 @@ export const mockIModelsResponse = [
   },
 ];
 
+export const mockExtractionRequestDetails = [
+  {
+    iModelId: mockIModelId1,
+    mappings: [{ id: mockMappingId1 }],
+  },
+  {
+    iModelId: mockIModelId2,
+    mappings: [{ id: mockMappingId2 }],
+  },
+];
+
 interface WrapperProps {
   children?: React.ReactNode;
 }
 
 function render(ui: React.ReactElement, contextProps?: Partial<ReportsConfigContextProps>, { ...options } = {}) {
   const Wrapper = ({ children }: WrapperProps) => (
-    <ReportsConfigContext
-      getAccessToken={mockAccessToken}
-      iTwinId={contextProps?.iTwinId ?? mockITwinId}
-      {...contextProps}
-    >
+    <ReportsConfigContext getAccessToken={mockAccessToken} iTwinId={contextProps?.iTwinId ?? mockITwinId} {...contextProps}>
       {children}
     </ReportsConfigContext>
   );

package/src/widget/ReportsConfigUiProvider.tsx

@@ -1,54 +1,40 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-import type {
-  UiItemsProvider,
-  Widget,
-} from "@itwin/appui-react";
-import {
-  StagePanelLocation,
-  StagePanelSection,
-  StageUsage,
-} from "@itwin/appui-react";
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import type { UiItemsProvider, Widget } from "@itwin/appui-react";
+import { StagePanelLocation, StagePanelSection, StageUsage } from "@itwin/appui-react";
 import type { AccessToken } from "@itwin/core-bentley";
 
 import * as React from "react";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import ReportsContainer from "./components/ReportsContainer";
 
+/**
+ * @internal
+ */
 export const REPORTS_CONFIG_BASE_URL = "https://api.bentley.com";
 
+/**
+ * Reports Config Widget UI Provider
+ * @public
+ */
 export class ReportsConfigProvider implements UiItemsProvider {
   public readonly id = "ReportsConfigProvider";
   private readonly _getAccessToken?: () => Promise<AccessToken>;
   private readonly _baseUrl: string;
 
-  constructor(
-    getAccessToken?: () => Promise<AccessToken>,
-    baseUrl: string = REPORTS_CONFIG_BASE_URL
-  ) {
+  constructor(getAccessToken?: () => Promise<AccessToken>, baseUrl: string = REPORTS_CONFIG_BASE_URL) {
     this._getAccessToken = getAccessToken;
     this._baseUrl = baseUrl;
   }
 
-  public provideWidgets(
-    _stageId: string,
-    stageUsage: string,
-    location: StagePanelLocation,
-    section?: StagePanelSection
-  ): ReadonlyArray<Widget> {
+  public provideWidgets(_stageId: string, stageUsage: string, location: StagePanelLocation, section?: StagePanelSection): ReadonlyArray<Widget> {
     const widgets: Widget[] = [];
-    if (
-      location === StagePanelLocation.Left &&
-      section === StagePanelSection.Start &&
-      stageUsage === StageUsage.General
-    ) {
+    if (location === StagePanelLocation.Left && section === StagePanelSection.Start && stageUsage === StageUsage.General) {
       const ReportsWidget: Widget = {
         id: "reports-config-widget",
-        label: ReportsConfigWidget.localization.getLocalizedString(
-          "ReportsConfigWidget:ReportsConfig"
-        ),
+        label: ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ReportsConfig"),
         content: <ReportsContainer getAccessToken={this._getAccessToken} baseUrl={this._baseUrl} />,
       };
 

package/src/widget/components/ActionPanel.tsx

@@ -28,23 +28,12 @@ const ActionPanel = ({
   return (
     <div className="rcw-action-panel">
       {isLoading && <LoadingSpinner />}
-      <Button
-        disabled={isSavingDisabled || isLoading}
-        styleType="high-visibility"
-        onClick={onAction}
-      >
+      <Button disabled={isSavingDisabled || isLoading} styleType="high-visibility" onClick={onAction}>
         {actionLabel}
       </Button>
       {onCancel && (
-        <Button
-          styleType="default"
-          type="button"
-          onClick={onCancel}
-          disabled={isCancelDisabled || isLoading}
-        >
-          {ReportsConfigWidget.localization.getLocalizedString(
-            "ReportsConfigWidget:Cancel"
-          )}
+        <Button styleType="default" type="button" onClick={onCancel} disabled={isCancelDisabled || isLoading}>
+          {ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:Cancel")}
         </Button>
       )}
     </div>

package/src/widget/components/AddMappingsModal.scss

@@ -15,4 +15,4 @@
     flex-grow: 1;
     overflow: auto;
   }
-}
+}