wip

equinor · Nov 8, 2024 · ca377d4 · ca377d4
1 parent c0d8e08
commit ca377d4
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 87 deletions.
diff --git a/packages/power-bi/src/lib/classes/powerBiController.ts b/packages/power-bi/src/lib/classes/powerBiController.ts
@@ -34,6 +34,7 @@ export class PowerBiController {
   };
 
   reportReady = (newValue: Report) => {
+    console.log('Report Ready');
     newValue.getActivePage().then(this.setActivePage);
     newValue.on('pageChanged', (page: ICustomEvent<any>) => {
       this.setActivePage(page.detail.newPage);

diff --git a/packages/power-bi/src/lib/components/Filter/Filter.tsx b/packages/power-bi/src/lib/components/Filter/Filter.tsx
@@ -155,57 +155,46 @@ export const PowerBIFilter = ({ report, options }: PowerBIFilterProps): JSX.Elem
   }, []);
 
   /**
-   * Effect should be triggered when report has first loaded,
-   * initializing all possible filters and also checking for default active filters.
-   * Also need to handle when user changes page, so this effect has to also be triggered when
-   * page is changed.
-   */
-  useEffect(() => {
-    if (report) {
-      const initFilters = async () => {
-        const filters = await getFiltersAsync(report);
-        const defaultActiveFilters = await getActiveFilterValues(filters);
-        setSlicerFilters(filters.sort((a, b) => a.type.localeCompare(b.type)));
-        setActiveFilters(defaultActiveFilters);
-        const state = getVisibleFiltersFromLocalStorage(report.getId());
-        if (state) {
-          setFilterGroupVisible(state);
-        } else {
-          setFilterGroupVisible(filters.map((s) => s.type));
-        }
-        setisFiltersLoading(false);
-      };
-
-      initFilters();
-    }
-  }, [report]);
-
-  /**
-   * Effect should be triggered when activeFilters has changed.
-   * Some filters may not longer be applicable, therefore the need to get filters again.
-   * Dependency array needs to check for length because checking only object will not fire the effect.
+   * Triggers when the report is loaded
+   * It handles the initial setup of filters and active filters as well as setting up event listeners for future filter changes
    */
   useEffect(() => {
+    const updateFilters = async () => {
+      console.log('updateFilters');
+      var filters = await getFiltersAsync(report);
+      setSlicerFilters(filters.sort((a, b) => a.type.localeCompare(b.type)));
+      const filterGroupNames = getActiveFilterGroupArray(activeFilters);
+      const reportId = report.getId();
+      const state = getVisibleFiltersFromLocalStorage(reportId);
+      if (state) {
+        setFilterGroupVisible(state);
+      } else {
+        setFilterGroupVisible((s) => [...s, ...filterGroupNames].filter((v, i, a) => a.indexOf(v) === i));
+      }
+      setisFiltersLoading(false);
+      console.log('updateFilters done', isFiltersLoading, activeFilters, slicerFilters);
+    };
+
+    const initFilters = async () => {
+      debugger;
+      report.off('rendered', initFilters);
+      console.log('initFilters');
+      const filters = await getFiltersAsync(report);
+      const defaultActiveFilters = await getActiveFilterValues(filters);
+      setActiveFilters(defaultActiveFilters);
+      report.on('rendered', updateFilters);
+      updateFilters();
+    };
     if (report) {
-      const reCreateFilters = async () => {
-        const filters = await getFiltersAsync(report);
-
-        setSlicerFilters(filters.sort((a, b) => a.type.localeCompare(b.type)));
-
-        const filterGroupNames = getActiveFilterGroupArray(activeFilters);
-
-        const reportId = report.getId();
-
-        const state = getVisibleFiltersFromLocalStorage(reportId);
-        if (state) {
-          setFilterGroupVisible(state);
-        } else {
-          setFilterGroupVisible((s) => [...s, ...filterGroupNames].filter((v, i, a) => a.indexOf(v) === i));
-        }
-      };
-      reCreateFilters();
+      console.log('initFilters');
+      report.on('rendered', initFilters);
     }
-  }, [activeFilters, Object.keys(activeFilters).length]);
+    return () => {
+      report.off('rendered', initFilters);
+      report.off('rendered', updateFilters);
+      console.log('cleanup');
+    };
+  }, []);
 
   if (isFiltersLoading || !activeFilters || !slicerFilters) return <QuickFilterLoading />;
 

diff --git a/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx b/packages/power-bi/src/lib/components/QuickFilter/QuickFilter.tsx
@@ -82,14 +82,7 @@ export const PowerBIQuickFilter = ({ controller }: PowerBIQuickFilterProps): JSX
           <StyledFilterButtons>
             <OtherFiltersAppliedInfo activeFilters={calculateHiddenFilters(shownFilters, activeFilters)} />
             <FilterButtonContainer>
-              <Button
-                style={{ height: '40px' }}
-                variant="ghost_icon"
-                disabled={!isAnyFiltersActive()}
-                onClick={async () => await resetFilter()}
-              >
-                <FilterClearIcon isDisabled={!isAnyFiltersActive()} />
-              </Button>
+              <FilterClearIcon onClick={async () => await resetFilter()} isDisabled={!isAnyFiltersActive()} />
               <Tooltip title={isFilterExpanded ? 'Hide all filter options' : 'Show all filter options'}>
                 <Button
                   style={{ height: '40px' }}

diff --git a/packages/power-bi/src/lib/utils/getFiltersAsync.ts b/packages/power-bi/src/lib/utils/getFiltersAsync.ts
@@ -8,37 +8,16 @@ import { getSlicerDataAsync } from './getSlicerDataAsync';
  * Some filters may be removed after a slicer filter is set.
  */
 export async function getFiltersAsync(reportInstance: Report): Promise<PowerBiFilter[]> {
-  try {
-    const page = await reportInstance.getActivePage();
-    const visuals = await page.getVisuals();
-    const slicers = visuals.filter((visual) => visual.type == 'slicer');
-    const concurrencyLimit = 3;
-    const slicerQueue = [...slicers];
-    const activePromises = [];
-    const filters: PowerBiFilter[] = [];
+  const page = await reportInstance.getActivePage();
+  const visuals = await page.getVisuals();
+  const slicers = visuals.filter((visual) => visual.type == 'slicer');
+  const filters = await Promise.all(
+    slicers.map(async (slicer) => {
+      const slicerData = await getSlicerDataAsync(slicer);
 
-    const processSlicer = async () => {
-      while (slicerQueue.length > 0) {
-        const slicer = slicerQueue.shift();
-        if (!slicer) {
-          break;
-        }
-        const slicerData = await getSlicerDataAsync(slicer);
-        const filter = createPowerBiFilter(slicerData);
-        if (!filter.type.startsWith(HIDDEN_FILTER_PREFIX)) {
-          filters.push(filter);
-        }
-      }
-    };
-    for (let i = 0; i < concurrencyLimit; i++) {
-      if (slicerQueue.length > 0) {
-        activePromises.push(processSlicer());
-      }
-    }
-    await Promise.all(activePromises);
-    return filters;
-  } catch (error) {
-    console.error('Error fetching slicer filters:', error);
-    throw error;
-  }
+      return createPowerBiFilter(slicerData);
+    })
+  );
+
+  return filters.filter((f) => !f.type.startsWith(HIDDEN_FILTER_PREFIX));
 }