@itwin/grouping-mapping-widget 0.21.1 → 0.22.0

package/lib/esm/components/GroupingMappingContext.js

@@ -11,8 +11,34 @@ import { GroupHilitedElementsContext } from "./context/GroupHilitedElementsConte
 import { PropertiesContext } from "./context/PropertiesContext";
 import { useActiveIModelConnection } from "@itwin/appui-react";
 import { createExtractionClient, ExtractionClientContext } from "./context/ExtractionClientContext";
-import { ExtractionStatusDataContext } from "./context/ExtractionStatusDataContext";
+import { MutationCache, QueryCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { toaster } from "@itwin/itwinui-react";
+import { getErrorMessage } from "../common/utils";
 const authorizationClientGetAccessToken = async () => (await IModelApp.authorizationClient?.getAccessToken()) ?? "";
+const queryClient = new QueryClient({
+    defaultOptions: {
+        queries: {
+            refetchOnWindowFocus: false,
+            staleTime: 20 * 60 * 1000, // 20 minutes
+        },
+    },
+    queryCache: new QueryCache({
+        onError: (error) => {
+            if (error.status)
+                toaster.negative(getErrorMessage(error.status));
+            else
+                toaster.negative("An error occurred while fetching data.");
+        },
+    }),
+    mutationCache: new MutationCache({
+        onError: (error) => {
+            if (error.status)
+                toaster.negative(getErrorMessage(error.status));
+            else
+                toaster.negative("A network error occured while processing this action.");
+        },
+    }),
+});
 export const GroupingMappingContext = (props) => {
     const activeIModelConntextion = useActiveIModelConnection();
     const clientProp = props.client ?? props.prefix;
@@ -39,8 +65,6 @@ export const GroupingMappingContext = (props) => {
     const [isOverlappedColored, setIsOverlappedColored] = useState(false);
     const [currentHilitedGroups, setCurrentHilitedGroups] = useState(1);
     const [overlappedElementGroupPairs, setOverlappedElementGroupPairs] = useState([]);
-    const [extractionStatusIcon, setExtractionStatusIcon] = useState({ iconStatus: undefined, iconMessage: "Loading..." });
-    const [extractionMessageData, setExtractionMessageData] = useState([]);
     useEffect(() => {
         setApiConfig(() => ({
             prefix: props.prefix,
@@ -93,16 +117,10 @@ export const GroupingMappingContext = (props) => {
         customUIs,
         setCustomUIs,
     }), [customUIs]);
-    const extractionStatusDataValue = useMemo(() => ({
-        extractionStatusIcon,
-        extractionMessageData,
-        setExtractionMessageData,
-        setExtractionStatusIcon,
-    }), [extractionStatusIcon, extractionMessageData]);
-    return (React.createElement(GroupingMappingApiConfigContext.Provider, { value: apiConfig },
-        React.createElement(MappingClientContext.Provider, { value: mappingClient },
-            React.createElement(ExtractionClientContext.Provider, { value: extractionClient },
-                React.createElement(ExtractionStatusDataContext.Provider, { value: extractionStatusDataValue },
+    return (React.createElement(QueryClientProvider, { client: queryClient },
+        React.createElement(GroupingMappingApiConfigContext.Provider, { value: apiConfig },
+            React.createElement(MappingClientContext.Provider, { value: mappingClient },
+                React.createElement(ExtractionClientContext.Provider, { value: extractionClient },
                     React.createElement(GroupingMappingCustomUIContext.Provider, { value: customUIContextValue },
                         React.createElement(GroupHilitedElementsContext.Provider, { value: hilitedElementsContextValue },
                             React.createElement(PropertiesContext.Provider, { value: propertiesContextValue }, props.children))))))));

package/lib/esm/components/GroupingMappingContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupingMappingContext.js","sourceRoot":"","sources":["../../../src/components/GroupingMappingContext.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport React, { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport { IModelApp } from \"@itwin/core-frontend\";\nimport type {\n  ClientPrefix,\n  GetAccessTokenFn,\n  GroupingMappingApiConfig,\n} from \"./context/GroupingApiConfigContext\";\nimport { GroupingMappingApiConfigContext } from \"./context/GroupingApiConfigContext\";\nimport {\n  createMappingClient,\n  MappingClientContext,\n} from \"./context/MappingClientContext\";\nimport type { CalculatedProperty, CustomCalculation, Group, GroupProperty, IExtractionClient, IMappingsClient } from \"@itwin/insights-client\";\nimport { createGroupingMappingCustomUI, GroupingMappingCustomUIContext } from \"./context/GroupingMappingCustomUIContext\";\nimport type { GroupingMappingCustomUI } from \"./customUI/GroupingMappingCustomUI\";\nimport type { OverlappedElementGroupPairs, OverlappedInfo, QueryCacheItem } from \"./context/GroupHilitedElementsContext\";\nimport { GroupHilitedElementsContext } from \"./context/GroupHilitedElementsContext\";\nimport { PropertiesContext } from \"./context/PropertiesContext\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { createExtractionClient, ExtractionClientContext } from \"./context/ExtractionClientContext\";\nimport type { ExtractionMessageData, ExtractionStatusData, IExtractionStatusDataProps } from \"./context/ExtractionStatusDataContext\";\nimport { ExtractionStatusDataContext } from \"./context/ExtractionStatusDataContext\";\n\nexport interface GroupingMappingContextProps {\n  /**\n   * Custom callback to retrieve access token.\n   */\n  getAccessToken?: GetAccessTokenFn;\n  /**\n   * The iTwin iModel Id.\n   */\n  iModelId: string;\n  /**\n   * Used for iTwin and iModel APIs.\n   * Also used for Mapping API if a custom {@link client} is not provided.\n   */\n  prefix?: ClientPrefix;\n  /**\n   * A custom implementation of MappingClient.\n   */\n  client?: IMappingsClient;\n  /**\n   * A custom implementation of ExtractionClient.\n   */\n  extractionClient?: IExtractionClient;\n  /**\n   * Custom UI to add and update groups or provide additional group context capabilities.\n   */\n  customUIs?: GroupingMappingCustomUI[];\n  /**\n   * A custom iModelConnection to use instead of the active iModelConnection from UiFramework.\n   */\n  iModelConnection?: IModelConnection;\n  children?: React.ReactNode;\n}\n\nconst authorizationClientGetAccessToken = async () =>\n  (await IModelApp.authorizationClient?.getAccessToken()) ?? \"\";\n\nexport const GroupingMappingContext = (props: GroupingMappingContextProps) => {\n  const activeIModelConntextion = useActiveIModelConnection();\n  const clientProp: IMappingsClient | ClientPrefix = props.client ?? props.prefix;\n  const extractionClientProp: IExtractionClient | ClientPrefix = props.extractionClient ?? props.prefix;\n  const [mappingClient, setMappingClient] = useState<IMappingsClient>(createMappingClient(clientProp));\n  const [extractionClient, setExtractionClient] = useState<IExtractionClient>(createExtractionClient(extractionClientProp));\n  const [customUIs, setCustomUIs] = useState<GroupingMappingCustomUI[]>(\n    createGroupingMappingCustomUI(props.customUIs),\n  );\n  const [apiConfig, setApiConfig] = useState<GroupingMappingApiConfig>({\n    getAccessToken: props.getAccessToken ?? authorizationClientGetAccessToken,\n    iModelId: props.iModelId,\n    prefix: props.prefix,\n  });\n  const hilitedElementsQueryCache = useRef<Map<string, QueryCacheItem>>(new Map());\n  const [hiddenGroupsIds, setHiddenGroupsIds] = useState<Set<string>>(new Set());\n  const [showGroupColor, setShowGroupColor] = useState<boolean>(false);\n  const [propertiesShowGroup, setPropertiesShowGroup] = useState<boolean>(false);\n  const [groups, setGroups] = useState<Group[]>([]);\n  const [groupProperties, setGroupProperties] = useState<GroupProperty[]>([]);\n  const [calculatedProperties, setCalculatedProperties] = useState<CalculatedProperty[]>([]);\n  const [customCalculationProperties, setCustomCalculationProperties] = useState<CustomCalculation[]>([]);\n  const [numberOfVisualizedGroups, setNumberOfVisualizedGroups] = useState(0);\n  const [overlappedElementsInfo, setOverlappedElementsInfo] = useState<Map<string, OverlappedInfo[]>>(new Map());\n  const [groupElementsInfo, setGroupElementsInfo] = useState<Map<string, number>>(new Map());\n  const [isOverlappedColored, setIsOverlappedColored] = useState<boolean>(false);\n  const [currentHilitedGroups, setCurrentHilitedGroups] = useState<number>(1);\n  const [overlappedElementGroupPairs, setOverlappedElementGroupPairs] = useState<OverlappedElementGroupPairs[]>([]);\n  const [extractionStatusIcon, setExtractionStatusIcon] = useState<ExtractionStatusData>({iconStatus: undefined, iconMessage: \"Loading...\"});\n  const [extractionMessageData, setExtractionMessageData] = useState<ExtractionMessageData[]>([]);\n  useEffect(() => {\n    setApiConfig(() => ({\n      prefix: props.prefix,\n      iModelId: props.iModelId,\n      getAccessToken: props.getAccessToken ?? authorizationClientGetAccessToken,\n      iModelConnection: props.iModelConnection ?? activeIModelConntextion,\n    }));\n  }, [activeIModelConntextion, props.getAccessToken, props.iModelConnection, props.iModelId, props.prefix]);\n\n  useEffect(() => {\n    setMappingClient(createMappingClient(clientProp));\n  }, [clientProp]);\n\n  useEffect(() => {\n    setExtractionClient(createExtractionClient(extractionClientProp));\n  }, [extractionClientProp]);\n\n  useEffect(() => {\n    setCustomUIs(createGroupingMappingCustomUI(props.customUIs));\n  }, [props.customUIs]);\n\n  const hilitedElementsContextValue = useMemo(\n    () => ({\n      showGroupColor,\n      setShowGroupColor,\n      hiddenGroupsIds,\n      setHiddenGroupsIds,\n      hilitedElementsQueryCache,\n      groups,\n      setGroups,\n      numberOfVisualizedGroups,\n      setNumberOfVisualizedGroups,\n      overlappedElementsInfo,\n      setOverlappedElementsInfo,\n      groupElementsInfo,\n      setGroupElementsInfo,\n      isOverlappedColored,\n      setIsOverlappedColored,\n      currentHilitedGroups,\n      setCurrentHilitedGroups,\n      overlappedElementGroupPairs,\n      setOverlappedElementGroupPairs,\n    }),\n    [showGroupColor, hiddenGroupsIds, groups, numberOfVisualizedGroups, overlappedElementsInfo, groupElementsInfo, isOverlappedColored, currentHilitedGroups, overlappedElementGroupPairs]\n  );\n\n  const propertiesContextValue = useMemo(\n    () => ({\n      showGroupColor: propertiesShowGroup,\n      setShowGroupColor: setPropertiesShowGroup,\n      groupProperties,\n      setGroupProperties,\n      calculatedProperties,\n      setCalculatedProperties,\n      customCalculationProperties,\n      setCustomCalculationProperties,\n    }),\n    [calculatedProperties, customCalculationProperties, groupProperties, propertiesShowGroup]\n  );\n\n  const customUIContextValue = useMemo(() => ({\n    customUIs,\n    setCustomUIs,\n  }), [customUIs]);\n\n  const extractionStatusDataValue: IExtractionStatusDataProps = useMemo (() => ({\n    extractionStatusIcon,\n    extractionMessageData,\n    setExtractionMessageData,\n    setExtractionStatusIcon,\n  }), [extractionStatusIcon, extractionMessageData]);\n\n  return (\n    <GroupingMappingApiConfigContext.Provider value={apiConfig}>\n      <MappingClientContext.Provider value={mappingClient}>\n        <ExtractionClientContext.Provider value={extractionClient}>\n          <ExtractionStatusDataContext.Provider value={extractionStatusDataValue}>\n            <GroupingMappingCustomUIContext.Provider value={customUIContextValue}>\n              <GroupHilitedElementsContext.Provider value={hilitedElementsContextValue}>\n                <PropertiesContext.Provider value={propertiesContextValue}>\n                  {props.children}\n                </PropertiesContext.Provider>\n              </GroupHilitedElementsContext.Provider>\n            </GroupingMappingCustomUIContext.Provider>\n          </ExtractionStatusDataContext.Provider>\n        </ExtractionClientContext.Provider>\n      </MappingClientContext.Provider>\n    </GroupingMappingApiConfigContext.Provider>\n  );\n};\n"]}
+{"version":3,"file":"GroupingMappingContext.js","sourceRoot":"","sources":["../../../src/components/GroupingMappingContext.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport React, { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { IModelConnection } from \"@itwin/core-frontend\";\nimport { IModelApp } from \"@itwin/core-frontend\";\nimport type {\n  ClientPrefix,\n  GetAccessTokenFn,\n  GroupingMappingApiConfig,\n} from \"./context/GroupingApiConfigContext\";\nimport { GroupingMappingApiConfigContext } from \"./context/GroupingApiConfigContext\";\nimport {\n  createMappingClient,\n  MappingClientContext,\n} from \"./context/MappingClientContext\";\nimport type { CalculatedProperty, CustomCalculation, Group, GroupProperty, IExtractionClient, IMappingsClient } from \"@itwin/insights-client\";\nimport { createGroupingMappingCustomUI, GroupingMappingCustomUIContext } from \"./context/GroupingMappingCustomUIContext\";\nimport type { GroupingMappingCustomUI } from \"./customUI/GroupingMappingCustomUI\";\nimport type { OverlappedElementGroupPairs, OverlappedInfo, QueryCacheItem } from \"./context/GroupHilitedElementsContext\";\nimport { GroupHilitedElementsContext } from \"./context/GroupHilitedElementsContext\";\nimport { PropertiesContext } from \"./context/PropertiesContext\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { createExtractionClient, ExtractionClientContext } from \"./context/ExtractionClientContext\";\nimport { MutationCache, QueryCache, QueryClient, QueryClientProvider } from \"@tanstack/react-query\";\nimport { toaster } from \"@itwin/itwinui-react\";\nimport { getErrorMessage } from \"../common/utils\";\n\nexport interface GroupingMappingContextProps {\n  /**\n   * Custom callback to retrieve access token.\n   */\n  getAccessToken?: GetAccessTokenFn;\n  /**\n   * The iTwin iModel Id.\n   */\n  iModelId: string;\n  /**\n   * Used for iTwin and iModel APIs.\n   * Also used for Mapping API if a custom {@link client} is not provided.\n   */\n  prefix?: ClientPrefix;\n  /**\n   * A custom implementation of MappingClient.\n   */\n  client?: IMappingsClient;\n  /**\n   * A custom implementation of ExtractionClient.\n   */\n  extractionClient?: IExtractionClient;\n  /**\n   * Custom UI to add and update groups or provide additional group context capabilities.\n   */\n  customUIs?: GroupingMappingCustomUI[];\n  /**\n   * A custom iModelConnection to use instead of the active iModelConnection from UiFramework.\n   */\n  iModelConnection?: IModelConnection;\n  children?: React.ReactNode;\n}\n\nconst authorizationClientGetAccessToken = async () =>\n  (await IModelApp.authorizationClient?.getAccessToken()) ?? \"\";\n\nconst queryClient = new QueryClient({\n  defaultOptions: {\n    queries: {\n      refetchOnWindowFocus: false,\n      staleTime: 20 * 60 * 1000, // 20 minutes\n    },\n  },\n  queryCache: new QueryCache({\n    onError: (error: any) => {\n      if (error.status)\n        toaster.negative(getErrorMessage(error.status));\n      else\n        toaster.negative(\"An error occurred while fetching data.\");\n    },\n  }),\n  mutationCache: new MutationCache({\n    onError: (error: any) => {\n      if (error.status)\n        toaster.negative(getErrorMessage(error.status));\n      else\n        toaster.negative(\"A network error occured while processing this action.\");\n    },\n  }),\n});\n\nexport const GroupingMappingContext = (props: GroupingMappingContextProps) => {\n  const activeIModelConntextion = useActiveIModelConnection();\n  const clientProp: IMappingsClient | ClientPrefix = props.client ?? props.prefix;\n  const extractionClientProp: IExtractionClient | ClientPrefix = props.extractionClient ?? props.prefix;\n  const [mappingClient, setMappingClient] = useState<IMappingsClient>(createMappingClient(clientProp));\n  const [extractionClient, setExtractionClient] = useState<IExtractionClient>(createExtractionClient(extractionClientProp));\n  const [customUIs, setCustomUIs] = useState<GroupingMappingCustomUI[]>(\n    createGroupingMappingCustomUI(props.customUIs),\n  );\n  const [apiConfig, setApiConfig] = useState<GroupingMappingApiConfig>({\n    getAccessToken: props.getAccessToken ?? authorizationClientGetAccessToken,\n    iModelId: props.iModelId,\n    prefix: props.prefix,\n  });\n  const hilitedElementsQueryCache = useRef<Map<string, QueryCacheItem>>(new Map());\n  const [hiddenGroupsIds, setHiddenGroupsIds] = useState<Set<string>>(new Set());\n  const [showGroupColor, setShowGroupColor] = useState<boolean>(false);\n  const [propertiesShowGroup, setPropertiesShowGroup] = useState<boolean>(false);\n  const [groups, setGroups] = useState<Group[]>([]);\n  const [groupProperties, setGroupProperties] = useState<GroupProperty[]>([]);\n  const [calculatedProperties, setCalculatedProperties] = useState<CalculatedProperty[]>([]);\n  const [customCalculationProperties, setCustomCalculationProperties] = useState<CustomCalculation[]>([]);\n  const [numberOfVisualizedGroups, setNumberOfVisualizedGroups] = useState(0);\n  const [overlappedElementsInfo, setOverlappedElementsInfo] = useState<Map<string, OverlappedInfo[]>>(new Map());\n  const [groupElementsInfo, setGroupElementsInfo] = useState<Map<string, number>>(new Map());\n  const [isOverlappedColored, setIsOverlappedColored] = useState<boolean>(false);\n  const [currentHilitedGroups, setCurrentHilitedGroups] = useState<number>(1);\n  const [overlappedElementGroupPairs, setOverlappedElementGroupPairs] = useState<OverlappedElementGroupPairs[]>([]);\n\n  useEffect(() => {\n    setApiConfig(() => ({\n      prefix: props.prefix,\n      iModelId: props.iModelId,\n      getAccessToken: props.getAccessToken ?? authorizationClientGetAccessToken,\n      iModelConnection: props.iModelConnection ?? activeIModelConntextion,\n    }));\n  }, [activeIModelConntextion, props.getAccessToken, props.iModelConnection, props.iModelId, props.prefix]);\n\n  useEffect(() => {\n    setMappingClient(createMappingClient(clientProp));\n  }, [clientProp]);\n\n  useEffect(() => {\n    setExtractionClient(createExtractionClient(extractionClientProp));\n  }, [extractionClientProp]);\n\n  useEffect(() => {\n    setCustomUIs(createGroupingMappingCustomUI(props.customUIs));\n  }, [props.customUIs]);\n\n  const hilitedElementsContextValue = useMemo(\n    () => ({\n      showGroupColor,\n      setShowGroupColor,\n      hiddenGroupsIds,\n      setHiddenGroupsIds,\n      hilitedElementsQueryCache,\n      groups,\n      setGroups,\n      numberOfVisualizedGroups,\n      setNumberOfVisualizedGroups,\n      overlappedElementsInfo,\n      setOverlappedElementsInfo,\n      groupElementsInfo,\n      setGroupElementsInfo,\n      isOverlappedColored,\n      setIsOverlappedColored,\n      currentHilitedGroups,\n      setCurrentHilitedGroups,\n      overlappedElementGroupPairs,\n      setOverlappedElementGroupPairs,\n    }),\n    [showGroupColor, hiddenGroupsIds, groups, numberOfVisualizedGroups, overlappedElementsInfo, groupElementsInfo, isOverlappedColored, currentHilitedGroups, overlappedElementGroupPairs]\n  );\n\n  const propertiesContextValue = useMemo(\n    () => ({\n      showGroupColor: propertiesShowGroup,\n      setShowGroupColor: setPropertiesShowGroup,\n      groupProperties,\n      setGroupProperties,\n      calculatedProperties,\n      setCalculatedProperties,\n      customCalculationProperties,\n      setCustomCalculationProperties,\n    }),\n    [calculatedProperties, customCalculationProperties, groupProperties, propertiesShowGroup]\n  );\n\n  const customUIContextValue = useMemo(() => ({\n    customUIs,\n    setCustomUIs,\n  }), [customUIs]);\n\n  return (\n    <QueryClientProvider client={queryClient}>\n      <GroupingMappingApiConfigContext.Provider value={apiConfig}>\n        <MappingClientContext.Provider value={mappingClient}>\n          <ExtractionClientContext.Provider value={extractionClient}>\n            <GroupingMappingCustomUIContext.Provider value={customUIContextValue}>\n              <GroupHilitedElementsContext.Provider value={hilitedElementsContextValue}>\n                <PropertiesContext.Provider value={propertiesContextValue}>\n                  {props.children}\n                </PropertiesContext.Provider>\n              </GroupHilitedElementsContext.Provider>\n            </GroupingMappingCustomUIContext.Provider>\n          </ExtractionClientContext.Provider>\n        </MappingClientContext.Provider>\n      </GroupingMappingApiConfigContext.Provider>\n    </QueryClientProvider>\n  );\n};\n"]}

package/lib/esm/components/Groups/hooks/useFetchGroups.d.ts

@@ -0,0 +1,5 @@
+import type { IMappingsClient } from "@itwin/insights-client";
+import type { GetAccessTokenFn } from "../../context/GroupingApiConfigContext";
+export declare const fetchGroups: (iModelId: string, mappingId: string, getAccessToken: GetAccessTokenFn, mappingsClient: IMappingsClient) => Promise<import("@itwin/insights-client").Group[]>;
+export declare const useFetchGroups: (iModelId: string, mappingId: string, getAccessToken: GetAccessTokenFn, mappingsClient: IMappingsClient) => import("@tanstack/react-query").UseQueryResult<import("@itwin/insights-client").Group[], unknown>;
+//# sourceMappingURL=useFetchGroups.d.ts.map

package/lib/esm/components/Groups/hooks/useFetchGroups.js

@@ -0,0 +1,13 @@
+import { useQuery } from "@tanstack/react-query";
+export const fetchGroups = async (iModelId, mappingId, getAccessToken, mappingsClient) => {
+    const accessToken = await getAccessToken();
+    const groups = await mappingsClient.getGroups(accessToken, iModelId, mappingId);
+    return groups;
+};
+export const useFetchGroups = (iModelId, mappingId, getAccessToken, mappingsClient) => {
+    return useQuery({
+        queryKey: ["groups", mappingId],
+        queryFn: async () => fetchGroups(iModelId, mappingId, getAccessToken, mappingsClient),
+    });
+};
+//# sourceMappingURL=useFetchGroups.js.map

package/lib/esm/components/Groups/hooks/useFetchGroups.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchGroups.js","sourceRoot":"","sources":["../../../../../src/components/Groups/hooks/useFetchGroups.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGjD,MAAM,CAAC,MAAM,WAAW,GAAG,KAAK,EAC9B,QAAgB,EAChB,SAAiB,EACjB,cAAgC,EAChC,cAA+B,EAChC,EAAE;IACD,MAAM,WAAW,GAAG,MAAM,cAAc,EAAE,CAAC;IAC3C,MAAM,MAAM,GAAG,MAAM,cAAc,CAAC,SAAS,CAAC,WAAW,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;IAChF,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAgB,EAAE,SAAiB,EAAE,cAAgC,EAAE,cAA+B,EAAE,EAAE;IACvI,OAAO,QAAQ,CAAC;QACd,QAAQ,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC;QAC/B,OAAO,EAAG,KAAK,IAAI,EAAE,CAAC,WAAW,CAAC,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,cAAc,CAAC;KACvF,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport type { IMappingsClient } from \"@itwin/insights-client\";\nimport { useQuery } from \"@tanstack/react-query\";\nimport type { GetAccessTokenFn } from \"../../context/GroupingApiConfigContext\";\n\nexport const fetchGroups = async (\n  iModelId: string,\n  mappingId: string,\n  getAccessToken: GetAccessTokenFn,\n  mappingsClient: IMappingsClient\n)=> {\n  const accessToken = await getAccessToken();\n  const groups = await mappingsClient.getGroups(accessToken, iModelId, mappingId);\n  return groups;\n};\n\nexport const useFetchGroups = (iModelId: string, mappingId: string, getAccessToken: GetAccessTokenFn, mappingsClient: IMappingsClient) => {\n  return useQuery({\n    queryKey: [\"groups\", mappingId],\n    queryFn:  async () => fetchGroups(iModelId, mappingId, getAccessToken, mappingsClient),\n  });\n};\n"]}

package/lib/esm/components/Mappings/Editing/MappingAction.js

@@ -9,7 +9,8 @@ import useValidator, { NAME_REQUIREMENTS } from "../../Properties/hooks/useValid
 import "./MappingAction.scss";
 import { useMappingClient } from "../../context/MappingClientContext";
 import { useGroupingMappingApiConfig } from "../../context/GroupingApiConfigContext";
-import { handleError, handleInputChange } from "../../../common/utils";
+import { handleInputChange } from "../../../common/utils";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
 const defaultDisplayStrings = {
     mappingDetails: "Mapping Details",
 };
@@ -22,40 +23,30 @@ export const MappingAction = ({ mapping, onSaveSuccess, onClickCancel, displaySt
         extractionEnabled: mapping?.extractionEnabled ?? true,
     });
     const [validator, showValidationMessage] = useValidator();
-    const [isLoading, setIsLoading] = useState(false);
+    const queryClient = useQueryClient();
     const displayStrings = React.useMemo(() => ({ ...defaultDisplayStrings, ...userDisplayStrings }), [userDisplayStrings]);
-    const onSave = async () => {
-        try {
-            if (!validator.allValid()) {
-                showValidationMessage(true);
-                return;
-            }
-            setIsLoading(true);
+    const { mutate: saveMutation, isLoading } = useMutation({
+        mutationFn: async (newMapping) => {
             const accessToken = await getAccessToken();
-            mapping
-                ? await mappingClient.updateMapping(accessToken, iModelId, mapping.id, {
-                    mappingName: values.name,
-                    description: values.description,
-                    extractionEnabled: values.extractionEnabled,
-                })
-                : await mappingClient.createMapping(accessToken, iModelId, {
-                    mappingName: values.name,
-                    description: values.description,
-                    extractionEnabled: values.extractionEnabled,
-                });
-            setValues({
-                name: mapping?.mappingName ?? "",
-                description: mapping?.description ?? "",
-                extractionEnabled: mapping?.extractionEnabled ?? true,
-            });
+            return mapping
+                ? mappingClient.updateMapping(accessToken, iModelId, mapping.id, newMapping)
+                : mappingClient.createMapping(accessToken, iModelId, newMapping);
+        },
+        onSuccess: async () => {
+            await queryClient.invalidateQueries({ queryKey: ["mappings"] });
             onSaveSuccess();
+        },
+    });
+    const onSave = async () => {
+        if (!validator.allValid()) {
+            showValidationMessage(true);
+            return;
         }
-        catch (error) {
-            handleError(error.status);
-        }
-        finally {
-            setIsLoading(false);
-        }
+        saveMutation({
+            mappingName: values.name,
+            description: values.description,
+            extractionEnabled: values.extractionEnabled,
+        });
     };
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: 'gmw-details-form-container' },

package/lib/esm/components/Mappings/Editing/MappingAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"MappingAction.js","sourceRoot":"","sources":["../../../../../src/components/Mappings/Editing/MappingAction.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { Fieldset, LabeledInput, Text, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport React, { useState } from \"react\";\nimport ActionPanel from \"../../SharedComponents/ActionPanel\";\nimport useValidator, { NAME_REQUIREMENTS } from \"../../Properties/hooks/useValidator\";\nimport \"./MappingAction.scss\";\nimport { useMappingClient } from \"../../context/MappingClientContext\";\nimport type { Mapping } from \"@itwin/insights-client\";\nimport { useGroupingMappingApiConfig } from \"../../context/GroupingApiConfigContext\";\nimport { handleError, handleInputChange } from \"../../../common/utils\";\n\nconst defaultDisplayStrings = {\n  mappingDetails: \"Mapping Details\",\n};\n\nexport interface MappingActionProps {\n  mapping?: Mapping;\n  onSaveSuccess: () => void;\n  onClickCancel?: () => void;\n  displayStrings?: Partial<typeof defaultDisplayStrings>;\n}\n\nexport const MappingAction = ({ mapping, onSaveSuccess, onClickCancel, displayStrings: userDisplayStrings }: MappingActionProps) => {\n  const { getAccessToken, iModelId } = useGroupingMappingApiConfig();\n  const mappingClient = useMappingClient();\n  const [values, setValues] = useState({\n    name: mapping?.mappingName ?? \"\",\n    description: mapping?.description ?? \"\",\n    extractionEnabled: mapping?.extractionEnabled ?? true,\n  });\n  const [validator, showValidationMessage] = useValidator();\n  const [isLoading, setIsLoading] = useState<boolean>(false);\n\n  const displayStrings = React.useMemo(\n    () => ({ ...defaultDisplayStrings, ...userDisplayStrings }),\n    [userDisplayStrings]\n  );\n\n  const onSave = async () => {\n    try {\n      if (!validator.allValid()) {\n        showValidationMessage(true);\n        return;\n      }\n      setIsLoading(true);\n      const accessToken = await getAccessToken();\n      mapping\n        ? await mappingClient.updateMapping(accessToken, iModelId, mapping.id, {\n          mappingName: values.name,\n          description: values.description,\n          extractionEnabled: values.extractionEnabled,\n        })\n        : await mappingClient.createMapping(accessToken, iModelId, {\n          mappingName: values.name,\n          description: values.description,\n          extractionEnabled: values.extractionEnabled,\n        });\n      setValues({\n        name: mapping?.mappingName ?? \"\",\n        description: mapping?.description ?? \"\",\n        extractionEnabled: mapping?.extractionEnabled ?? true,\n      });\n      onSaveSuccess();\n    } catch (error: any) {\n      handleError(error.status);\n    } finally {\n      setIsLoading(false);\n    }\n  };\n\n  return (\n    <>\n      <div className='gmw-details-form-container'>\n        <Fieldset legend={displayStrings.mappingDetails} className='gmw-details-form'>\n          <Text variant='small' as='small' className='gmw-field-legend'>\n            Asterisk * indicates mandatory fields.\n          </Text>\n          <LabeledInput\n            id='name'\n            name='name'\n            label='Name'\n            value={values.name}\n            required\n            onChange={(event) => {\n              handleInputChange(event, values, setValues);\n              validator.showMessageFor(\"name\");\n            }}\n            message={validator.message(\"name\", values.name, NAME_REQUIREMENTS)}\n            status={\n              validator.message(\"name\", values.name, NAME_REQUIREMENTS)\n                ? \"negative\"\n                : undefined\n            }\n            onBlur={() => {\n              validator.showMessageFor(\"name\");\n            }}\n            onBlurCapture={(event) => {\n              handleInputChange(event, values, setValues);\n              validator.showMessageFor(\"name\");\n            }}\n          />\n          <LabeledInput\n            id='description'\n            name='description'\n            label='Description'\n            value={values.description}\n            onChange={(event) => {\n              handleInputChange(event, values, setValues);\n            }}\n          />\n          <ToggleSwitch\n            id='extractionEnabled'\n            name='extractionEnabled'\n            label='Extract data from iModel'\n            labelPosition=\"right\"\n            checked={values.extractionEnabled}\n            onChange={(event) => {\n              setValues({ ...values, extractionEnabled: event.currentTarget.checked });\n            }}\n          />\n        </Fieldset>\n      </div>\n      <ActionPanel\n        onSave={onSave}\n        onCancel={onClickCancel}\n        isSavingDisabled={!values.name}\n        isLoading={isLoading}\n      />\n    </>\n  );\n};\n"]}
+{"version":3,"file":"MappingAction.js","sourceRoot":"","sources":["../../../../../src/components/Mappings/Editing/MappingAction.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { Fieldset, LabeledInput, Text, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport React, { useState } from \"react\";\nimport ActionPanel from \"../../SharedComponents/ActionPanel\";\nimport useValidator, { NAME_REQUIREMENTS } from \"../../Properties/hooks/useValidator\";\nimport \"./MappingAction.scss\";\nimport { useMappingClient } from \"../../context/MappingClientContext\";\nimport type { Mapping, MappingCreate } from \"@itwin/insights-client\";\nimport { useGroupingMappingApiConfig } from \"../../context/GroupingApiConfigContext\";\nimport { handleInputChange } from \"../../../common/utils\";\nimport { useMutation, useQueryClient } from \"@tanstack/react-query\";\n\nconst defaultDisplayStrings = {\n  mappingDetails: \"Mapping Details\",\n};\n\nexport interface MappingActionProps {\n  mapping?: Mapping;\n  onSaveSuccess: () => void;\n  onClickCancel?: () => void;\n  displayStrings?: Partial<typeof defaultDisplayStrings>;\n}\n\nexport const MappingAction = ({ mapping, onSaveSuccess, onClickCancel, displayStrings: userDisplayStrings }: MappingActionProps) => {\n  const { getAccessToken, iModelId } = useGroupingMappingApiConfig();\n  const mappingClient = useMappingClient();\n  const [values, setValues] = useState({\n    name: mapping?.mappingName ?? \"\",\n    description: mapping?.description ?? \"\",\n    extractionEnabled: mapping?.extractionEnabled ?? true,\n  });\n  const [validator, showValidationMessage] = useValidator();\n  const queryClient = useQueryClient();\n\n  const displayStrings = React.useMemo(\n    () => ({ ...defaultDisplayStrings, ...userDisplayStrings }),\n    [userDisplayStrings]\n  );\n\n  const { mutate: saveMutation, isLoading } = useMutation(\n    {\n      mutationFn: async (newMapping: MappingCreate) => {\n        const accessToken = await getAccessToken();\n        return mapping\n          ? mappingClient.updateMapping(accessToken, iModelId, mapping.id, newMapping)\n          : mappingClient.createMapping(accessToken, iModelId, newMapping);\n      },\n      onSuccess: async () => {\n        await queryClient.invalidateQueries({ queryKey: [\"mappings\"] });\n        onSaveSuccess();\n      },\n    }\n  );\n\n  const onSave = async () => {\n    if (!validator.allValid()) {\n      showValidationMessage(true);\n      return;\n    }\n    saveMutation({\n      mappingName: values.name,\n      description: values.description,\n      extractionEnabled: values.extractionEnabled,\n    });\n  };\n\n  return (\n    <>\n      <div className='gmw-details-form-container'>\n        <Fieldset legend={displayStrings.mappingDetails} className='gmw-details-form'>\n          <Text variant='small' as='small' className='gmw-field-legend'>\n            Asterisk * indicates mandatory fields.\n          </Text>\n          <LabeledInput\n            id='name'\n            name='name'\n            label='Name'\n            value={values.name}\n            required\n            onChange={(event) => {\n              handleInputChange(event, values, setValues);\n              validator.showMessageFor(\"name\");\n            }}\n            message={validator.message(\"name\", values.name, NAME_REQUIREMENTS)}\n            status={\n              validator.message(\"name\", values.name, NAME_REQUIREMENTS)\n                ? \"negative\"\n                : undefined\n            }\n            onBlur={() => {\n              validator.showMessageFor(\"name\");\n            }}\n            onBlurCapture={(event) => {\n              handleInputChange(event, values, setValues);\n              validator.showMessageFor(\"name\");\n            }}\n          />\n          <LabeledInput\n            id='description'\n            name='description'\n            label='Description'\n            value={values.description}\n            onChange={(event) => {\n              handleInputChange(event, values, setValues);\n            }}\n          />\n          <ToggleSwitch\n            id='extractionEnabled'\n            name='extractionEnabled'\n            label='Extract data from iModel'\n            labelPosition=\"right\"\n            checked={values.extractionEnabled}\n            onChange={(event) => {\n              setValues({ ...values, extractionEnabled: event.currentTarget.checked });\n            }}\n          />\n        </Fieldset>\n      </div>\n      <ActionPanel\n        onSave={onSave}\n        onCancel={onClickCancel}\n        isSavingDisabled={!values.name}\n        isLoading={isLoading}\n      />\n    </>\n  );\n};\n"]}

package/lib/esm/components/Mappings/Extraction/ExtractionMessageModal.d.ts

@@ -1,6 +1,11 @@
 /// <reference types="react" />
-import type { ExtractionMessageData } from "../../context/ExtractionStatusDataContext";
 import "./ExtractionMessageModal.scss";
+export interface ExtractionMessageData {
+    date: string;
+    category: string;
+    level: string;
+    message: string;
+}
 export interface ExtractionMessageModalProps {
     isOpen: boolean;
     onClose: () => void;

package/lib/esm/components/Mappings/Extraction/ExtractionMessageModal.js

@@ -11,51 +11,57 @@ import { ExtractionLogCustomFilter } from "./ExtractionLogCustomFilter";
 import { useGroupingMappingApiConfig } from "../../context/GroupingApiConfigContext";
 import { useMappingClient } from "../../context/MappingClientContext";
 import { useMappingsOperations } from "../hooks/useMappingsOperations";
+import { useQueries } from "@tanstack/react-query";
+import { useMemoizedCollectionPick } from "../../../common/hooks/useMemoizedCollectionPick";
+import { fetchGroups } from "../../Groups/hooks/useFetchGroups";
 export const ExtractionMessageModal = ({ isOpen, onClose, extractionMessageData, timestamp }) => {
-    const [formattedExtractionMessage, setFormattedExtractionMessage] = useState([]);
+    const [formattedExtractionMessage, setFormattedExtractionMessage] = useState(undefined);
     const groupingMappingApiConfig = useGroupingMappingApiConfig();
     const mappingClient = useMappingClient();
-    const { mappings } = useMappingsOperations({ ...groupingMappingApiConfig, mappingClient });
+    const { mappings, isLoading: isMappingsLoading } = useMappingsOperations({ ...groupingMappingApiConfig, mappingClient });
     const [formattedTimestamp, setFormattedTimestamp] = useState("");
-    const getMappingName = useCallback(async (mappingId) => {
-        return mappings.find((mapping) => { return mapping.id === mappingId; })?.mappingName ?? "";
-    }, [mappings]);
-    const getGroupNames = useCallback(async (mappingId, groupId, groupsCache) => {
-        const accessToken = await groupingMappingApiConfig.getAccessToken();
-        if (!groupsCache.has(mappingId)) {
-            const groups = await mappingClient.getGroups(accessToken, groupingMappingApiConfig.iModelId, mappingId);
-            groupsCache.set(mappingId, groups);
-        }
-        return groupsCache.get(mappingId)?.find((group) => { return group.id === groupId; })?.groupName ?? "";
-    }, [groupingMappingApiConfig, mappingClient]);
+    const getMappingName = useCallback((mappingId, mappings) => {
+        return mappings.find((mapping) => mapping.id === mappingId)?.mappingName ?? "";
+    }, []);
+    // Extract groupIds and mappingIds from messages
+    const extractionInfo = useMemo(() => {
+        return extractionMessageData.reduce((acc, message) => {
+            const splittedMessage = message.message.split(" ");
+            const mappingId = splittedMessage[splittedMessage.indexOf("MappingId:") + 1]?.match(/^([^,]+),$/)?.[1];
+            const groupId = splittedMessage[splittedMessage.indexOf("GroupId:") + 1]?.match(/^([^,]+).$/)?.[1];
+            if (mappingId && groupId) {
+                acc.push({ mappingId, groupId });
+            }
+            return acc;
+        }, []);
+    }, [extractionMessageData]);
+    // useQueries to fetch all group names
+    const groupQueriesResults = useQueries({
+        queries: extractionInfo.map(({ mappingId }) => ({
+            queryKey: ["groups", mappingId],
+            queryFn: async () => fetchGroups(groupingMappingApiConfig.iModelId, mappingId, groupingMappingApiConfig.getAccessToken, mappingClient),
+        })),
+    });
+    // Workaround to get data from useQueries with more stability
+    const pickedResult = useMemoizedCollectionPick(groupQueriesResults, ["data", "error", "isLoading", "isSuccess"]);
     useEffect(() => {
-        const formatMessages = async () => {
-            const groupsCache = new Map();
-            const extractionMessageDataPromises = extractionMessageData.map(async (extractionMessage) => {
-                {
-                    let replacedMessage = extractionMessage.message;
-                    const splittedMessage = replacedMessage.split(" ");
-                    const mappingId = splittedMessage[splittedMessage.indexOf("MappingId:") + 1].match(/^([^,]+),$/) ?? [];
-                    if (extractionMessage.message.includes("iModel")) {
-                        replacedMessage = replacedMessage.replace(/iModel [\w-]+/, "iModel");
-                    }
-                    if (replacedMessage.includes("MappingId:")) {
-                        const mappingName = await getMappingName(mappingId[1]);
-                        replacedMessage = replacedMessage.replace(/MappingId: [\w-]+/, `Mapping: ${mappingName}`);
-                    }
-                    if (replacedMessage.includes("GroupId:")) {
-                        const groupId = splittedMessage[splittedMessage.indexOf("GroupId:") + 1].match(/^([^,]+).$/) ?? [];
-                        const groupName = await getGroupNames(mappingId[1], groupId[1], groupsCache);
-                        replacedMessage = replacedMessage.replace(/GroupId: [\w-]+/, `Group: ${groupName}`);
-                    }
-                    return { ...extractionMessage, message: replacedMessage };
+        if (pickedResult.every((query) => query.isSuccess) && mappings) {
+            const formattedMessages = extractionMessageData.map((extractionMessage, index) => {
+                let replacedMessage = extractionMessage.message;
+                const { mappingId, groupId } = extractionInfo[index];
+                const groupName = pickedResult[index].data.find((group) => group.id === groupId)?.groupName;
+                if (replacedMessage.includes("MappingId:")) {
+                    const mappingName = getMappingName(mappingId, mappings);
+                    replacedMessage = replacedMessage.replace(/MappingId: [\w-]+/, `Mapping: ${mappingName}`);
+                }
+                if (replacedMessage.includes("GroupId:")) {
+                    replacedMessage = replacedMessage.replace(/GroupId: [\w-]+/, `Group: ${groupName ? groupName : "<Not Found>"}`);
                 }
+                return { ...extractionMessage, message: replacedMessage };
             });
-            const newMessages = await Promise.all(extractionMessageDataPromises);
-            setFormattedExtractionMessage(newMessages);
-        };
-        void formatMessages();
-    }, [extractionMessageData, groupingMappingApiConfig, mappings, mappingClient, getGroupNames, getMappingName]);
+            setFormattedExtractionMessage(formattedMessages);
+        }
+    }, [extractionMessageData, mappings, extractionInfo, getMappingName, pickedResult]);
     useEffect(() => {
         const newDateTime = new Date(timestamp);
         const options = {
@@ -97,13 +103,14 @@ export const ExtractionMessageModal = ({ isOpen, onClose, extractionMessageData,
             Filter: tableFilters.TextFilter(translatedLabels),
         },
     ], [translatedLabels]);
+    const isLoading = pickedResult.some((query) => query.isLoading) || isMappingsLoading;
     return (React.createElement(Modal, { className: "gmw-message-modal-container", title: "Extraction Logs", isOpen: isOpen, onClose: onClose, closeOnExternalClick: false },
         React.createElement(ModalContent, null,
             React.createElement("div", { className: "gmw-timestamp-icon" },
                 React.createElement(Icon, { title: "Extraction Timestamp", size: "medium" },
                     React.createElement(SvgClock, null)),
                 React.createElement(Text, null, formattedTimestamp)),
-            React.createElement(Table, { columns: columns, data: formattedExtractionMessage, emptyTableContent: "", emptyFilteredTableContent: "No results match filters.", className: "gmw-extraction-message-table-container" })),
+            React.createElement(Table, { columns: columns, data: formattedExtractionMessage ?? [], emptyTableContent: "", emptyFilteredTableContent: "No results match filters.", className: "gmw-extraction-message-table-container", isLoading: isLoading })),
         React.createElement(ModalButtonBar, null,
             React.createElement(Button, { onClick: onClose, styleType: "high-visibility" }, "Close"))));
 };

package/lib/esm/components/Mappings/Extraction/ExtractionMessageModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExtractionMessageModal.js","sourceRoot":"","sources":["../../../../../src/components/Mappings/Extraction/ExtractionMessageModal.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { Button, DefaultCell, Icon, Modal, ModalButtonBar, ModalContent, Table, tableFilters, Text } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport type { CreateTypeFromInterface } from \"../../../common/utils\";\nimport type { ExtractionMessageData } from \"../../context/ExtractionStatusDataContext\";\nimport \"./ExtractionMessageModal.scss\";\nimport { SvgClock } from \"@itwin/itwinui-icons-react\";\nimport type { CellRendererProps, Column } from \"react-table\";\nimport { StatusIcon } from \"../../SharedComponents/StatusIcon\";\nimport { ExtractionLogCustomFilter } from \"./ExtractionLogCustomFilter\";\nimport { useGroupingMappingApiConfig } from \"../../context/GroupingApiConfigContext\";\nimport { useMappingClient } from \"../../context/MappingClientContext\";\nimport { useMappingsOperations } from \"../hooks/useMappingsOperations\";\nimport type { Group } from \"@itwin/insights-client\";\n\nexport interface ExtractionMessageModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  extractionMessageData: ExtractionMessageData[];\n  timestamp: string;\n}\n\nexport const ExtractionMessageModal = ({ isOpen, onClose, extractionMessageData, timestamp }: ExtractionMessageModalProps) => {\n  const [formattedExtractionMessage, setFormattedExtractionMessage] = useState<ExtractionMessageData[]>([]);\n  const groupingMappingApiConfig = useGroupingMappingApiConfig();\n  const mappingClient = useMappingClient();\n  const { mappings } = useMappingsOperations({...groupingMappingApiConfig, mappingClient});\n  const [formattedTimestamp, setFormattedTimestamp] = useState<string>(\"\");\n\n  const getMappingName = useCallback(async (mappingId: string) => {\n    return mappings.find((mapping) => {return mapping.id === mappingId;})?.mappingName ?? \"\";\n  }, [mappings]);\n\n  const getGroupNames = useCallback(async (mappingId: string, groupId: string, groupsCache: Map<string, Group[]>) => {\n    const accessToken = await groupingMappingApiConfig.getAccessToken();\n    if(!groupsCache.has(mappingId)){\n      const groups = await mappingClient.getGroups(\n        accessToken,\n        groupingMappingApiConfig.iModelId,\n        mappingId\n      );\n      groupsCache.set(mappingId, groups);\n    }\n    return groupsCache.get(mappingId)?.find((group) => {return group.id === groupId;})?.groupName ?? \"\";\n  }, [groupingMappingApiConfig, mappingClient]);\n\n  useEffect(() => {\n    const formatMessages = async () => {\n      const groupsCache = new Map<string,Group[]>();\n      const extractionMessageDataPromises = extractionMessageData.map(async (extractionMessage) => {\n        {\n          let replacedMessage = extractionMessage.message;\n          const splittedMessage = replacedMessage.split(\" \");\n          const mappingId = splittedMessage[splittedMessage.indexOf(\"MappingId:\") + 1].match(/^([^,]+),$/) ?? [];\n          if(extractionMessage.message.includes(\"iModel\")){\n            replacedMessage = replacedMessage.replace(/iModel [\\w-]+/, \"iModel\");\n          }\n          if(replacedMessage.includes(\"MappingId:\")){\n            const mappingName = await getMappingName(mappingId[1]);\n            replacedMessage = replacedMessage.replace(/MappingId: [\\w-]+/, `Mapping: ${mappingName}`);\n          }\n          if(replacedMessage.includes(\"GroupId:\")){\n            const groupId = splittedMessage[splittedMessage.indexOf(\"GroupId:\") + 1].match(/^([^,]+).$/) ?? [];\n            const groupName = await getGroupNames(mappingId[1], groupId[1], groupsCache);\n            replacedMessage = replacedMessage.replace(/GroupId: [\\w-]+/, `Group: ${groupName}`);\n          }\n          return {...extractionMessage, message: replacedMessage};\n        }\n      });\n\n      const newMessages = await Promise.all(extractionMessageDataPromises);\n      setFormattedExtractionMessage(newMessages);\n    };\n    void formatMessages();\n  }, [extractionMessageData, groupingMappingApiConfig, mappings, mappingClient, getGroupNames, getMappingName]);\n\n  useEffect(() => {\n    const newDateTime: Date = new Date(timestamp);\n    const options: Intl.DateTimeFormatOptions = {\n      day: \"numeric\", month: \"numeric\", year: \"numeric\",\n      hour: \"2-digit\", minute: \"2-digit\",\n    };\n    setFormattedTimestamp(newDateTime.toLocaleString(undefined, options));\n  }, [timestamp]);\n\n  const translatedLabels = useMemo(() => ({\n    filter: \"Filter\",\n    clear: \"Clear\",\n  }), []);\n\n  const columns = useMemo(\n    (): Column<CreateTypeFromInterface<ExtractionMessageData>>[] => [\n      {\n        id: \"category\",\n        Header: \"Category\",\n        accessor: \"category\",\n        fieldType: \"text\",\n        Filter: ExtractionLogCustomFilter,\n        filter: \"equals\",\n      },\n      {\n        id: \"level\",\n        Header: \"Level\",\n        accessor: \"level\",\n        cellRenderer: ({ cellElementProps, cellProps }: CellRendererProps<CreateTypeFromInterface<ExtractionMessageData>>) => {\n          const level = cellProps.row.original.level;\n          return (\n            <DefaultCell\n              cellElementProps={cellElementProps}\n              cellProps={cellProps}\n              startIcon={\n                level === \"Error\" ? (\n                  <StatusIcon status='error' />\n                ) : level === \"Warning\" ? (\n                  <StatusIcon status='warning' />\n                ) : level === \"Info\" ? (\n                  <StatusIcon status='informational' />\n                ) : <StatusIcon status='trace' />\n              }\n            >\n              {level}\n            </DefaultCell>\n          );\n        },\n        Filter: ExtractionLogCustomFilter,\n        filter: \"equals\",\n      },\n      {\n        id: \"message\",\n        Header: \"Message\",\n        accessor: \"message\",\n        width: \"25vw\",\n        fieldType: \"text\",\n        Filter: tableFilters.TextFilter(translatedLabels),\n      },\n    ],\n    [translatedLabels]\n  );\n  return (\n    <Modal className=\"gmw-message-modal-container\"\n      title=\"Extraction Logs\"\n      isOpen={isOpen}\n      onClose={onClose}\n      closeOnExternalClick={false}\n    >\n      <ModalContent>\n        <div className=\"gmw-timestamp-icon\">\n          <Icon\n            title=\"Extraction Timestamp\"\n            size=\"medium\"\n          >\n            <SvgClock />\n          </Icon>\n          <Text>{formattedTimestamp}</Text>\n        </div>\n        <Table<CreateTypeFromInterface<ExtractionMessageData>>\n          columns={columns}\n          data={formattedExtractionMessage}\n          emptyTableContent={\"\"}\n          emptyFilteredTableContent=\"No results match filters.\"\n          className=\"gmw-extraction-message-table-container\"\n        />\n      </ModalContent>\n      <ModalButtonBar>\n        <Button\n          onClick={onClose}\n          styleType=\"high-visibility\"\n        >\n            Close\n        </Button>\n      </ModalButtonBar>\n    </Modal>\n  );\n};\n"]}
+{"version":3,"file":"ExtractionMessageModal.js","sourceRoot":"","sources":["../../../../../src/components/Mappings/Extraction/ExtractionMessageModal.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { Button, DefaultCell, Icon, Modal, ModalButtonBar, ModalContent, Table, tableFilters, Text } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport type { CreateTypeFromInterface } from \"../../../common/utils\";\nimport \"./ExtractionMessageModal.scss\";\nimport { SvgClock } from \"@itwin/itwinui-icons-react\";\nimport type { CellRendererProps, Column } from \"react-table\";\nimport { StatusIcon } from \"../../SharedComponents/StatusIcon\";\nimport { ExtractionLogCustomFilter } from \"./ExtractionLogCustomFilter\";\nimport { useGroupingMappingApiConfig } from \"../../context/GroupingApiConfigContext\";\nimport { useMappingClient } from \"../../context/MappingClientContext\";\nimport { useMappingsOperations } from \"../hooks/useMappingsOperations\";\nimport type { Mapping } from \"@itwin/insights-client\";\nimport { useQueries } from \"@tanstack/react-query\";\nimport { useMemoizedCollectionPick } from \"../../../common/hooks/useMemoizedCollectionPick\";\nimport { fetchGroups } from \"../../Groups/hooks/useFetchGroups\";\n\nexport interface ExtractionMessageData {\n  date: string;\n  category: string;\n  level: string;\n  message: string;\n}\n\nexport interface ExtractionMessageModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  extractionMessageData: ExtractionMessageData[];\n  timestamp: string;\n}\n\nexport const ExtractionMessageModal = ({ isOpen, onClose, extractionMessageData, timestamp }: ExtractionMessageModalProps) => {\n  const [formattedExtractionMessage, setFormattedExtractionMessage] = useState<ExtractionMessageData[] | undefined>(undefined);\n  const groupingMappingApiConfig = useGroupingMappingApiConfig();\n  const mappingClient = useMappingClient();\n  const { mappings, isLoading: isMappingsLoading } = useMappingsOperations({ ...groupingMappingApiConfig, mappingClient });\n  const [formattedTimestamp, setFormattedTimestamp] = useState<string>(\"\");\n\n  const getMappingName = useCallback((mappingId: string, mappings: Mapping[]) => {\n    return mappings.find((mapping) => mapping.id === mappingId)?.mappingName ?? \"\";\n  }, []);\n\n  // Extract groupIds and mappingIds from messages\n  const extractionInfo = useMemo(() => {\n    return extractionMessageData.reduce<{\n      mappingId: string;\n      groupId: string;\n    }[]>((acc, message) => {\n      const splittedMessage = message.message.split(\" \");\n      const mappingId = splittedMessage[splittedMessage.indexOf(\"MappingId:\") + 1]?.match(/^([^,]+),$/)?.[1];\n      const groupId = splittedMessage[splittedMessage.indexOf(\"GroupId:\") + 1]?.match(/^([^,]+).$/)?.[1];\n\n      if (mappingId && groupId) {\n        acc.push({ mappingId, groupId });\n      }\n      return acc;\n    }, []);\n  }, [extractionMessageData]);\n\n  // useQueries to fetch all group names\n  const groupQueriesResults = useQueries({\n    queries: extractionInfo.map(({ mappingId }) => ({\n      queryKey: [\"groups\", mappingId],\n      queryFn: async () => fetchGroups(groupingMappingApiConfig.iModelId, mappingId, groupingMappingApiConfig.getAccessToken, mappingClient),\n    })),\n  });\n\n  // Workaround to get data from useQueries with more stability\n  const pickedResult = useMemoizedCollectionPick(groupQueriesResults, [\"data\", \"error\", \"isLoading\", \"isSuccess\"]);\n\n  useEffect(() => {\n    if (pickedResult.every((query) => query.isSuccess) && mappings) {\n      const formattedMessages = extractionMessageData.map((extractionMessage, index) => {\n        let replacedMessage: string = extractionMessage.message;\n\n        const { mappingId, groupId } = extractionInfo[index];\n        const groupName = pickedResult[index].data!.find((group) => group.id === groupId)?.groupName;\n\n        if (replacedMessage.includes(\"MappingId:\")) {\n          const mappingName = getMappingName(mappingId, mappings);\n          replacedMessage = replacedMessage.replace(/MappingId: [\\w-]+/, `Mapping: ${mappingName}`);\n        }\n\n        if (replacedMessage.includes(\"GroupId:\")) {\n          replacedMessage = replacedMessage.replace(/GroupId: [\\w-]+/, `Group: ${groupName ? groupName : \"<Not Found>\"}`);\n        }\n\n        return { ...extractionMessage, message: replacedMessage };\n      });\n\n      setFormattedExtractionMessage(formattedMessages);\n    }\n  }, [extractionMessageData, mappings, extractionInfo, getMappingName, pickedResult]);\n\n  useEffect(() => {\n    const newDateTime: Date = new Date(timestamp);\n    const options: Intl.DateTimeFormatOptions = {\n      day: \"numeric\", month: \"numeric\", year: \"numeric\",\n      hour: \"2-digit\", minute: \"2-digit\",\n    };\n    setFormattedTimestamp(newDateTime.toLocaleString(undefined, options));\n  }, [timestamp]);\n\n  const translatedLabels = useMemo(() => ({\n    filter: \"Filter\",\n    clear: \"Clear\",\n  }), []);\n\n  const columns = useMemo(\n    (): Column<CreateTypeFromInterface<ExtractionMessageData>>[] => [\n      {\n        id: \"category\",\n        Header: \"Category\",\n        accessor: \"category\",\n        fieldType: \"text\",\n        Filter: ExtractionLogCustomFilter,\n        filter: \"equals\",\n      },\n      {\n        id: \"level\",\n        Header: \"Level\",\n        accessor: \"level\",\n        cellRenderer: ({ cellElementProps, cellProps }: CellRendererProps<CreateTypeFromInterface<ExtractionMessageData>>) => {\n          const level = cellProps.row.original.level;\n          return (\n            <DefaultCell\n              cellElementProps={cellElementProps}\n              cellProps={cellProps}\n              startIcon={\n                level === \"Error\" ? (\n                  <StatusIcon status='error' />\n                ) : level === \"Warning\" ? (\n                  <StatusIcon status='warning' />\n                ) : level === \"Info\" ? (\n                  <StatusIcon status='informational' />\n                ) : <StatusIcon status='trace' />\n              }\n            >\n              {level}\n            </DefaultCell>\n          );\n        },\n        Filter: ExtractionLogCustomFilter,\n        filter: \"equals\",\n      },\n      {\n        id: \"message\",\n        Header: \"Message\",\n        accessor: \"message\",\n        width: \"25vw\",\n        fieldType: \"text\",\n        Filter: tableFilters.TextFilter(translatedLabels),\n      },\n    ],\n    [translatedLabels]\n  );\n  const isLoading = pickedResult.some((query) => query.isLoading) || isMappingsLoading;\n\n  return (\n    <Modal className=\"gmw-message-modal-container\"\n      title=\"Extraction Logs\"\n      isOpen={isOpen}\n      onClose={onClose}\n      closeOnExternalClick={false}\n    >\n      <ModalContent>\n        <div className=\"gmw-timestamp-icon\">\n          <Icon\n            title=\"Extraction Timestamp\"\n            size=\"medium\"\n          >\n            <SvgClock />\n          </Icon>\n          <Text>{formattedTimestamp}</Text>\n        </div>\n        <Table<CreateTypeFromInterface<ExtractionMessageData>>\n          columns={columns}\n          data={formattedExtractionMessage ?? []}\n          emptyTableContent={\"\"}\n          emptyFilteredTableContent=\"No results match filters.\"\n          className=\"gmw-extraction-message-table-container\"\n          isLoading={isLoading}\n        />\n      </ModalContent>\n      <ModalButtonBar>\n        <Button\n          onClick={onClose}\n          styleType=\"high-visibility\"\n        >\n          Close\n        </Button>\n      </ModalButtonBar>\n    </Modal>\n  );\n};\n"]}

package/lib/esm/components/Mappings/Extraction/ExtractionStatusIcon.d.ts

@@ -1,8 +1,14 @@
 /// <reference types="react" />
+declare type IconStatus = "negative" | "positive" | "warning" | undefined;
+export interface ExtractionStatusData {
+    iconStatus: IconStatus;
+    iconMessage: string;
+}
 export interface ExtractionStatusIconProps {
-    iconStatus: "negative" | "positive" | "warning" | undefined;
+    iconStatus: IconStatus;
     onClick: () => void;
     iconMessage: string;
 }
 export declare const ExtractionStatusIcon: ({ iconStatus, onClick, iconMessage }: ExtractionStatusIconProps) => JSX.Element;
+export {};
 //# sourceMappingURL=ExtractionStatusIcon.d.ts.map

package/lib/esm/components/Mappings/Extraction/ExtractionStatusIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExtractionStatusIcon.js","sourceRoot":"","sources":["../../../../../src/components/Mappings/Extraction/ExtractionStatusIcon.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAQxD,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,WAAW,EAA6B,EAAE,EAAE;IACtG,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,WAAW;QAC3B,oBAAC,UAAU,IAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,OAAO;YACjD,oBAAC,kBAAkB,IAAC,MAAM,EAAE,UAAU;gBACpC,oBAAC,UAAU,OAAG,CACK,CACV,CACL,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { IconButton, NotificationMarker, Tooltip } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport { SvgProcess } from \"@itwin/itwinui-icons-react\";\n\nexport interface ExtractionStatusIconProps {\n  iconStatus: \"negative\" | \"positive\" | \"warning\" | undefined;\n  onClick: () => void;\n  iconMessage: string;\n}\n\nexport const ExtractionStatusIcon = ({ iconStatus, onClick, iconMessage }: ExtractionStatusIconProps) => {\n  return (\n    <Tooltip content={iconMessage}>\n      <IconButton styleType='borderless' onClick={onClick}>\n        <NotificationMarker status={iconStatus}>\n          <SvgProcess />\n        </NotificationMarker>\n      </IconButton>\n    </Tooltip>\n  );\n};\n"]}
+{"version":3,"file":"ExtractionStatusIcon.js","sourceRoot":"","sources":["../../../../../src/components/Mappings/Extraction/ExtractionStatusIcon.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAcxD,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,WAAW,EAA6B,EAAE,EAAE;IACtG,OAAO,CACL,oBAAC,OAAO,IAAC,OAAO,EAAE,WAAW;QAC3B,oBAAC,UAAU,IAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,OAAO;YACjD,oBAAC,kBAAkB,IAAC,MAAM,EAAE,UAAU;gBACpC,oBAAC,UAAU,OAAG,CACK,CACV,CACL,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { IconButton, NotificationMarker, Tooltip } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport { SvgProcess } from \"@itwin/itwinui-icons-react\";\n\ntype IconStatus = \"negative\" | \"positive\" | \"warning\" | undefined;\nexport interface ExtractionStatusData {\n  iconStatus: IconStatus;\n  iconMessage: string;\n}\n\nexport interface ExtractionStatusIconProps {\n  iconStatus: IconStatus;\n  onClick: () => void;\n  iconMessage: string;\n}\n\nexport const ExtractionStatusIcon = ({ iconStatus, onClick, iconMessage }: ExtractionStatusIconProps) => {\n  return (\n    <Tooltip content={iconMessage}>\n      <IconButton styleType='borderless' onClick={onClick}>\n        <NotificationMarker status={iconStatus}>\n          <SvgProcess />\n        </NotificationMarker>\n      </IconButton>\n    </Tooltip>\n  );\n};\n"]}

package/lib/esm/components/Mappings/{ConfirmMappingsImport.d.ts → Import/ConfirmMappingsImport.d.ts}

@@ -1,5 +1,5 @@
 import React from "react";
-import type { IMappingTyped } from "./Mappings";
+import type { IMappingTyped } from "../Mappings";
 import "./ConfirmMappingsImport.scss";
 declare const defaultDisplayStrings: {
     mappings: string;

package/lib/esm/components/Mappings/{ConfirmMappingsImport.js → Import/ConfirmMappingsImport.js}

@@ -6,10 +6,10 @@ import { Button, LabeledInput, MiddleTextTruncation, ProgressLinear, Text, } fro
 import React, { useEffect, useState } from "react";
 import "./ConfirmMappingsImport.scss";
 import { SvgStatusSuccessHollow } from "@itwin/itwinui-icons-react";
-import useValidator, { NAME_REQUIREMENTS } from "../Properties/hooks/useValidator";
-import { handleError } from "../../common/utils";
-import { useMappingClient } from "../context/MappingClientContext";
-import { useGroupingMappingApiConfig } from "../context/GroupingApiConfigContext";
+import useValidator, { NAME_REQUIREMENTS } from "../../Properties/hooks/useValidator";
+import { useMappingClient } from "../../context/MappingClientContext";
+import { useGroupingMappingApiConfig } from "../../context/GroupingApiConfigContext";
+import { useMutation } from "@tanstack/react-query";
 const defaultDisplayStrings = {
     mappings: "Mappings",
 };
@@ -35,26 +35,33 @@ const ConfirmMappingImport = ({ sourceiModelId, selectedMappings, importing, set
         };
         setSelectedMappings(newState);
     };
+    const importMutation = useMutation({
+        mutationFn: async (selectedMapping) => {
+            const accessToken = await getAccessToken();
+            await mappingClient.copyMapping(accessToken, sourceiModelId, selectedMapping.id, {
+                targetIModelId: iModelId,
+                mappingName: selectedMapping.mappingName,
+            });
+        },
+        onMutate: async (selectedMapping) => {
+            setCurrentlyImporting(selectedMapping.mappingName);
+        },
+        onSuccess: () => {
+            setImportCount((count) => count + 1);
+        },
+        onError: () => {
+            setErrored(true);
+        },
+    });
     const onImport = async () => {
         if (!validator.allValid()) {
             showValidationMessage(true);
             return;
         }
         setImporting(true);
-        try {
-            for (const selectedMapping of selectedMappings) {
-                setCurrentlyImporting(selectedMapping.mappingName ?? "");
-                const accessToken = await getAccessToken();
-                await mappingClient.copyMapping(accessToken, sourceiModelId, selectedMapping.id ?? "", {
-                    targetIModelId: iModelId ?? "",
-                    mappingName: selectedMapping.mappingName ?? "",
-                });
-                setImportCount((importCount) => importCount + 1);
-            }
-        }
-        catch (error) {
-            handleError(error);
-            setErrored(true);
+        setImportCount(0);
+        for (const mapping of selectedMappings) {
+            await importMutation.mutateAsync(mapping);
         }
     };
     return (React.createElement(React.Fragment, null, importing ? (React.createElement("div", { className: 'gmw-import-progress-container' },
@@ -77,13 +84,13 @@ const ConfirmMappingImport = ({ sourceiModelId, selectedMappings, importing, set
                     ], status: !errored ?
                     importCount === selectedMappings.length ? "positive" : undefined : "negative" })),
         React.createElement("div", { className: 'gmw-import-action-panel' },
-            React.createElement(Button, { disabled: !errored && importCount !== selectedMappings.length, onClick: () => {
+            React.createElement(Button, { disabled: !errored && importCount === selectedMappings.length, onClick: () => {
                     setImporting(false);
                     setImportCount(0);
                     setCurrentlyImporting("");
                     setErrored(false);
                 } }, "Back"),
-            React.createElement(Button, { styleType: 'high-visibility', disabled: !errored && importCount !== selectedMappings.length, onClick: () => onFinish() }, "Close")))) : (React.createElement("div", { className: 'gmw-rename-confirm-container ' },
+            React.createElement(Button, { styleType: 'high-visibility', disabled: !errored && importCount !== selectedMappings.length, onClick: onFinish }, "Close")))) : (React.createElement("div", { className: 'gmw-rename-confirm-container ' },
         React.createElement("div", { className: 'gmw-mapping-rename-container' },
             React.createElement("div", { className: 'gmw-mapping-row-header-container' },
                 React.createElement("div", { className: 'gmw-mapping-row' },