feat(ui): cache namespace selection. Closes #2439 (#2441)

* feat(ui): cache namespace selection * manage ns cache in the parent pages of NamespaceFilter * rename
argoproj · Mar 13, 2020 · 1baa7ee · 1baa7ee
1 parent 91d2988
commit 1baa7ee
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 5 deletions.
diff --git a/ui/src/app/archived-workflows/components/archived-workflow-list/archived-workflow-list.tsx b/ui/src/app/archived-workflows/components/archived-workflow-list/archived-workflow-list.tsx
@@ -44,7 +44,7 @@ export class ArchivedWorkflowList extends BasePage<RouteComponentProps<any>, Sta
             nextOffset: 0,
             initialized: false,
             managedNamespace: false,
-            namespace: this.props.match.params.namespace || '',
+            namespace: this.props.match.params.namespace || Utils.getCurrentNamespace() || '',
             selectedPhases: this.queryParams('phase'),
             selectedLabels: this.queryParams('label')
         };
@@ -166,6 +166,7 @@ export class ArchivedWorkflowList extends BasePage<RouteComponentProps<any>, Sta
                     nextOffset: this.parseOffset(list.metadata.continue || ''),
                     loading: false
                 });
+                Utils.setCurrentNamespace(newNamespace);
             })
             .catch(error => this.setState({error, loading: false}));
     }

diff --git a/ui/src/app/cron-workflows/components/cron-workflow-list/cron-workflow-list.tsx b/ui/src/app/cron-workflows/components/cron-workflow-list/cron-workflow-list.tsx
@@ -12,6 +12,7 @@ import {ZeroState} from '../../../shared/components/zero-state';
 import {Consumer} from '../../../shared/context';
 import {exampleCronWorkflow} from '../../../shared/examples';
 import {services} from '../../../shared/services';
+import {Utils} from '../../../shared/utils';
 
 require('./cron-workflow-list.scss');
 
@@ -31,6 +32,7 @@ export class CronWorkflowList extends BasePage<RouteComponentProps<any>, State>
         this.setState({namespace});
         history.pushState(null, '', uiUrl('cron-workflows/' + namespace));
         this.fetchCronWorkflows();
+        Utils.setCurrentNamespace(namespace);
     }
 
     private get sidePanel() {
@@ -42,7 +44,7 @@ export class CronWorkflowList extends BasePage<RouteComponentProps<any>, State>
     }
     constructor(props: any) {
         super(props);
-        this.state = {loading: true, namespace: this.props.match.params.namespace || ''};
+        this.state = {loading: true, namespace: this.props.match.params.namespace || Utils.getCurrentNamespace() || ''};
     }
 
     public componentDidMount(): void {

diff --git a/ui/src/app/shared/utils.ts b/ui/src/app/shared/utils.ts
@@ -120,5 +120,13 @@ export const Utils = {
             return false;
         }
         return wf.status.phase === 'Running';
+    },
+
+    setCurrentNamespace(value: string): void {
+        localStorage.setItem('current_namespace', value);
+    },
+
+    getCurrentNamespace(): string {
+        return localStorage.getItem('current_namespace');
     }
 };
diff --git a/ui/src/app/workflow-templates/components/workflow-template-list/workflow-template-list.tsx b/ui/src/app/workflow-templates/components/workflow-template-list/workflow-template-list.tsx
@@ -12,6 +12,7 @@ import {ZeroState} from '../../../shared/components/zero-state';
 import {Consumer} from '../../../shared/context';
 import {exampleWorkflowTemplate} from '../../../shared/examples';
 import {services} from '../../../shared/services';
+import {Utils} from '../../../shared/utils';
 
 require('./workflow-template-list.scss');
 
@@ -31,6 +32,7 @@ export class WorkflowTemplateList extends BasePage<RouteComponentProps<any>, Sta
         this.setState({namespace});
         history.pushState(null, '', uiUrl('workflow-templates/' + namespace));
         this.fetchWorkflowTemplates();
+        Utils.setCurrentNamespace(namespace);
     }
 
     private get sidePanel() {
@@ -43,7 +45,7 @@ export class WorkflowTemplateList extends BasePage<RouteComponentProps<any>, Sta
 
     constructor(props: RouteComponentProps<any>, context: any) {
         super(props, context);
-        this.state = {loading: true, namespace: this.props.match.params.namespace || ''};
+        this.state = {loading: true, namespace: this.props.match.params.namespace || Utils.getCurrentNamespace() || ''};
     }
 
     public componentDidMount(): void {

diff --git a/ui/src/app/workflows/components/workflows-list/workflows-list.tsx b/ui/src/app/workflows/components/workflows-list/workflows-list.tsx
@@ -46,7 +46,7 @@ export class WorkflowsList extends BasePage<RouteComponentProps<any>, State> {
             loading: true,
             initialized: false,
             managedNamespace: false,
-            namespace: this.props.match.params.namespace || '',
+            namespace: this.props.match.params.namespace || Utils.getCurrentNamespace() || '',
             selectedPhases: this.queryParams('phase'),
             selectedLabels: this.queryParams('label')
         };
@@ -143,7 +143,10 @@ export class WorkflowsList extends BasePage<RouteComponentProps<any>, State> {
         workflowList
             .then(list => list.items)
             .then(list => list || [])
-            .then(workflows => this.setState({workflows, namespace: newNamespace, selectedPhases, selectedLabels}))
+            .then(workflows => {
+                this.setState({workflows, namespace: newNamespace, selectedPhases, selectedLabels});
+                Utils.setCurrentNamespace(newNamespace);
+            })
             .then(() => {
                 this.subscription = services.workflows
                     .watch({namespace: newNamespace, phases: selectedPhases, labels: selectedLabels})