diff --git a/packages/core/src/dashboards/view/DashboardScreen.tsx b/packages/core/src/dashboards/view/DashboardScreen.tsx index e012998165..b4ee1972d6 100644 --- a/packages/core/src/dashboards/view/DashboardScreen.tsx +++ b/packages/core/src/dashboards/view/DashboardScreen.tsx @@ -28,13 +28,16 @@ export const DashboardScreen = ({dashboardId}) => { const I18n = useTranslator(); const [dashboard, setDashboard] = useState({}); + const [loading, setLoading] = useState(false); const refresh = useCallback(() => { + setLoading(true); fetchDashboard({id: dashboardId}) .then(response => { setDashboard({...(response?.data?.object ?? {}), id: dashboardId}); }) - .catch(() => setDashboard({})); + .catch(() => setDashboard({})) + .finally(() => setLoading(false)); }, [dashboardId]); useEffect(() => { @@ -78,7 +81,7 @@ export const DashboardScreen = ({dashboardId}) => { })); }, [dashboard]); - if (dashboard?.id !== dashboardId) { + if (loading) { return ; } diff --git a/packages/ui/src/components/templates/Dashboard/Dashboard.tsx b/packages/ui/src/components/templates/Dashboard/Dashboard.tsx index 1bbb3059e6..673cd5f529 100644 --- a/packages/ui/src/components/templates/Dashboard/Dashboard.tsx +++ b/packages/ui/src/components/templates/Dashboard/Dashboard.tsx @@ -109,16 +109,20 @@ const Dashboard = ({style, lineList}: DashboardProps) => { return ( {lineList?.map((line, indexLine) => { - const nbGraphInLine = Math.min( - line.graphList?.length, - MAX_GRAPH_PER_LINE, + const validGraphs = line.graphList.filter( + graph => graph.dataList?.[0]?.length > 0, ); + const nbGraphInLine = Math.min(validGraphs.length, MAX_GRAPH_PER_LINE); + const limitedGraphList = line.graphList?.slice(0, MAX_GRAPH_PER_LINE); return ( {limitedGraphList?.map((graph, indexGraph) => { - return renderChart(graph, indexGraph, nbGraphInLine); + if (graph.dataList?.[0]?.length > 0) { + return renderChart(graph, indexGraph, nbGraphInLine); + } + return null; })} );