fix: dashboard variables reset on tab visibility change (#4619)

This commit is contained in:
Vikrant Gupta 2024-03-04 13:54:55 +05:30 committed by GitHub
parent ffdb4cfff0
commit 2713e186d3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 20 additions and 9 deletions

View File

@ -1,5 +1,4 @@
import { Row } from 'antd'; import { Row } from 'antd';
import { useDashboardVariablesFromLocalStorage } from 'hooks/dashboard/useDashboardFromLocalStorage';
import { useDashboard } from 'providers/Dashboard/Dashboard'; import { useDashboard } from 'providers/Dashboard/Dashboard';
import { memo, useEffect, useState } from 'react'; import { memo, useEffect, useState } from 'react';
import { IDashboardVariable } from 'types/api/dashboard/getAll'; import { IDashboardVariable } from 'types/api/dashboard/getAll';
@ -11,12 +10,8 @@ function DashboardVariableSelection(): JSX.Element | null {
const { const {
selectedDashboard, selectedDashboard,
setSelectedDashboard, setSelectedDashboard,
dashboardId,
} = useDashboard();
const {
updateLocalStorageDashboardVariables, updateLocalStorageDashboardVariables,
} = useDashboardVariablesFromLocalStorage(dashboardId); } = useDashboard();
const { data } = selectedDashboard || {}; const { data } = selectedDashboard || {};

View File

@ -52,6 +52,7 @@ const DashboardContext = createContext<IDashboardContext>({
updatedTimeRef: {} as React.MutableRefObject<Dayjs | null>, updatedTimeRef: {} as React.MutableRefObject<Dayjs | null>,
toScrollWidgetId: '', toScrollWidgetId: '',
setToScrollWidgetId: () => {}, setToScrollWidgetId: () => {},
updateLocalStorageDashboardVariables: () => {},
}); });
interface Props { interface Props {
@ -96,9 +97,10 @@ export function DashboardProvider({
const [selectedDashboard, setSelectedDashboard] = useState<Dashboard>(); const [selectedDashboard, setSelectedDashboard] = useState<Dashboard>();
const { currentDashboard } = useDashboardVariablesFromLocalStorage( const {
dashboardId, currentDashboard,
); updateLocalStorageDashboardVariables,
} = useDashboardVariablesFromLocalStorage(dashboardId);
const updatedTimeRef = useRef<Dayjs | null>(null); // Using ref to store the updated time const updatedTimeRef = useRef<Dayjs | null>(null); // Using ref to store the updated time
const modalRef = useRef<any>(null); const modalRef = useRef<any>(null);
@ -320,6 +322,7 @@ export function DashboardProvider({
setSelectedDashboard, setSelectedDashboard,
updatedTimeRef, updatedTimeRef,
setToScrollWidgetId, setToScrollWidgetId,
updateLocalStorageDashboardVariables,
}), }),
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
[ [
@ -330,6 +333,8 @@ export function DashboardProvider({
dashboardId, dashboardId,
layouts, layouts,
toScrollWidgetId, toScrollWidgetId,
updateLocalStorageDashboardVariables,
currentDashboard,
], ],
); );

View File

@ -19,4 +19,15 @@ export interface IDashboardContext {
updatedTimeRef: React.MutableRefObject<dayjs.Dayjs | null>; updatedTimeRef: React.MutableRefObject<dayjs.Dayjs | null>;
toScrollWidgetId: string; toScrollWidgetId: string;
setToScrollWidgetId: React.Dispatch<React.SetStateAction<string>>; setToScrollWidgetId: React.Dispatch<React.SetStateAction<string>>;
updateLocalStorageDashboardVariables: (
id: string,
selectedValue:
| string
| number
| boolean
| (string | number | boolean)[]
| null
| undefined,
allSelected: boolean,
) => void;
} }