fix: workflow state persist when the browser is closed

src/background/index.js

@@ -1,9 +1,10 @@
 import browser from 'webextension-polyfill';
+import { objectHasKey } from '@/utils/helper';
 import { MessageListener } from '@/utils/message';
+import { registerSpecificDay } from '../utils/workflow-trigger';
 import workflowState from './workflow-state';
 import workflowEngine from './workflow-engine';
 import CollectionEngine from './collection-engine';
-import { registerSpecificDay } from '../utils/workflow-trigger';
 
 function getWorkflow(workflowId) {
   return new Promise((resolve) => {
@@ -47,6 +48,22 @@ function executeCollection(collection) {
 
   return true;
 }
+async function checkRunnigWorkflows() {
+  try {
+    const result = await browser.storage.local.get('workflowState');
+
+    result.workflowState.forEach(({ id }, index) => {
+      if (objectHasKey(runningWorkflows, id)) return;
+
+      result.workflowState.splice(index, 1);
+    });
+
+    browser.storage.local.set({ workflowState: result.workflowState });
+  } catch (error) {
+    console.error(error);
+  }
+}
+checkRunnigWorkflows();
 
 browser.tabs.onUpdated.addListener(async (tabId, changeInfo, tab) => {
   if (changeInfo.status === 'complete') {
@@ -151,6 +168,7 @@ message.on('collection:stop', (id) => {
   collection.stop();
 });
 
+message.on('workflow:check-state', checkRunnigWorkflows);
 message.on('workflow:execute', (workflow) => executeWorkflow(workflow));
 message.on('workflow:stop', (id) => {
   const workflow = runningWorkflows[id];

src/components/popup/home/HomeWorkflowCard.vue

@@ -7,7 +7,7 @@
       @click="$emit('details', workflow)"
     >
       <p class="leading-tight text-overflow">{{ workflow.name }}</p>
-      <p class="leading-none text-gray-500">
+      <p class="leading-tight text-gray-500">
         {{ dayjs(workflow.createdAt).fromNow() }}
       </p>
     </div>

src/newtab/App.vue

@@ -13,6 +13,7 @@ import { useStore } from 'vuex';
 import browser from 'webextension-polyfill';
 import { loadLocaleMessages, setI18nLanguage } from '@/lib/vue-i18n';
 import AppSidebar from '@/components/newtab/app/AppSidebar.vue';
+import { sendMessage } from '@/utils/message';
 
 const store = useStore();
 const retrieved = ref(false);
@@ -47,6 +48,8 @@ onMounted(async () => {
     await loadLocaleMessages(store.state.settings.locale, 'newtab');
     await setI18nLanguage(store.state.settings.locale);
 
+    await sendMessage('workflow:check-state', {}, 'background');
+
     retrieved.value = true;
   } catch (error) {
     retrieved.value = true;

src/popup/App.vue

@@ -28,7 +28,7 @@ onMounted(async () => {
 <style>
 body {
   height: 500px;
-  width: 330px;
+  width: 350px;
   font-size: 16px;
 }
 </style>