OU-1247: Follow up to address timerange persisting between dashboard toggle in the same project

web/src/components/dashboards/perses/dashboard-create-dialog.tsx

@@ -53,10 +53,11 @@ export const DashboardCreateDialog: React.FunctionComponent<DashboardCreateDialo
     permissionsLoading,
     permissionsError,
     persesProjects,
-    defaultProject,
     projectOptions,
   } = useDashboardProjects();
 
+  const defaultProject = editableProjects ? editableProjects[0] : '';
+
   const { ensureProjectExists, isCreatingProject } = useProjectCreation();
   const { navigateToDashboard } = useDashboardNavigation();
   const createDashboardMutation = useCreateDashboardMutation();

web/src/components/dashboards/perses/dashboard-list.tsx

@@ -37,6 +37,7 @@ import {
 import { ProjectBar } from './project/ProjectBar';
 import { Helmet } from 'react-helmet';
 import { DashboardListPageHeader } from './dashboard-header';
+import { useEditableProjects } from './hooks/useEditableProjects';
 const perPageOptions = [
   { title: '10', value: 10 },
   { title: '20', value: 20 },
@@ -59,6 +60,7 @@ const DashboardActionsCell = React.memo(
     emptyActions: any[];
   }) => {
     const { t } = useTranslation(process.env.I18N_NAMESPACE);
+    const { permissionsLoading } = useEditableProjects();
     const { canEdit, loading } = usePersesEditPermissions(project);
     const disabled = !canEdit;
 
@@ -90,6 +92,16 @@ const DashboardActionsCell = React.memo(
       );
     }
 
+    if (permissionsLoading) {
+      return (
+        <Tooltip content={t('Checking permissions...')}>
+          <div>
+            <ActionsColumn items={emptyActions} isDisabled={true} />
+          </div>
+        </Tooltip>
+      );
+    }
+
     return <ActionsColumn items={rowSpecificActions} isDisabled={false} />;
   },
 );

web/src/components/dashboards/perses/hooks/useDashboardsData.ts

@@ -105,16 +105,16 @@ export const useDashboardsData = () => {
 
       const params = new URLSearchParams(queryArguments);
 
-      let projectToUse = activeProject;
-      if (!activeProject) {
-        const dashboardMetadata = combinedDashboardsMetadata.find((item) => item.name === newBoard);
-        projectToUse = dashboardMetadata?.project;
-      }
+      const dashboard = combinedDashboardsMetadata.find((item) => item.name === newBoard);
+
+      const projectToUse = activeProject || dashboard?.project;
 
       if (projectToUse) {
         params.set(QueryParams.Project, projectToUse);
       }
       params.set(QueryParams.Dashboard, newBoard);
+      params.set(QueryParams.Start, dashboard?.persesDashboard?.spec?.duration);
+      params.set(QueryParams.Refresh, dashboard?.persesDashboard?.spec?.refreshInterval);
 
       let url = getDashboardUrl(perspective);
       url = `${url}?${params.toString()}`;

web/src/components/query-params.ts

@@ -5,4 +5,7 @@ export enum QueryParams {
   EndTime = 'endTime',
   Datasource = 'datasource',
   Project = 'project',
+  Edit = 'edit',
+  Start = 'start',
+  Refresh = 'refresh',
 }