From 830de6836ab5bb452d6e0b042ddb4e0dacd323bb Mon Sep 17 00:00:00 2001
From: Alex Tideman <alex.tideman@temporal.io>
Date: Wed, 4 Sep 2024 14:10:27 -0500
Subject: [PATCH] Add taskQueueView store to persist worker tab on task queue
 page (#2309)

---
 src/lib/pages/task-queue.svelte   | 13 +++++++++----
 src/lib/stores/task-queue-view.ts |  8 ++++++++
 src/lib/types/events.ts           |  1 +
 3 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 src/lib/stores/task-queue-view.ts

diff --git a/src/lib/pages/task-queue.svelte b/src/lib/pages/task-queue.svelte
index 5dfc292bc..f06dc6b28 100644
--- a/src/lib/pages/task-queue.svelte
+++ b/src/lib/pages/task-queue.svelte
@@ -7,12 +7,15 @@
   import Tabs from '$lib/holocene/tab/tabs.svelte';
   import { translate } from '$lib/i18n/translate';
   import { getPollers } from '$lib/services/pollers-service';
+  import { taskQueueView } from '$lib/stores/task-queue-view';
 
   import TaskQueueVersioning from './task-queue-versioning.svelte';
 
   $: ({ queue: taskQueue, namespace } = $page.params);
 
-  let view: 'workers' | 'versioning' = 'workers';
+  const onTab = (view: 'workers' | 'versioning') => {
+    $taskQueueView = view;
+  };
 </script>
 
 {#await getPollers({ queue: taskQueue, namespace }) then workers}
@@ -25,16 +28,18 @@
         <Tab
           label={translate('workers.workers')}
           id="worker-tab"
-          onClick={() => (view = 'workers')}
+          onClick={() => onTab('workers')}
+          active={$taskQueueView === 'workers'}
         />
         <Tab
           label={translate('workers.versioning')}
           id="versioning-tab"
-          onClick={() => (view = 'versioning')}
+          onClick={() => onTab('versioning')}
+          active={$taskQueueView === 'versioning'}
         />
       </TabList>
     </Tabs>
-    {#if view === 'versioning'}
+    {#if $taskQueueView === 'versioning'}
       <TaskQueueVersioning {taskQueue} {workers} />
     {:else}
       <WorkerTable {workers} />
diff --git a/src/lib/stores/task-queue-view.ts b/src/lib/stores/task-queue-view.ts
new file mode 100644
index 000000000..137fb9387
--- /dev/null
+++ b/src/lib/stores/task-queue-view.ts
@@ -0,0 +1,8 @@
+import { persistStore } from '$lib/stores/persist-store';
+import type { TaskQueueView } from '$lib/types/events';
+
+export const taskQueueView = persistStore<TaskQueueView>(
+  'taskQueueView',
+  'workers',
+  true,
+);
diff --git a/src/lib/types/events.ts b/src/lib/types/events.ts
index 68c9df095..9339956c9 100644
--- a/src/lib/types/events.ts
+++ b/src/lib/types/events.ts
@@ -151,6 +151,7 @@ export type ChildEvent = StartChildWorkflowExecutionInitiatedEvent &
   ChildWorkflowExecutionTerminatedEvent;
 
 export type EventView = 'compact' | 'feed' | 'json';
+export type TaskQueueView = 'workers' | 'versioning';
 
 export type IterableEvent = WorkflowEvent | EventGroup;