microsoft / powerbi-client-react

Power BI for React which provides components and services to enabling developers to easily embed Power BI reports into their applications.
MIT License
305 stars 96 forks source link

How to persist report data? #96

Closed SMKH-PRO closed 7 months ago

SMKH-PRO commented 1 year ago

Powerbi reports takes quite a few seconds to load, but once this report is loaded I want persist this data (maybe in redux) so that when user comes back to this report the data is already loaded and we don't have to show the loading again or fetch the reports again, I couldn't find a way to control library's data storing technique.

How can I persist a report? so it doesn't load again and again everytime?

SAMPLE CODE:

/** @format */

import type { NextPage } from "next";
import React, { useEffect } from "react";
import dynamic from "next/dynamic";
import { useAppDispatch } from "../../../hooks/useAppDispatch";
import { fetchPowerBiData } from "../../../redux/slices/carrierDashboard";
import { useAppSelector } from "../../../hooks/useAppSelector";

const PowerBiComponent = dynamic(
  () => import("powerbi-client-react").then((d) => d.PowerBIEmbed),
  {
    ssr: false,
  }
);

const Performance: NextPage = () => {
  const data = useAppSelector((state) => state.carrierBoard.data);
  const dispatch = useAppDispatch();
  const getPowerBI = () => {
    dispatch(fetchPowerBiData());
  };
  useEffect(() => {
    getPowerBI();
  }, []);

  return (
      <PowerBiComponent
        embedConfig={{
          type: "report", // Supported types: report, dashboard, tile, visual, qna and paginated report
          id: data?.embedUrl?.[0]?.reportId,
          embedUrl: data?.embedUrl?.[0]?.embedUrl,
          accessToken: data?.accessToken, // Keep as empty string, null or undefined
          tokenType: 1,
        }}
        cssClassName="reportClass h-full"
      />
  );
};

export default Performance;
v-MadhavC commented 9 months ago

Hello, there is no such feature to persist Power BI Embedded report data in cache or memory at the moment, you can create related idea and vote for them: https://ideas.powerbi.com/ideas/

Reports can retain their state, including filters, slicers, and other data view changes by enabling persistent filters. Please follow this documentation on how to Enable persistent filters: https://learn.microsoft.com/en-us/javascript/api/overview/powerbi/enable-persistent-filters

The powerbi.preload API is used to reduce the load time of the embedded content in Power BI when your embedded content is on a different page. Please follow this documentation for Power BI preload: https://learn.microsoft.com/en-us/javascript/api/overview/powerbi/preload

Use bootstrap for better performance. powerbi.bootstrap allows you to start embedding before all the required parameters are available. The bootstrap API prepares and initializes the iframe. Please follow this documentation for powerbi.bootstrap: https://learn.microsoft.com/en-us/javascript/api/overview/powerbi/bootstrap-better-performance