Merge branch 'chore/update-issue-template' of https://github.com/equi…

…nor/fusion-workspace into chore/update-issue-template

.github/ISSUE_TEMPLATE/bug_report.md

@@ -7,11 +7,13 @@ assignees: ''
 ---
 
 ## Description
+
 <!-- Short description -->
 
 ## Reproduce
+
 <!-- Steps to reproduce - Add relevant screenshots -->
 
 ## Expected behavior
+
 <!-- Avoid ambiguity -->
-

.github/ISSUE_TEMPLATE/bump-deps.md

@@ -1,14 +1,13 @@
 ---
 name: 🧹⬆ Bump dependencies
 about: Create a report to help us improve
-title: "🧹⬆ Bump dependencies"
+title: '🧹⬆ Bump dependencies'
 labels: chore
 assignees: ''
 ---
 
 ## Description
+
 Bump all dependencies
 
 The devDependencies is less important
-
-

.github/ISSUE_TEMPLATE/enh_report.md

@@ -7,11 +7,14 @@ assignees: ''
 ---
 
 ## Expected outcome
+
 <!-- Short description -->
 
 ## Business Value / Developer Experience
+
 <!-- Should give motivation for prioritization.
  Outcome measurement of delivered value. -->
 
 ## Acceptance Criteria
+
 <!-- How to test -->

.github/ISSUE_TEMPLATE/feat_report.md

@@ -7,11 +7,14 @@ assignees: ''
 ---
 
 ## Expected outcome
+
 <!-- Short description -->
 
 ## Business Value / Developer Experience
+
 <!-- Should give motivation for prioritization.
  Outcome measurement of delivered value. -->
 
 ## Acceptance Criteria
+
 <!--> How to test -->

packages/power-bi/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/workspace-powerbi",
-  "version": "1.0.14",
+  "version": "2.0.0",
   "type": "module",
   "sideEffects": false,
   "license": "MIT",

packages/power-bi/src/lib/components/PowerBi.tsx

@@ -3,20 +3,25 @@ import { Loading } from './loading';
 import { chevron_down, chevron_up } from '@equinor/eds-icons';
 import { Icon } from '@equinor/eds-core-react';
 import { QueryClient, QueryClientProvider, QueryErrorResetBoundary } from '@tanstack/react-query';
-import { ErrorBoundary } from 'react-error-boundary';
+import { ErrorBoundary, FallbackProps } from 'react-error-boundary';
 import { FusionEmbedConfig, FusionPowerBiToken } from '../types';
-import { ErrorComponent } from './error/ErrorComponent';
+
 import { PowerBiController } from '../classes';
 import { IBasicFilter } from 'index';
 import { Report } from './report/Report';
+import React from 'react';
 
 Icon.add({ chevron_down, chevron_up });
 
+export type ErrorComponentProps = {
+  reportUri: string;
+} & FallbackProps;
+
 export interface PowerBiProps {
   reportUri: string;
   getToken: (reportUri: string, signal?: AbortSignal) => Promise<FusionPowerBiToken>;
   getEmbedInfo: (reportUri: string, token: string, signal?: AbortSignal) => Promise<FusionEmbedConfig>;
-  getErrorMessage: (reportUri: string) => Promise<string>;
+  ErrorComponent: React.ComponentType<ErrorComponentProps>;
   filters?: IBasicFilter;
   bookmark?: string;
   controller: PowerBiController;
@@ -25,16 +30,15 @@ export interface PowerBiProps {
 const client = new QueryClient();
 
 export const PowerBi = (props: PowerBiProps) => {
+  const { reportUri, ErrorComponent } = props;
   return (
     <QueryClientProvider client={client}>
       <Suspense fallback={<Loading />}>
         <QueryErrorResetBoundary>
           {({ reset }) => (
             <ErrorBoundary
               onReset={reset}
-              fallbackRender={(e) => (
-                <ErrorComponent {...e} getErrorMessage={props.getErrorMessage} reportUri={props.reportUri} />
-              )}
+              FallbackComponent={(errorProps) => <ErrorComponent {...errorProps} reportUri={reportUri} />}
             >
               <Report {...props} />
             </ErrorBoundary>

packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx

@@ -103,10 +103,14 @@ const StyledFilterButtons = styled.div`
 const StyledQuickFilterWrapper = styled.div`
   display: grid;
   width: 100%;
-  justify-content: flex-end;
-  grid-template-columns: repeat(auto-fit, minmax(60px, max-content));
-  gap: 2em;
+  justify-content: flex-start;
+  grid-template-columns: repeat(auto-fit, minmax(max-content, 50px));
   grid-template-rows: 1fr;
+  gap: 10px;
+  align-items: center;
+  overflow-x: hidden;
+  padding-left: 10px;
+  padding-right: 10px;
 `;
 
 const FilterButtonContainer = styled.div`

packages/power-bi/src/lib/components/quickFilterGroup/QuickFilterGroup.tsx

@@ -5,7 +5,7 @@ import { ActiveFilter, PowerBiFilter, PowerBiFilterItem } from '../../types';
 import { getFilterHeaderText } from '../../utils/getFilterHeader';
 import { FilterController } from '../Filter/Filter';
 import { PowerBiGroupPopoverMenu } from '../groupPopoverMenu/GroupPopoverMenu';
-import { StyledFilterGroupWrapper } from './quickFilterGroup.styles';
+import { StyledFilterGroupContent, StyledFilterGroupWrapper } from './quickFilterGroup.styles';
 
 interface PowerBiFilterGroupProps {
   controller: FilterController;
@@ -24,18 +24,21 @@ export const PowerBiFilterGroup = ({
 
   if (!activeFilters) return null;
   const isAllChecked = activeFilters.length === 0 || activeFilters.length === group.filterVals.length;
+
   return (
-    <div style={{ height: '50px', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
+    <>
       <StyledFilterGroupWrapper onClick={() => setIsOpen((s) => !s)} ref={anchorEl}>
-        <div>
-          {getFilterHeaderText(
-            isAllChecked,
-            group.type,
-            activeFilters.map((s) => s?.toString() ?? '(Blank)')
-          )}
-        </div>
+        <StyledFilterGroupContent>
+          <div>
+            {getFilterHeaderText(
+              isAllChecked,
+              group.type,
+              activeFilters.map((s) => s?.toString() ?? '(Blank)')
+            )}
+          </div>
 
-        <Icon color={tokens.colors.text.static_icons__tertiary.hex} name="chevron_down" />
+          <Icon color={tokens.colors.text.static_icons__tertiary.hex} name="chevron_down" />
+        </StyledFilterGroupContent>
       </StyledFilterGroupWrapper>
       {isOpen && (
         <PowerBiGroupPopoverMenu
@@ -48,6 +51,6 @@ export const PowerBiFilterGroup = ({
           onCloseMenu={() => setIsOpen(false)}
         />
       )}
-    </div>
+    </>
   );
 };

packages/power-bi/src/lib/components/quickFilterGroup/quickFilterGroup.styles.ts

@@ -2,12 +2,19 @@ import { tokens } from '@equinor/eds-tokens';
 import styled from 'styled-components';
 
 export const StyledFilterGroupWrapper = styled.div`
+  height: 50px;
+  width: min-content;
+  display: flex;
+  align-items: center;
+`;
+
+export const StyledFilterGroupContent = styled.div`
   height: auto;
-  width: auto;
+  width: min-content;
   display: flex;
   align-items: center;
   cursor: pointer;
-
+  justify-content: center;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

packages/workspace-fusion/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/workspace-fusion",
-  "version": "7.0.4",
+  "version": "8.0.0",
   "type": "module",
   "sideEffects": false,
   "license": "MIT",

packages/workspace-fusion/src/lib/integrations/power-bi/power-bi.ts

@@ -2,6 +2,7 @@
  * Integrations folder for exporting types from the integration
  * namespace: @equinor/workspace-fusion/power-bi
  */
+import { FallbackProps } from 'react-error-boundary';
 
 import {
   ActiveFilter,
@@ -54,6 +55,10 @@ type EmbedConfiguration = {
   reportId: string;
 };
 
+export type ErrorComponentProps = {
+  reportUri: string;
+} & FallbackProps;
+
 type PowerBiConfig = {
   reportUri: string;
   getEmbed: (reportUri: string, token: string, signal?: AbortSignal) => Promise<EmbedConfiguration>;
@@ -68,7 +73,7 @@ type PowerBiConfig = {
    * }
    * ```
    */
-  getErrorMessage: (reportUri: string, signal?: AbortSignal) => Promise<string>;
+  ErrorComponent: React.ComponentType<ErrorComponentProps>;
   filters?: FilterConfig;
   ReportMetaData?: (props: ReportMetaDataProps) => JSX.Element;
   getClassification?: (reportUri: string, signal?: AbortSignal) => Promise<string>;

packages/workspace-fusion/src/modules/power-bi/index.tsx

@@ -169,12 +169,12 @@ const PowerBiWrapper = (powerBiConfig: PowerBiConfig & { controller: PowerBiCont
 
   return (
     <PowerBI
-      getErrorMessage={powerBiConfig.getErrorMessage}
       controller={powerBiConfig.controller}
       getToken={powerBiConfig.getToken}
       getEmbedInfo={powerBiConfig.getEmbed}
       reportUri={powerBiConfig.reportUri}
       filters={createBasicFilter(powerBiConfig.filters)}
+      ErrorComponent={powerBiConfig.ErrorComponent}
     />
   );
 };