From 4562e98df5e0b4db76779f38f9e3b189c3092dbc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sybren=20A=2E=20St=C3=BCvel?= <sybren@blender.org>
Date: Fri, 20 May 2022 14:43:30 +0200
Subject: [PATCH] Web: store footer popover state in local storage

Keep the footer popover state in the local storage, restoring it on load:
- Visibility of the popover
- Current tab of the popover
---
 web/app/src/components/footer/FooterPopup.vue | 9 +++++++--
 web/app/src/views/JobsView.vue                | 6 +++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/web/app/src/components/footer/FooterPopup.vue b/web/app/src/components/footer/FooterPopup.vue
index 259ffdd6..af6a740e 100644
--- a/web/app/src/components/footer/FooterPopup.vue
+++ b/web/app/src/components/footer/FooterPopup.vue
@@ -1,13 +1,18 @@
 <script setup>
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
 import NotificationList from './NotificationList.vue'
 import TaskLog from './TaskLog.vue'
 import ConnectionStatus from '@/components/ConnectionStatus.vue'
 
 const emit = defineEmits(['clickClose'])
 
-const currentTab = ref('NotificationList')
+const initialTab = localStorage.getItem("footer-popover-active-tab") || 'NotificationList';
+const currentTab = ref(initialTab)
 const tabs = { NotificationList, TaskLog }
+
+watch(currentTab, async (newTab) => {
+  localStorage.setItem("footer-popover-active-tab", newTab);
+});
 </script>
 
 <template>
diff --git a/web/app/src/views/JobsView.vue b/web/app/src/views/JobsView.vue
index 46b8dd28..a28b706a 100644
--- a/web/app/src/views/JobsView.vue
+++ b/web/app/src/views/JobsView.vue
@@ -57,7 +57,7 @@ export default {
     tasks: useTasks(),
     notifs: useNotifs(),
     taskLog: useTaskLog(),
-    showFooterPopup: false,
+    showFooterPopup: !!localStorage.getItem("footer-popover-visible"),
   }),
   computed: {
     hasJobData() {
@@ -85,6 +85,10 @@ export default {
       this.taskLog.clear();
       this._fetchTask(newTaskID);
     },
+    showFooterPopup(shown) {
+      if (shown) localStorage.setItem("footer-popover-visible", "true");
+      else localStorage.removeItem("footer-popover-visible");
+    },
   },
   methods: {
     onTableJobClicked(rowData) {