From 4f96701a3424b531e72ab1acfdc55d4439984244 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Thu, 7 Dec 2023 16:43:39 +0200
Subject: [PATCH 01/41] added temporary mock for rest api, created required
 services including abstract StorageService and refactoring App.vue to use
 them

---
 db-rest-mock.json                             |  43 ++++
 package.json                                  |   1 +
 src/App.vue                                   |  35 +--
 src/main.js                                   |   9 +
 src/services/electronService.js               |  13 ++
 .../storage-options/localJsonDbService.js     |  14 ++
 .../storage-options/restApiService.js         |  14 ++
 src/services/storageInterface.js              |  10 +
 src/services/storageService.js                |  18 ++
 src/store/index.js                            |  10 +-
 yarn.lock                                     | 216 ++++++++++++++++--
 11 files changed, 340 insertions(+), 43 deletions(-)
 create mode 100644 db-rest-mock.json
 create mode 100644 src/services/electronService.js
 create mode 100644 src/services/storage-options/localJsonDbService.js
 create mode 100644 src/services/storage-options/restApiService.js
 create mode 100644 src/services/storageInterface.js
 create mode 100644 src/services/storageService.js

diff --git a/db-rest-mock.json b/db-rest-mock.json
new file mode 100644
index 00000000..ff303aa5
--- /dev/null
+++ b/db-rest-mock.json
@@ -0,0 +1,43 @@
+{
+  "state": {
+    "title": "",
+    "charter": {
+      "content": "",
+      "text": ""
+    },
+    "preconditions": {
+      "content": "",
+      "text": ""
+    },
+    "duration": 0,
+    "status": "start",
+    "timer": 2998,
+    "started": "16:12 | 12-06-2023",
+    "ended": "",
+    "quickTest": true,
+    "path": "/",
+    "mindmap": {
+      "nodes": [
+        {
+          "id": "5e274797-4db7-4fe8-a983-8b8abf8771c5",
+          "text": "System Under Test",
+          "url": "https://features.yattie.ai",
+          "fx": -210.9125181819311,
+          "fy": -583.1010883631283
+        },
+        {
+          "id": "4763495c-62b7-4625-9083-2d40045b6550",
+          "text": "Feature #1",
+          "fx": 99.1983655368465,
+          "fy": -582.6407249084972
+        }
+      ],
+      "connections": [
+        {
+          "source": "5e274797-4db7-4fe8-a983-8b8abf8771c5",
+          "target": "4763495c-62b7-4625-9083-2d40045b6550"
+        }
+      ]
+    }
+  }
+}
diff --git a/package.json b/package.json
index ab4e600b..a2595929 100644
--- a/package.json
+++ b/package.json
@@ -45,6 +45,7 @@
     "ffprobe-static": "^3.1.0",
     "fluent-ffmpeg": "^2.1.2",
     "form-data": "^4.0.0",
+    "json-server": "^0.17.4",
     "lodash": "^4.17.21",
     "node-polyfill-webpack-plugin": "^2.0.1",
     "simple-json-db": "^2.0.0",
diff --git a/src/App.vue b/src/App.vue
index 128efa9f..0346450e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,8 +7,6 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "./modules/constants";
-
 const default_layout = "default";
 
 export default {
@@ -18,31 +16,20 @@ export default {
       return (this.$route.meta.layout || default_layout) + "-layout";
     },
   },
-  beforeCreate() {
+  async beforeCreate() {
     // Only restore state for the primary window that opens at HomeView
     if (this.$router.history.current.path === "/") {
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_STATE,
-        })
-        .then((state) => {
-          if (Object.keys(state).length > 0) {
-            this.$store.commit("restoreState", state);
-            const currentPath = this.$router.history.current.path;
-            if (state.path && currentPath !== state.path) {
-              if (state.path.includes("result")) {
-                window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-                  func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
-                  data: {
-                    width: 1440,
-                    height: 900,
-                  },
-                });
-              }
-              this.$router.push({ path: state.path });
-            }
+      const state = await this.$storageService.getState();
+      if (Object.keys(state).length) {
+        this.$store.commit("restoreState", state);
+        const currentPath = this.$router.history.current.path;
+        if (state.path && currentPath !== state.path) {
+          if (state.path.includes("result") && this.$isElectron) {
+            this.$electronService.setWindowSize({ width: 1440, height: 900 });
           }
-        });
+          await this.$router.push({ path: state.path });
+        }
+      }
     }
   },
 };
diff --git a/src/main.js b/src/main.js
index dbaaa3a7..f21ccf3c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -13,6 +13,8 @@ import MinimizeLayout from "./layouts/Minimize.vue";
 import VueShortkey from "vue-shortkey";
 import VueMask from "v-mask";
 import i18n from "./i18n";
+import StorageService from "./services/storageService";
+import ElectronService from "@/services/electronService";
 
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@@ -44,12 +46,19 @@ Vue.component("font-awesome-icon", FontAwesomeIcon);
 
 Vue.config.productionTip = false;
 
+const isElectronApp = navigator.userAgent.includes("Electron");
+
 const plugins = {
   install() {
     Vue.integrationHelpers = integrationHelpers;
     Vue.prototype.$integrationHelpers = integrationHelpers;
     Vue.hotkeyHelpers = hotkeyHelpers;
     Vue.prototype.$hotkeyHelpers = hotkeyHelpers;
+    Vue.prototype.$isElectron = isElectronApp;
+    Vue.prototype.$storageService = new StorageService();
+    if (isElectronApp) {
+      Vue.prototype.$electronService = new ElectronService();
+    }
   },
 };
 Vue.use(plugins);
diff --git a/src/services/electronService.js b/src/services/electronService.js
new file mode 100644
index 00000000..b582b921
--- /dev/null
+++ b/src/services/electronService.js
@@ -0,0 +1,13 @@
+import { IPC_HANDLERS, IPC_FUNCTIONS } from "@/modules/constants";
+
+export default class ElectronService {
+  setWindowSize({ width, height }) {
+    window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
+      data: {
+        width,
+        height,
+      },
+    });
+  }
+}
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
new file mode 100644
index 00000000..71020961
--- /dev/null
+++ b/src/services/storage-options/localJsonDbService.js
@@ -0,0 +1,14 @@
+import StorageInterface from "../storageInterface";
+import { IPC_FUNCTIONS, IPC_HANDLERS } from "@/modules/constants";
+
+export default class LocalJsonDbService extends StorageInterface {
+  async getState() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_STATE,
+    });
+  }
+
+  async setState(state) {
+    console.log(state);
+  }
+}
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
new file mode 100644
index 00000000..31cd5983
--- /dev/null
+++ b/src/services/storage-options/restApiService.js
@@ -0,0 +1,14 @@
+import axios from "axios";
+import StorageInterface from "../storageInterface";
+
+export default class RestApiService extends StorageInterface {
+  async getState() {
+    const response = await axios.get(`http://localhost:3000/state`);
+    return response.data;
+  }
+
+  async setState(value) {
+    console.log(value);
+    // saving state endpoint here
+  }
+}
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
new file mode 100644
index 00000000..35ef08a9
--- /dev/null
+++ b/src/services/storageInterface.js
@@ -0,0 +1,10 @@
+export default class StorageInterface {
+  async getState() {
+    throw new Error("Method 'getState()' must be implemented.");
+  }
+
+  // eslint-disable-next-line
+  async setState(state) {
+    throw new Error("Method 'setState()' must be implemented.");
+  }
+}
diff --git a/src/services/storageService.js b/src/services/storageService.js
new file mode 100644
index 00000000..0f235ed3
--- /dev/null
+++ b/src/services/storageService.js
@@ -0,0 +1,18 @@
+import RestApiService from "./storage-options/restApiService";
+import LocalJsonDbService from "./storage-options/localJsonDbService";
+
+export default class StorageService {
+  constructor() {
+    this.storage = navigator.userAgent.includes("Electron")
+      ? new LocalJsonDbService()
+      : new RestApiService();
+  }
+
+  async getState() {
+    return await this.storage.getState();
+  }
+
+  async setState(state) {
+    return this.storage.setState(state);
+  }
+}
diff --git a/src/store/index.js b/src/store/index.js
index c9b0c1f1..ce50430c 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -174,10 +174,12 @@ export default new Vuex.Store({
       state.ended = payload.ended;
       state.quickTest = payload.quickTest;
       state.path = payload.path;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+          func: IPC_FUNCTIONS.UPDATE_STATE,
+          data: state,
+        });
+      }
     },
   },
   actions: {},
diff --git a/yarn.lock b/yarn.lock
index 4c5b308a..0d5c0423 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2887,7 +2887,7 @@ abort-controller@^3.0.0:
   dependencies:
     event-target-shim "^5.0.0"
 
-accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.8:
+accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7, accepts@~1.3.8:
   version "1.3.8"
   resolved "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz"
   integrity sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==
@@ -3484,6 +3484,13 @@ base@^0.11.1:
     mixin-deep "^1.2.0"
     pascalcase "^0.1.1"
 
+basic-auth@~2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/basic-auth/-/basic-auth-2.0.1.tgz#b998279bf47ce38344b4f3cf916d4679bbf51e3a"
+  integrity sha512-NF+epuEdnUYVlGuhaxbbq+dvJttwLnGY+YixlXlME5KpQ5W3CnXA5cVTneY3SPbPDRkcjMbifrwmFYcClgOZeg==
+  dependencies:
+    safe-buffer "5.1.2"
+
 batch@0.6.1:
   version "0.6.1"
   resolved "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz"
@@ -3572,6 +3579,24 @@ body-parser@1.20.1:
     type-is "~1.6.18"
     unpipe "1.0.0"
 
+body-parser@^1.19.0:
+  version "1.20.2"
+  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.2.tgz#6feb0e21c4724d06de7ff38da36dad4f57a747fd"
+  integrity sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA==
+  dependencies:
+    bytes "3.1.2"
+    content-type "~1.0.5"
+    debug "2.6.9"
+    depd "2.0.0"
+    destroy "1.2.0"
+    http-errors "2.0.0"
+    iconv-lite "0.4.24"
+    on-finished "2.4.1"
+    qs "6.11.0"
+    raw-body "2.5.2"
+    type-is "~1.6.18"
+    unpipe "1.0.0"
+
 bonjour-service@^1.0.11:
   version "1.1.1"
   resolved "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.1.1.tgz"
@@ -4442,6 +4467,11 @@ connect-history-api-fallback@^2.0.0:
   resolved "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz"
   integrity sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA==
 
+connect-pause@^0.1.1:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/connect-pause/-/connect-pause-0.1.1.tgz#b269b2bb82ddb1ac3db5099c0fb582aba99fb37a"
+  integrity sha512-a1gSWQBQD73krFXdUEYJom2RTFrWUL3YvXDCRkyv//GVXc79cdW9MngtRuN9ih4FDKBtfJAJId+BbDuX+1rh2w==
+
 console-browserify@^1.1.0, console-browserify@^1.2.0:
   version "1.2.0"
   resolved "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz"
@@ -4471,7 +4501,7 @@ content-disposition@0.5.4:
   dependencies:
     safe-buffer "5.2.1"
 
-content-type@~1.0.4:
+content-type@~1.0.4, content-type@~1.0.5:
   version "1.0.5"
   resolved "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz"
   integrity sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==
@@ -4542,6 +4572,14 @@ core-util-is@~1.0.0:
   resolved "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz"
   integrity sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==
 
+cors@^2.8.5:
+  version "2.8.5"
+  resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29"
+  integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==
+  dependencies:
+    object-assign "^4"
+    vary "^1"
+
 cosmiconfig@^7.0.0:
   version "7.1.0"
   resolved "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz"
@@ -5101,6 +5139,13 @@ de-indent@^1.0.2:
   version "1.2.1"
   resolved "https://codeload.github.com/component/debounce/tar.gz/8be734c4b5b5a58a517f2441e0d90242a4a564cd"
 
+debug@*, debug@4, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@^4.3.0, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4:
+  version "4.3.4"
+  resolved "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz"
+  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
+  dependencies:
+    ms "2.1.2"
+
 debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz"
@@ -5108,12 +5153,12 @@ debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   dependencies:
     ms "2.0.0"
 
-debug@4, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@^4.3.0, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4:
-  version "4.3.4"
-  resolved "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz"
-  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
+debug@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
+  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
   dependencies:
-    ms "2.1.2"
+    ms "2.0.0"
 
 debug@^3.2.7:
   version "3.2.7"
@@ -5242,7 +5287,7 @@ delegates@^1.0.0:
   resolved "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz"
   integrity sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==
 
-depd@2.0.0:
+depd@2.0.0, depd@~2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz"
   integrity sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==
@@ -5757,6 +5802,14 @@ error-stack-parser@^2.0.0, error-stack-parser@^2.0.6:
   dependencies:
     stackframe "^1.3.4"
 
+errorhandler@^1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/errorhandler/-/errorhandler-1.5.1.tgz#b9ba5d17cf90744cd1e851357a6e75bf806a9a91"
+  integrity sha512-rcOwbfvP1WTViVoUjcfZicVzjhjTuhSMntHh6mW3IrEiyE6mJyXvsToJUJGlGlw/2xU9P5whlWNGlIDVeCiT4A==
+  dependencies:
+    accepts "~1.3.7"
+    escape-html "~1.0.3"
+
 es-module-lexer@^1.2.1:
   version "1.3.0"
   resolved "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.3.0.tgz"
@@ -6118,7 +6171,15 @@ expect@^27.5.1:
     jest-matcher-utils "^27.5.1"
     jest-message-util "^27.5.1"
 
-express@^4.17.3:
+express-urlrewrite@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/express-urlrewrite/-/express-urlrewrite-1.4.0.tgz#985ee022773bac7ed32126f1cf9ec8ee48e1290a"
+  integrity sha512-PI5h8JuzoweS26vFizwQl6UTF25CAHSggNv0J25Dn/IKZscJHWZzPrI5z2Y2jgOzIaw2qh8l6+/jUcig23Z2SA==
+  dependencies:
+    debug "*"
+    path-to-regexp "^1.0.3"
+
+express@^4.17.1, express@^4.17.3:
   version "4.18.2"
   resolved "https://registry.npmjs.org/express/-/express-4.18.2.tgz"
   integrity sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfz1aUwU9vHZ+J7gyvwdQXFEBIEIaxeGf0GIcreATNyBExtalisDbuMqQ==
@@ -6812,7 +6873,7 @@ got@^9.6.0:
     to-readable-stream "^1.0.0"
     url-parse-lax "^3.0.0"
 
-graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9:
+graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.3, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4, graceful-fs@^4.2.6, graceful-fs@^4.2.9:
   version "4.2.11"
   resolved "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz"
   integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==
@@ -7534,6 +7595,11 @@ is-potential-custom-element-name@^1.0.1:
   resolved "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz"
   integrity sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==
 
+is-promise@^2.1.0:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.2.2.tgz#39ab959ccbf9a774cf079f7b40c7a26f763135f1"
+  integrity sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==
+
 is-stream@^1.1.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz"
@@ -8187,6 +8253,11 @@ jest@^27.0.5, jest@^27.1.0:
     import-local "^3.0.2"
     jest-cli "^27.5.1"
 
+jju@^1.1.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/jju/-/jju-1.4.0.tgz#a3abe2718af241a2b2904f84a625970f389ae32a"
+  integrity sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA==
+
 joi@^17.4.0:
   version "17.9.2"
   resolved "https://registry.npmjs.org/joi/-/joi-17.9.2.tgz"
@@ -8333,6 +8404,13 @@ json-parse-even-better-errors@^2.3.0, json-parse-even-better-errors@^2.3.1:
   resolved "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz"
   integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
 
+json-parse-helpfulerror@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz#13f14ce02eed4e981297b64eb9e3b932e2dd13dc"
+  integrity sha512-XgP0FGR77+QhUxjXkwOMkC94k3WtqEBfcnjWqhRd82qTat4SWKRE+9kUnynz/shm3I4ea2+qISvTIeGTNU7kJg==
+  dependencies:
+    jju "^1.1.0"
+
 json-schema-traverse@^0.4.1:
   version "0.4.1"
   resolved "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz"
@@ -8348,6 +8426,31 @@ json-schema@0.4.0:
   resolved "https://registry.npmjs.org/json-schema/-/json-schema-0.4.0.tgz"
   integrity sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA==
 
+json-server@^0.17.4:
+  version "0.17.4"
+  resolved "https://registry.yarnpkg.com/json-server/-/json-server-0.17.4.tgz#d4ef25a516e26d9ba86fd6db2f9d81a5f405421e"
+  integrity sha512-bGBb0WtFuAKbgI7JV3A864irWnMZSvBYRJbohaOuatHwKSRFUfqtQlrYMrB6WbalXy/cJabyjlb7JkHli6dYjQ==
+  dependencies:
+    body-parser "^1.19.0"
+    chalk "^4.1.2"
+    compression "^1.7.4"
+    connect-pause "^0.1.1"
+    cors "^2.8.5"
+    errorhandler "^1.5.1"
+    express "^4.17.1"
+    express-urlrewrite "^1.4.0"
+    json-parse-helpfulerror "^1.0.3"
+    lodash "^4.17.21"
+    lodash-id "^0.14.1"
+    lowdb "^1.0.0"
+    method-override "^3.0.0"
+    morgan "^1.10.0"
+    nanoid "^3.1.23"
+    please-upgrade-node "^3.2.0"
+    pluralize "^8.0.0"
+    server-destroy "^1.0.1"
+    yargs "^17.0.1"
+
 json-stable-stringify-without-jsonify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz"
@@ -8571,6 +8674,11 @@ locate-path@^5.0.0:
   dependencies:
     p-locate "^4.1.0"
 
+lodash-id@^0.14.1:
+  version "0.14.1"
+  resolved "https://registry.yarnpkg.com/lodash-id/-/lodash-id-0.14.1.tgz#dffa1f1f8b90d1803bb0d70b7d7547e10751e80b"
+  integrity sha512-ikQPBTiq/d5m6dfKQlFdIXFzvThPi2Be9/AHxktOnDSfSxE1j9ICbBT5Elk1ke7HSTgM38LHTpmJovo9/klnLg==
+
 lodash.debounce@^4.0.8:
   version "4.0.8"
   resolved "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz"
@@ -8621,7 +8729,7 @@ lodash.uniq@^4.5.0:
   resolved "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz"
   integrity sha512-xfBaXQd9ryd9dlSDvnvI0lvxfLJlYAZzXomUYzLKtUeOQvOP5piqAWuGtrhWeqaXK9hhoM/iyJc5AV+XfsX3HQ==
 
-lodash@^4.17.10, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.7.0:
+lodash@4, lodash@^4.17.10, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.7.0:
   version "4.17.21"
   resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@@ -8650,6 +8758,17 @@ log-update@^2.3.0:
     cli-cursor "^2.0.0"
     wrap-ansi "^3.0.1"
 
+lowdb@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/lowdb/-/lowdb-1.0.0.tgz#5243be6b22786ccce30e50c9a33eac36b20c8064"
+  integrity sha512-2+x8esE/Wb9SQ1F9IHaYWfsC9FIecLOPrK4g17FGEayjUWH172H6nwicRovGvSE2CPZouc2MCIqCI7h9d+GftQ==
+  dependencies:
+    graceful-fs "^4.1.3"
+    is-promise "^2.1.0"
+    lodash "4"
+    pify "^3.0.0"
+    steno "^0.4.1"
+
 lower-case@^2.0.2:
   version "2.0.2"
   resolved "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz"
@@ -8816,6 +8935,16 @@ merge2@^1.3.0, merge2@^1.4.1:
   resolved "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz"
   integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
 
+method-override@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/method-override/-/method-override-3.0.0.tgz#6ab0d5d574e3208f15b0c9cf45ab52000468d7a2"
+  integrity sha512-IJ2NNN/mSl9w3kzWB92rcdHpz+HjkxhDJWNDBqSlas+zQdP8wBiJzITPg08M/k2uVvMow7Sk41atndNtt/PHSA==
+  dependencies:
+    debug "3.1.0"
+    methods "~1.1.2"
+    parseurl "~1.3.2"
+    vary "~1.1.2"
+
 methods@~1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz"
@@ -9023,6 +9152,17 @@ module-alias@^2.2.2:
   resolved "https://registry.npmjs.org/module-alias/-/module-alias-2.2.3.tgz"
   integrity sha512-23g5BFj4zdQL/b6tor7Ji+QY4pEfNH784BMslY9Qb0UnJWRAt+lQGLYmRaM0KDBwIG23ffEBELhZDP2rhi9f/Q==
 
+morgan@^1.10.0:
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.10.0.tgz#091778abc1fc47cd3509824653dae1faab6b17d7"
+  integrity sha512-AbegBVI4sh6El+1gNwvD5YIck7nSA36weD7xvIxG4in80j/UoK8AEGaWnnz8v1GxonMCltmlNs5ZKbGvl9b1XQ==
+  dependencies:
+    basic-auth "~2.0.1"
+    debug "2.6.9"
+    depd "~2.0.0"
+    on-finished "~2.3.0"
+    on-headers "~1.0.2"
+
 move-concurrently@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz"
@@ -9077,6 +9217,11 @@ nan@^2.12.1, nan@^2.17.0:
   resolved "https://registry.npmjs.org/nan/-/nan-2.17.0.tgz"
   integrity sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ==
 
+nanoid@^3.1.23:
+  version "3.3.7"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.7.tgz#d0c301a691bc8d54efa0a2226ccf3fe2fd656bd8"
+  integrity sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==
+
 nanoid@^3.3.6:
   version "3.3.6"
   resolved "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz"
@@ -9338,7 +9483,7 @@ oauth-sign@~0.9.0:
   resolved "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.9.0.tgz"
   integrity sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==
 
-object-assign@^4.0.1, object-assign@^4.1.1:
+object-assign@^4, object-assign@^4.0.1, object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
   integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==
@@ -9406,6 +9551,13 @@ on-finished@2.4.1:
   dependencies:
     ee-first "1.1.1"
 
+on-finished@~2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/on-finished/-/on-finished-2.3.0.tgz#20f1336481b083cd75337992a16971aa2d906947"
+  integrity sha512-ikqdkGAAyf/X/gPhXGvfgAytDZtDbr+bkNUJ0N9h5MI/dmdgCs3l6hoHrcUv41sRKew3jIwrp4qQDXiK99Utww==
+  dependencies:
+    ee-first "1.1.1"
+
 on-headers@~1.0.2:
   version "1.0.2"
   resolved "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz"
@@ -9737,7 +9889,7 @@ path-to-regexp@0.1.7:
   resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
   integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ==
 
-path-to-regexp@^1.7.0:
+path-to-regexp@^1.0.3, path-to-regexp@^1.7.0:
   version "1.8.0"
   resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz"
   integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==
@@ -9814,6 +9966,13 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0:
   dependencies:
     find-up "^4.0.0"
 
+please-upgrade-node@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz#aeddd3f994c933e4ad98b99d9a556efa0e2fe942"
+  integrity sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==
+  dependencies:
+    semver-compare "^1.0.0"
+
 plist@^3.0.1, plist@^3.0.4:
   version "3.0.6"
   resolved "https://registry.npmjs.org/plist/-/plist-3.0.6.tgz"
@@ -9822,6 +9981,11 @@ plist@^3.0.1, plist@^3.0.4:
     base64-js "^1.5.1"
     xmlbuilder "^15.1.1"
 
+pluralize@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-8.0.0.tgz#1a6fa16a38d12a1901e0320fa017051c539ce3b1"
+  integrity sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==
+
 pn@^1.1.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/pn/-/pn-1.1.0.tgz"
@@ -10483,6 +10647,16 @@ raw-body@2.5.1:
     iconv-lite "0.4.24"
     unpipe "1.0.0"
 
+raw-body@2.5.2:
+  version "2.5.2"
+  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.5.2.tgz#99febd83b90e08975087e8f1f9419a149366b68a"
+  integrity sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==
+  dependencies:
+    bytes "3.1.2"
+    http-errors "2.0.0"
+    iconv-lite "0.4.24"
+    unpipe "1.0.0"
+
 react-is@^17.0.1:
   version "17.0.2"
   resolved "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz"
@@ -11059,6 +11233,11 @@ serve-static@1.15.0:
     parseurl "~1.3.3"
     send "0.18.0"
 
+server-destroy@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/server-destroy/-/server-destroy-1.0.1.tgz#f13bf928e42b9c3e79383e61cc3998b5d14e6cdd"
+  integrity sha512-rb+9B5YBIEzYcD6x2VKidaa+cqYBJQKnU4oe4E3ANwRRN56yk/ua1YCJT1n21NTS8w6CcOclAKNP3PhdCXKYtQ==
+
 servie@^4.3.3:
   version "4.3.3"
   resolved "https://registry.npmjs.org/servie/-/servie-4.3.3.tgz"
@@ -11505,6 +11684,13 @@ stealthy-require@^1.1.1:
   resolved "https://registry.npmjs.org/stealthy-require/-/stealthy-require-1.1.1.tgz"
   integrity sha512-ZnWpYnYugiOVEY5GkcuJK1io5V8QmNYChG62gSit9pQVGErXtrKuPC55ITaVSukmMta5qpMU7vqLt2Lnni4f/g==
 
+steno@^0.4.1:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/steno/-/steno-0.4.4.tgz#071105bdfc286e6615c0403c27e9d7b5dcb855cb"
+  integrity sha512-EEHMVYHNXFHfGtgjNITnka0aHhiAlo93F7z2/Pwd+g0teG9CnM3JIINM7hVVB5/rhw9voufD7Wukwgtw2uqh6w==
+  dependencies:
+    graceful-fs "^4.1.3"
+
 stream-browserify@^2.0.1:
   version "2.0.2"
   resolved "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.2.tgz"
@@ -12440,7 +12626,7 @@ validate-npm-package-license@^3.0.1:
     spdx-correct "^3.0.0"
     spdx-expression-parse "^3.0.0"
 
-vary@~1.1.2:
+vary@^1, vary@~1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz"
   integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==
@@ -13209,7 +13395,7 @@ yargs@^16.0.0, yargs@^16.2.0:
     y18n "^5.0.5"
     yargs-parser "^20.2.2"
 
-yargs@^17.5.1:
+yargs@^17.0.1, yargs@^17.5.1:
   version "17.7.2"
   resolved "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz"
   integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==

From b09abcc1fa77ed6d6448f1050a131959404cd1c1 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Thu, 7 Dec 2023 18:06:35 +0200
Subject: [PATCH 02/41] refactored getConfig, getCredentials, loggedInServices
 moved to computed

---
 db-rest-mock.json                             | 185 ++++++++++++++++++
 .../storage-options/localJsonDbService.js     |  12 ++
 .../storage-options/restApiService.js         |  10 +
 src/services/storageInterface.js              |   8 +
 src/services/storageService.js                |   8 +
 src/views/HomeView.vue                        |  33 ++--
 6 files changed, 234 insertions(+), 22 deletions(-)

diff --git a/db-rest-mock.json b/db-rest-mock.json
index ff303aa5..9c9b2c9b 100644
--- a/db-rest-mock.json
+++ b/db-rest-mock.json
@@ -39,5 +39,190 @@
         }
       ]
     }
+  },
+  "config": {
+    "useLocal": true,
+    "apperance": "light",
+    "showIssue": false,
+    "appLabel": false,
+    "defaultColor": "#1976D2FF",
+    "commentType": "Comment",
+    "audioCapture": false,
+    "videoQuality": "high",
+    "debugMode": false,
+    "summary": false,
+    "ai": {
+      "enabled": false
+    },
+    "templates": [
+      {
+        "type": "Screenshot",
+        "precondition": {
+          "content": "",
+          "text": ""
+        },
+        "issue": "",
+        "isBug": false
+      },
+      {
+        "type": "Video",
+        "precondition": {
+          "content": "",
+          "text": ""
+        },
+        "issue": "",
+        "isBug": false
+      },
+      {
+        "type": "Audio",
+        "precondition": {
+          "content": "",
+          "text": ""
+        },
+        "issue": "",
+        "isBug": false
+      },
+      {
+        "type": "Note",
+        "precondition": {
+          "content": "",
+          "text": ""
+        },
+        "issue": "",
+        "isBug": false
+      },
+      {
+        "type": "File",
+        "precondition": {
+          "content": "",
+          "text": ""
+        },
+        "issue": "",
+        "isBug": false
+      },
+      {
+        "type": "Mindmap",
+        "precondition": {
+          "content": "",
+          "text": ""
+        },
+        "issue": "",
+        "isBug": false
+      }
+    ],
+    "checklist": {
+      "presession": {
+        "tasks": [],
+        "status": false
+      },
+      "postsession": {
+        "tasks": [],
+        "status": false
+      }
+    },
+    "hotkeys": {
+      "general": {
+        "cancel": ["ctrl", "c"],
+        "save": ["ctrl", "s"]
+      },
+      "home": {
+        "quickTest": ["ctrl", "q"],
+        "newExploratorySession": ["ctrl", "e"],
+        "openExploratorySession": ["ctrl", "o"]
+      },
+      "sessionPlanning": {
+        "title": ["ctrl", "t"],
+        "charter": ["ctrl", "h"],
+        "timeLimit": ["ctrl", "l"],
+        "preconditions": ["ctrl", "p"],
+        "checklist": ["ctrl", "e"],
+        "start": "general.save"
+      },
+      "workspace": {
+        "pause": ["ctrl", "p"],
+        "resume": "workspace.pause",
+        "stop": ["ctrl", "h"],
+        "videoStart": ["ctrl", "v"],
+        "videoStop": "workspace.videoStart",
+        "screenshot": ["ctrl", "r"],
+        "audioStart": ["ctrl", "a"],
+        "audioStop": "workspace.audioStart",
+        "note": ["ctrl", "n"],
+        "mindmap": ["ctrl", "m"],
+        "changeSource": ["ctrl", "o"],
+        "createIssue": ["ctrl", "i"],
+        "back": ["ctrl", "b"]
+      },
+      "evidence": {
+        "name": ["ctrl", "n"],
+        "followUp": ["ctrl", "f"],
+        "comment": ["ctrl", "d"],
+        "tags": ["ctrl", "t"],
+        "type": ["ctrl", "y"],
+        "save": "general.save",
+        "cancel": "general.cancel"
+      }
+    }
+  },
+  "credentials": {
+    "yatt": [
+      {
+        "accessToken": "yatt_3126963554960277506.4795fc30c1abddad599cbadfdf5ce790",
+        "expiresAt": "2024-03-04T04:26:06.000Z",
+        "type": "bearer",
+        "loggedInAt": "2023-12-05 06:26:06",
+        "oauthTokenIds": [
+          "c765843a-02d0-46d1-a164-fb76d2835180",
+          "fb256eff-b145-435e-a664-80b00d63a892"
+        ],
+        "user": {
+          "id": "66fbcc54-9326-11ee-8407-4201ac166005",
+          "email": "isntlazy@gmail.com",
+          "name": "Oleh Korniichuk",
+          "avatar": null
+        },
+        "orgs": []
+      }
+    ],
+    "jira": [
+      {
+        "accessToken": "eyJraWQiOiJmZTM2ZThkMzZjMTA2N2RjYTgyNTg5MmEiLCJhbGciOiJSUzI1NiJ9.eyJqdGkiOiIzNTE2NTg1Zi1lMzE1LTRkYzYtYTgzYS1jMjJlYmIyMzVkMjIiLCJzdWIiOiI1NTcwNTg6NWRiZDM2NjUtMWQwYS00Yzg4LWJlZjEtYWM4MGE0ZDY3MTVhIiwibmJmIjoxNzAxOTYyMjU5LCJpc3MiOiJodHRwczovL2F1dGguYXRsYXNzaWFuLmNvbSIsImlhdCI6MTcwMTk2MjI1OSwiZXhwIjoxNzAxOTY1ODU5LCJhdWQiOiIzdFBJNnkzVWdPeGpVVVZkMkVMTDNtaFpyNmNHQWF0dCIsImNsaWVudF9pZCI6IjN0UEk2eTNVZ094alVVVmQyRUxMM21oWnI2Y0dBYXR0IiwiaHR0cHM6Ly9pZC5hdGxhc3NpYW4uY29tL3J0aSI6ImRiNTRiMjJkLWEzMDItNDQzMi04NGQwLTY0ZTE5YWFmNWJmZSIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS9hdGxfdG9rZW5fdHlwZSI6IkFDQ0VTUyIsImh0dHBzOi8vYXRsYXNzaWFuLmNvbS9zeXN0ZW1BY2NvdW50SWQiOiI2MzhlNmI4OGZkZTA2NGVkYTJmMjBiYzgiLCJodHRwczovL2F0bGFzc2lhbi5jb20vZmlyc3RQYXJ0eSI6ZmFsc2UsImh0dHBzOi8vYXRsYXNzaWFuLmNvbS92ZXJpZmllZCI6dHJ1ZSwidmVyaWZpZWQiOiJ0cnVlIiwiaHR0cHM6Ly9pZC5hdGxhc3NpYW4uY29tL3JlZnJlc2hfY2hhaW5faWQiOiIzdFBJNnkzVWdPeGpVVVZkMkVMTDNtaFpyNmNHQWF0dC01NTcwNTg6NWRiZDM2NjUtMWQwYS00Yzg4LWJlZjEtYWM4MGE0ZDY3MTVhLTlkMWY5YjBmLTJkODAtNDEyMy1iMmIzLTEwYTQ3YTBmMzI1MSIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS9wcm9jZXNzUmVnaW9uIjoidXMtZWFzdC0xIiwiaHR0cHM6Ly9hdGxhc3NpYW4uY29tL29hdXRoQ2xpZW50SWQiOiIzdFBJNnkzVWdPeGpVVVZkMkVMTDNtaFpyNmNHQWF0dCIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS91anQiOiI4ZDI1NjE1Ni01MGIwLTQ2MGUtOTc2OS01MjhiNzc3YjY5N2QiLCJodHRwczovL2F0bGFzc2lhbi5jb20vc3lzdGVtQWNjb3VudEVtYWlsIjoiZmRkMmNlOTUtYmJjYy00YTMxLTg2N2ItYTM5ZDM4NzdkMTAzQGNvbm5lY3QuYXRsYXNzaWFuLmNvbSIsImh0dHBzOi8vYXRsYXNzaWFuLmNvbS9lbWFpbERvbWFpbiI6ImdtYWlsLmNvbSIsInNjb3BlIjoib2ZmbGluZV9hY2Nlc3MgcmVhZDpqaXJhLXdvcmsgcmVhZDptZSB3cml0ZTpqaXJhLXdvcmsiLCJodHRwczovL2F0bGFzc2lhbi5jb20vM2xvIjp0cnVlLCJodHRwczovL2lkLmF0bGFzc2lhbi5jb20vc2Vzc2lvbl9pZCI6ImE3NjQ0OGM3LWQyZmItNGQ0MC1iOGRmLTExZmVmZGYyZmU2ZiIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS92ZXJpZmllZCI6dHJ1ZSwiaHR0cHM6Ly9hdGxhc3NpYW4uY29tL3N5c3RlbUFjY291bnRFbWFpbERvbWFpbiI6ImNvbm5lY3QuYXRsYXNzaWFuLmNvbSJ9.ctuHT1qSF861ZOklPigESgagFGHfw_BwEvcDd7NEwFY7kfIKMX56k_8gdjYGb-WUas8pYh4yKPIgxExhx-E8c9SLLCdoU4VIIikipDI2T0uNvLJdR5OfyiobCqKxj5Y19uOrvggLGKpCNpOVf4-r5bd9J_kvK-2QWSulrYwbJpENFdk1Dc7C4ExmxYfVzSyPAVo3FIVN3BtG3IcUFFGM7QgMuU5PIS2MWykuRU2834XV2WYko4nTMwpQqirrNcZ1RoJhEYq95S_ZpbZ7J0X46hmHU1YewVSWK-zM0hkdIMjMJIQDyodUERxZZ5wbLvF2vxdpDHoTNaGawOIG7ASEww",
+        "yattOauthTokenId": "fb256eff-b145-435e-a664-80b00d63a892",
+        "expiresAt": "2023-12-07T16:17:39.000Z",
+        "type": "oauth",
+        "loggedInAt": "2023-12-05 06:26:25",
+        "lastRefreshed": "2023-12-07 17:24:53",
+        "user": {
+          "id": "557058:5dbd3665-1d0a-4c88-bef1-ac80a4d6715a",
+          "email": "isntlazy@gmail.com",
+          "name": "Oleh Korniichuk",
+          "avatar": "https://avatar-management--avatars.us-west-2.prod.public.atl-paas.net/557058:5dbd3665-1d0a-4c88-bef1-ac80a4d6715a/77bc4e72-5783-4a01-8a1a-cb033a7b5e18/128",
+          "locale": "uk",
+          "account_type": "atlassian",
+          "verified": true
+        },
+        "orgs": [
+          {
+            "id": "c06fde6c-a38f-4de2-a7d7-afde9b0edde1",
+            "url": "https://kodt.atlassian.net",
+            "name": "kodt",
+            "avatar": "https://site-admin-avatar-cdn.prod.public.atl-paas.net/avatars/240/globe.png"
+          }
+        ]
+      }
+    ],
+    "testrail": [
+      {
+        "accessToken": "aXNudGxhenlAZ21haWwuY29tOmdvaXlMVFJhNXB1bUEwNmdaNXo3LTYwSVhkV0RWUmh6MFZCNWJBV2NN",
+        "type": "basic",
+        "loggedInAt": "2023-12-06 14:57:29",
+        "user": {
+          "id": 1,
+          "email": "isntlazy@gmail.com",
+          "name": "Oleh Korniichuk"
+        },
+        "url": "isntlazy.testrail.io"
+      }
+    ]
   }
 }
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index 71020961..95fd2501 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -11,4 +11,16 @@ export default class LocalJsonDbService extends StorageInterface {
   async setState(state) {
     console.log(state);
   }
+
+  async getConfig() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_CONFIG,
+    });
+  }
+
+  async getCredentials() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_CREDENTIALS,
+    });
+  }
 }
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index 31cd5983..e2c9c848 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -11,4 +11,14 @@ export default class RestApiService extends StorageInterface {
     console.log(value);
     // saving state endpoint here
   }
+
+  async getConfig() {
+    const response = await axios.get(`http://localhost:3000/config`);
+    return response.data;
+  }
+
+  async getCredentials() {
+    const response = await axios.get(`http://localhost:3000/credentials`);
+    return response.data;
+  }
 }
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
index 35ef08a9..93eb3587 100644
--- a/src/services/storageInterface.js
+++ b/src/services/storageInterface.js
@@ -7,4 +7,12 @@ export default class StorageInterface {
   async setState(state) {
     throw new Error("Method 'setState()' must be implemented.");
   }
+
+  async getConfig() {
+    throw new Error("Method 'getConfig()' must be implemented.");
+  }
+
+  async getCredentials() {
+    throw new Error("Method 'getCredentials()' must be implemented.");
+  }
 }
diff --git a/src/services/storageService.js b/src/services/storageService.js
index 0f235ed3..90c12e4e 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -15,4 +15,12 @@ export default class StorageService {
   async setState(state) {
     return this.storage.setState(state);
   }
+
+  async getConfig() {
+    return await this.storage.getConfig();
+  }
+
+  async getCredentials() {
+    return await this.storage.getCredentials();
+  }
 }
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index a313d598..44942ce2 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -192,11 +192,17 @@ export default {
       config: {},
       credentials: {},
       checkAuth: this.isAuthenticated,
-      loggedInServices: {},
       showMenu: false,
     };
   },
   computed: {
+    loggedInServices() {
+      const services = {};
+      for (const credentialType of Object.keys(this.credentials)) {
+        services[credentialType] = this.credentials[credentialType].length > 0;
+      }
+      return services;
+    },
     quickTestHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "home.quickTest",
@@ -237,28 +243,11 @@ export default {
     });
   },
   methods: {
-    getConfig() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CONFIG })
-        .then((result) => {
-          this.config = result;
-        });
+    async getConfig() {
+      this.config = await this.$storageService.getConfig();
     },
-    getCredentials() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CREDENTIALS })
-        .then((result) => {
-          this.credentials = result;
-          for (const credentialType of Object.keys(this.credentials)) {
-            if (this.credentials[credentialType].length > 0) {
-              this.loggedInServices[credentialType] = true;
-            }
-          }
-        });
+    async getCredentials() {
+      this.credentials = await this.$storageService.getCredentials();
     },
     async newSession() {
       if (this.$router.history.current.path === "/") {

From 8af311e1676f65b3d2bed67c28b987849f1f9d9b Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Thu, 7 Dec 2023 18:10:51 +0200
Subject: [PATCH 03/41] added mock to gitignore

---
 .gitignore | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.gitignore b/.gitignore
index be192168..49ebf388 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,7 @@
 .DS_Store
 node_modules
 /dist
+db-rest-mock.json
 
 
 # local env files

From 55c3cdccce49033f8e38993e3db101509e1fcde2 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Thu, 7 Dec 2023 18:16:39 +0200
Subject: [PATCH 04/41] Remove db-rest-mock.json from tracking

---
 db-rest-mock.json | 228 ----------------------------------------------
 1 file changed, 228 deletions(-)
 delete mode 100644 db-rest-mock.json

diff --git a/db-rest-mock.json b/db-rest-mock.json
deleted file mode 100644
index 9c9b2c9b..00000000
--- a/db-rest-mock.json
+++ /dev/null
@@ -1,228 +0,0 @@
-{
-  "state": {
-    "title": "",
-    "charter": {
-      "content": "",
-      "text": ""
-    },
-    "preconditions": {
-      "content": "",
-      "text": ""
-    },
-    "duration": 0,
-    "status": "start",
-    "timer": 2998,
-    "started": "16:12 | 12-06-2023",
-    "ended": "",
-    "quickTest": true,
-    "path": "/",
-    "mindmap": {
-      "nodes": [
-        {
-          "id": "5e274797-4db7-4fe8-a983-8b8abf8771c5",
-          "text": "System Under Test",
-          "url": "https://features.yattie.ai",
-          "fx": -210.9125181819311,
-          "fy": -583.1010883631283
-        },
-        {
-          "id": "4763495c-62b7-4625-9083-2d40045b6550",
-          "text": "Feature #1",
-          "fx": 99.1983655368465,
-          "fy": -582.6407249084972
-        }
-      ],
-      "connections": [
-        {
-          "source": "5e274797-4db7-4fe8-a983-8b8abf8771c5",
-          "target": "4763495c-62b7-4625-9083-2d40045b6550"
-        }
-      ]
-    }
-  },
-  "config": {
-    "useLocal": true,
-    "apperance": "light",
-    "showIssue": false,
-    "appLabel": false,
-    "defaultColor": "#1976D2FF",
-    "commentType": "Comment",
-    "audioCapture": false,
-    "videoQuality": "high",
-    "debugMode": false,
-    "summary": false,
-    "ai": {
-      "enabled": false
-    },
-    "templates": [
-      {
-        "type": "Screenshot",
-        "precondition": {
-          "content": "",
-          "text": ""
-        },
-        "issue": "",
-        "isBug": false
-      },
-      {
-        "type": "Video",
-        "precondition": {
-          "content": "",
-          "text": ""
-        },
-        "issue": "",
-        "isBug": false
-      },
-      {
-        "type": "Audio",
-        "precondition": {
-          "content": "",
-          "text": ""
-        },
-        "issue": "",
-        "isBug": false
-      },
-      {
-        "type": "Note",
-        "precondition": {
-          "content": "",
-          "text": ""
-        },
-        "issue": "",
-        "isBug": false
-      },
-      {
-        "type": "File",
-        "precondition": {
-          "content": "",
-          "text": ""
-        },
-        "issue": "",
-        "isBug": false
-      },
-      {
-        "type": "Mindmap",
-        "precondition": {
-          "content": "",
-          "text": ""
-        },
-        "issue": "",
-        "isBug": false
-      }
-    ],
-    "checklist": {
-      "presession": {
-        "tasks": [],
-        "status": false
-      },
-      "postsession": {
-        "tasks": [],
-        "status": false
-      }
-    },
-    "hotkeys": {
-      "general": {
-        "cancel": ["ctrl", "c"],
-        "save": ["ctrl", "s"]
-      },
-      "home": {
-        "quickTest": ["ctrl", "q"],
-        "newExploratorySession": ["ctrl", "e"],
-        "openExploratorySession": ["ctrl", "o"]
-      },
-      "sessionPlanning": {
-        "title": ["ctrl", "t"],
-        "charter": ["ctrl", "h"],
-        "timeLimit": ["ctrl", "l"],
-        "preconditions": ["ctrl", "p"],
-        "checklist": ["ctrl", "e"],
-        "start": "general.save"
-      },
-      "workspace": {
-        "pause": ["ctrl", "p"],
-        "resume": "workspace.pause",
-        "stop": ["ctrl", "h"],
-        "videoStart": ["ctrl", "v"],
-        "videoStop": "workspace.videoStart",
-        "screenshot": ["ctrl", "r"],
-        "audioStart": ["ctrl", "a"],
-        "audioStop": "workspace.audioStart",
-        "note": ["ctrl", "n"],
-        "mindmap": ["ctrl", "m"],
-        "changeSource": ["ctrl", "o"],
-        "createIssue": ["ctrl", "i"],
-        "back": ["ctrl", "b"]
-      },
-      "evidence": {
-        "name": ["ctrl", "n"],
-        "followUp": ["ctrl", "f"],
-        "comment": ["ctrl", "d"],
-        "tags": ["ctrl", "t"],
-        "type": ["ctrl", "y"],
-        "save": "general.save",
-        "cancel": "general.cancel"
-      }
-    }
-  },
-  "credentials": {
-    "yatt": [
-      {
-        "accessToken": "yatt_3126963554960277506.4795fc30c1abddad599cbadfdf5ce790",
-        "expiresAt": "2024-03-04T04:26:06.000Z",
-        "type": "bearer",
-        "loggedInAt": "2023-12-05 06:26:06",
-        "oauthTokenIds": [
-          "c765843a-02d0-46d1-a164-fb76d2835180",
-          "fb256eff-b145-435e-a664-80b00d63a892"
-        ],
-        "user": {
-          "id": "66fbcc54-9326-11ee-8407-4201ac166005",
-          "email": "isntlazy@gmail.com",
-          "name": "Oleh Korniichuk",
-          "avatar": null
-        },
-        "orgs": []
-      }
-    ],
-    "jira": [
-      {
-        "accessToken": "eyJraWQiOiJmZTM2ZThkMzZjMTA2N2RjYTgyNTg5MmEiLCJhbGciOiJSUzI1NiJ9.eyJqdGkiOiIzNTE2NTg1Zi1lMzE1LTRkYzYtYTgzYS1jMjJlYmIyMzVkMjIiLCJzdWIiOiI1NTcwNTg6NWRiZDM2NjUtMWQwYS00Yzg4LWJlZjEtYWM4MGE0ZDY3MTVhIiwibmJmIjoxNzAxOTYyMjU5LCJpc3MiOiJodHRwczovL2F1dGguYXRsYXNzaWFuLmNvbSIsImlhdCI6MTcwMTk2MjI1OSwiZXhwIjoxNzAxOTY1ODU5LCJhdWQiOiIzdFBJNnkzVWdPeGpVVVZkMkVMTDNtaFpyNmNHQWF0dCIsImNsaWVudF9pZCI6IjN0UEk2eTNVZ094alVVVmQyRUxMM21oWnI2Y0dBYXR0IiwiaHR0cHM6Ly9pZC5hdGxhc3NpYW4uY29tL3J0aSI6ImRiNTRiMjJkLWEzMDItNDQzMi04NGQwLTY0ZTE5YWFmNWJmZSIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS9hdGxfdG9rZW5fdHlwZSI6IkFDQ0VTUyIsImh0dHBzOi8vYXRsYXNzaWFuLmNvbS9zeXN0ZW1BY2NvdW50SWQiOiI2MzhlNmI4OGZkZTA2NGVkYTJmMjBiYzgiLCJodHRwczovL2F0bGFzc2lhbi5jb20vZmlyc3RQYXJ0eSI6ZmFsc2UsImh0dHBzOi8vYXRsYXNzaWFuLmNvbS92ZXJpZmllZCI6dHJ1ZSwidmVyaWZpZWQiOiJ0cnVlIiwiaHR0cHM6Ly9pZC5hdGxhc3NpYW4uY29tL3JlZnJlc2hfY2hhaW5faWQiOiIzdFBJNnkzVWdPeGpVVVZkMkVMTDNtaFpyNmNHQWF0dC01NTcwNTg6NWRiZDM2NjUtMWQwYS00Yzg4LWJlZjEtYWM4MGE0ZDY3MTVhLTlkMWY5YjBmLTJkODAtNDEyMy1iMmIzLTEwYTQ3YTBmMzI1MSIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS9wcm9jZXNzUmVnaW9uIjoidXMtZWFzdC0xIiwiaHR0cHM6Ly9hdGxhc3NpYW4uY29tL29hdXRoQ2xpZW50SWQiOiIzdFBJNnkzVWdPeGpVVVZkMkVMTDNtaFpyNmNHQWF0dCIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS91anQiOiI4ZDI1NjE1Ni01MGIwLTQ2MGUtOTc2OS01MjhiNzc3YjY5N2QiLCJodHRwczovL2F0bGFzc2lhbi5jb20vc3lzdGVtQWNjb3VudEVtYWlsIjoiZmRkMmNlOTUtYmJjYy00YTMxLTg2N2ItYTM5ZDM4NzdkMTAzQGNvbm5lY3QuYXRsYXNzaWFuLmNvbSIsImh0dHBzOi8vYXRsYXNzaWFuLmNvbS9lbWFpbERvbWFpbiI6ImdtYWlsLmNvbSIsInNjb3BlIjoib2ZmbGluZV9hY2Nlc3MgcmVhZDpqaXJhLXdvcmsgcmVhZDptZSB3cml0ZTpqaXJhLXdvcmsiLCJodHRwczovL2F0bGFzc2lhbi5jb20vM2xvIjp0cnVlLCJodHRwczovL2lkLmF0bGFzc2lhbi5jb20vc2Vzc2lvbl9pZCI6ImE3NjQ0OGM3LWQyZmItNGQ0MC1iOGRmLTExZmVmZGYyZmU2ZiIsImh0dHBzOi8vaWQuYXRsYXNzaWFuLmNvbS92ZXJpZmllZCI6dHJ1ZSwiaHR0cHM6Ly9hdGxhc3NpYW4uY29tL3N5c3RlbUFjY291bnRFbWFpbERvbWFpbiI6ImNvbm5lY3QuYXRsYXNzaWFuLmNvbSJ9.ctuHT1qSF861ZOklPigESgagFGHfw_BwEvcDd7NEwFY7kfIKMX56k_8gdjYGb-WUas8pYh4yKPIgxExhx-E8c9SLLCdoU4VIIikipDI2T0uNvLJdR5OfyiobCqKxj5Y19uOrvggLGKpCNpOVf4-r5bd9J_kvK-2QWSulrYwbJpENFdk1Dc7C4ExmxYfVzSyPAVo3FIVN3BtG3IcUFFGM7QgMuU5PIS2MWykuRU2834XV2WYko4nTMwpQqirrNcZ1RoJhEYq95S_ZpbZ7J0X46hmHU1YewVSWK-zM0hkdIMjMJIQDyodUERxZZ5wbLvF2vxdpDHoTNaGawOIG7ASEww",
-        "yattOauthTokenId": "fb256eff-b145-435e-a664-80b00d63a892",
-        "expiresAt": "2023-12-07T16:17:39.000Z",
-        "type": "oauth",
-        "loggedInAt": "2023-12-05 06:26:25",
-        "lastRefreshed": "2023-12-07 17:24:53",
-        "user": {
-          "id": "557058:5dbd3665-1d0a-4c88-bef1-ac80a4d6715a",
-          "email": "isntlazy@gmail.com",
-          "name": "Oleh Korniichuk",
-          "avatar": "https://avatar-management--avatars.us-west-2.prod.public.atl-paas.net/557058:5dbd3665-1d0a-4c88-bef1-ac80a4d6715a/77bc4e72-5783-4a01-8a1a-cb033a7b5e18/128",
-          "locale": "uk",
-          "account_type": "atlassian",
-          "verified": true
-        },
-        "orgs": [
-          {
-            "id": "c06fde6c-a38f-4de2-a7d7-afde9b0edde1",
-            "url": "https://kodt.atlassian.net",
-            "name": "kodt",
-            "avatar": "https://site-admin-avatar-cdn.prod.public.atl-paas.net/avatars/240/globe.png"
-          }
-        ]
-      }
-    ],
-    "testrail": [
-      {
-        "accessToken": "aXNudGxhenlAZ21haWwuY29tOmdvaXlMVFJhNXB1bUEwNmdaNXo3LTYwSVhkV0RWUmh6MFZCNWJBV2NN",
-        "type": "basic",
-        "loggedInAt": "2023-12-06 14:57:29",
-        "user": {
-          "id": 1,
-          "email": "isntlazy@gmail.com",
-          "name": "Oleh Korniichuk"
-        },
-        "url": "isntlazy.testrail.io"
-      }
-    ]
-  }
-}

From 5d088137a51c58af8c8c1c16e3455d59e7009a29 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 8 Dec 2023 10:12:39 +0200
Subject: [PATCH 05/41] moving config to the store level, creating one source
 of truth for it to avoid multiple requests

---
 src/App.vue                            |  4 ++
 src/components/dialogs/AboutDialog.vue | 16 +----
 src/layouts/Default.vue                | 20 +-----
 src/services/electronService.js        |  6 ++
 src/store/index.js                     | 98 +++++++++++---------------
 src/store/modules/auth.js              |  9 +++
 src/store/modules/config.js            | 25 +++++++
 src/views/HomeView.vue                 | 30 +++-----
 8 files changed, 98 insertions(+), 110 deletions(-)
 create mode 100644 src/store/modules/auth.js
 create mode 100644 src/store/modules/config.js

diff --git a/src/App.vue b/src/App.vue
index 0346450e..cba3270d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -32,6 +32,10 @@ export default {
       }
     }
   },
+  async created() {
+    const config = await this.$storageService.getConfig();
+    this.$store.commit("config/setFullConfig", config);
+  },
 };
 </script>
 <style scoped>
diff --git a/src/components/dialogs/AboutDialog.vue b/src/components/dialogs/AboutDialog.vue
index 049bc860..e0284304 100644
--- a/src/components/dialogs/AboutDialog.vue
+++ b/src/components/dialogs/AboutDialog.vue
@@ -64,26 +64,12 @@ export default {
       type: String,
       default: () => "",
     },
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  data() {
-    return {
-      config: this.configItem,
-    };
-  },
-  watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
   },
   computed: {
     closeHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "general.cancel",
-        this.config.hotkeys
+        this.$store.getters["config/hotkeys"]
       );
     },
     currentTheme() {
diff --git a/src/layouts/Default.vue b/src/layouts/Default.vue
index f3091d9e..8dd0142c 100644
--- a/src/layouts/Default.vue
+++ b/src/layouts/Default.vue
@@ -16,11 +16,7 @@
           </v-btn>
         </template>
       </v-snackbar>
-      <AboutDialog
-        v-model="aboutDialog"
-        :version="aboutVersion"
-        :configItem="config"
-      />
+      <AboutDialog v-model="aboutDialog" :version="aboutVersion" />
     </v-main>
   </v-app>
 </template>
@@ -39,7 +35,6 @@ export default {
     aboutDialog: false,
     aboutVersion: null,
     overlay: false,
-    config: {},
     credentials: {},
     checkAuth: false,
     snackBar: {
@@ -48,7 +43,6 @@ export default {
     },
   }),
   created() {
-    this.getConfig();
     this.getCredentials().then(() => {
       this.updateAuth();
     });
@@ -130,10 +124,6 @@ export default {
       localStorage.setItem("isDarkMode", isDarkMode);
     });
 
-    window.ipc.on("CONFIG_CHANGE", () => {
-      this.getConfig();
-    });
-
     window.ipc.on("CREDENTIAL_CHANGE", () => {
       this.getCredentials();
     });
@@ -150,14 +140,6 @@ export default {
     openAboutDialog() {
       this.aboutDialog = true;
     },
-    getConfig() {
-      if (!window.ipc) return;
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CONFIG })
-        .then((result) => {
-          this.config = result;
-        });
-    },
     async setSnackBar(message) {
       this.snackBar.enabled = true;
       this.snackBar.message = message;
diff --git a/src/services/electronService.js b/src/services/electronService.js
index b582b921..801447a4 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -10,4 +10,10 @@ export default class ElectronService {
       },
     });
   }
+  updateState(state) {
+    window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.UPDATE_STATE,
+      data: state,
+    });
+  }
 }
diff --git a/src/store/index.js b/src/store/index.js
index ce50430c..ab1c2ee8 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -5,9 +5,9 @@ import {
   SESSION_STATUSES,
   DEFAULT_CHARTER_MAP_NODES,
   DEFAULT_CHARTER_MAP_CONNECTIONS,
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
 } from "../modules/constants";
+import { auth } from "@/store/modules/auth";
+import { config } from "@/store/modules/config";
 
 Vue.use(Vuex);
 
@@ -38,69 +38,60 @@ export default new Vuex.Store({
   mutations: {
     setTitle(state, payload) {
       state.title = payload;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setCharter(state, payload) {
       state.charter.content = payload.content;
       state.charter.text = payload.text;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setMindmap(state, payload) {
       state.mindmap.nodes = payload.nodes;
       state.mindmap.connections = payload.connections;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setPrecondition(state, payload) {
       state.preconditions.content = payload.content;
       state.preconditions.text = payload.text;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setDuration(state, payload) {
       state.duration = payload;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setStarted(state, payload) {
       state.started = payload;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setEnded(state, payload) {
       state.ended = payload;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setQuickTest(state, payload) {
       state.quickTest = payload;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     setPath(state, payload) {
       state.path = payload;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     updateSession(state, payload) {
       if (state.status !== payload.status) {
@@ -112,10 +103,9 @@ export default new Vuex.Store({
       if (state.duration !== payload.duration) {
         state.duration = payload.duration;
       }
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     clearState(state) {
       state.title = "";
@@ -139,10 +129,9 @@ export default new Vuex.Store({
       state.started = "";
       state.ended = "";
       state.quickTest = false;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     resetState(state) {
       state.duration = 0;
@@ -152,10 +141,9 @@ export default new Vuex.Store({
       state.started = "";
       state.ended = "";
       state.quickTest = false;
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_STATE,
-        data: state,
-      });
+      if (this.$isElectron) {
+        this.$electronService.updateState(state);
+      }
     },
     restoreState(state, payload) {
       state.title = payload.title;
@@ -175,14 +163,14 @@ export default new Vuex.Store({
       state.quickTest = payload.quickTest;
       state.path = payload.path;
       if (this.$isElectron) {
-        window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.UPDATE_STATE,
-          data: state,
-        });
+        this.$electronService.updateState(state);
       }
     },
   },
   actions: {},
-  modules: {},
+  modules: {
+    auth,
+    config,
+  },
   strict: process.env.NODE_ENV !== "production",
 });
diff --git a/src/store/modules/auth.js b/src/store/modules/auth.js
new file mode 100644
index 00000000..3de81a11
--- /dev/null
+++ b/src/store/modules/auth.js
@@ -0,0 +1,9 @@
+export const auth = {
+  namespaced: true,
+  state: () => ({
+    credentials: {},
+  }),
+  mutations: {},
+  actions: {},
+  getters: {},
+};
diff --git a/src/store/modules/config.js b/src/store/modules/config.js
new file mode 100644
index 00000000..80d2045a
--- /dev/null
+++ b/src/store/modules/config.js
@@ -0,0 +1,25 @@
+import Vue from "vue";
+export const config = {
+  namespaced: true,
+  state: () => ({}),
+  mutations: {
+    setFullConfig(state, payload) {
+      // Clear existing state properties
+      Object.keys(state).forEach((key) => {
+        Vue.delete(state, key);
+      });
+
+      // Add new properties from payload
+      Object.keys(payload).forEach((key) => {
+        Vue.set(state, key, payload[key]);
+      });
+    },
+  },
+  actions: {},
+  getters: {
+    fullConfig: (state) => {
+      return state;
+    },
+    hotkeys: (state) => state.hotkeys,
+  },
+};
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 44942ce2..14272bcc 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -168,6 +168,7 @@ import LogoWrapper from "../components/LogoWrapper.vue";
 import MenuPopover from "../components/MenuPopover.vue";
 
 import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { mapGetters } from "vuex";
 export default {
   name: "HomeView",
   components: {
@@ -189,13 +190,15 @@ export default {
   },
   data() {
     return {
-      config: {},
       credentials: {},
       checkAuth: this.isAuthenticated,
       showMenu: false,
     };
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+    }),
     loggedInServices() {
       const services = {};
       for (const credentialType of Object.keys(this.credentials)) {
@@ -204,54 +207,39 @@ export default {
       return services;
     },
     quickTestHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "home.quickTest",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("home.quickTest", this.hotkeys);
     },
     newExploratoryHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "home.newExploratorySession",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     openExploratoryHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "home.openExploratorySession",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
   },
   created() {
-    this.getConfig();
     this.getCredentials();
   },
   mounted() {
     if (!window.ipc) return;
 
-    window.ipc.on("CONFIG_CHANGE", () => {
-      this.getConfig();
-    });
-
-    window.ipc.on("CREDENTIAL_CHANGE", () => {
-      this.getCredentials();
-    });
-
     // New session
     window.ipc.on("NEW_SESSION", () => {
       this.newSession();
     });
   },
   methods: {
-    async getConfig() {
-      this.config = await this.$storageService.getConfig();
-    },
     async getCredentials() {
       this.credentials = await this.$storageService.getCredentials();
     },
     async newSession() {
       if (this.$router.history.current.path === "/") {
-        this.$router.push("/main");
+        await this.$router.push("/main");
       }
     },
     async openSession() {
@@ -272,7 +260,7 @@ export default {
 
         const currentPath = this.$router.history.current.path;
         if (currentPath !== state.path) {
-          this.$router.push({ path: state.path });
+          await this.$router.push({ path: state.path });
         }
       }
     },

From 8778d50025561ff9488ebfa6f4aecff8d7f27f1d Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 8 Dec 2023 12:22:15 +0200
Subject: [PATCH 06/41] refactoring, continue with the support of new structure
 step-by-step

---
 src/App.vue                     | 29 ++++++++++++
 src/components/MenuPopover.vue  | 31 ++++++-------
 src/layouts/Default.vue         | 39 ++--------------
 src/services/electronService.js |  6 +++
 src/store/modules/auth.js       | 22 ++++++++-
 src/views/HomeView.vue          | 80 +++++++++++----------------------
 6 files changed, 100 insertions(+), 107 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index cba3270d..ec2a9aa0 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -35,6 +35,35 @@ export default {
   async created() {
     const config = await this.$storageService.getConfig();
     this.$store.commit("config/setFullConfig", config);
+
+    const credentials = await this.$storageService.getCredentials();
+    this.$store.commit("auth/setCredentials", credentials);
+    if (this.$isElectron) {
+      // todo remove this check when $integrationHelpers will support REST API
+      await this.updateAuth();
+    }
+  },
+  methods: {
+    async updateAuth() {
+      if (
+        this.$store.getters["auth/credentials"] &&
+        Object.entries(this.$store.getters["auth/credentials"]).length > 0
+      ) {
+        let authCheckResponse = await this.$integrationHelpers.checkAuth(
+          this.$store.getters["auth/credentials"]
+        );
+        this.$store.commit("auth/setIsAuthenticated", authCheckResponse.authed);
+        if (authCheckResponse.failedAuth?.length > 0) {
+          // TODO - Prompt the user if they'd like to remove the failing cred
+          let message = "";
+          for (const failedCred of authCheckResponse.failedAuth) {
+            message += `${failedCred.credentialType} `;
+          }
+          message += this.$tc("message.integrations_expired", 1);
+          this.setSnackBar(message);
+        }
+      }
+    },
   },
 };
 </script>
diff --git a/src/components/MenuPopover.vue b/src/components/MenuPopover.vue
index 93d7c7bd..4abf4810 100644
--- a/src/components/MenuPopover.vue
+++ b/src/components/MenuPopover.vue
@@ -84,28 +84,21 @@
 <script>
 import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
 import uuidv4 from "uuid";
+import { mapGetters } from "vuex";
 
 export default {
   name: "MenuPopover",
   components: {},
-  props: {
-    credentialItems: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  watch: {
-    credentialItems: function (newValue) {
-      this.credentials = newValue;
-    },
-  },
+  props: {},
   data() {
     return {
-      credentials: this.credentialItems,
       showMenu: false,
     };
   },
   computed: {
+    ...mapGetters({
+      credentials: "auth/credentials",
+    }),
     profileAvatar() {
       for (const cList of Object.values(this.credentials)) {
         if (cList.length > 0) {
@@ -143,11 +136,15 @@ export default {
     },
     logout() {
       this.showMenu = false;
-      this.credentials = {};
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
-        data: this.credentials,
-      });
+      const emptyCredentials = {};
+      this.$store.commit("auth/setCredentials", emptyCredentials);
+
+      if (this.$isElectron) {
+        window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+          func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
+          data: emptyCredentials,
+        });
+      }
     },
   },
 };
diff --git a/src/layouts/Default.vue b/src/layouts/Default.vue
index 8dd0142c..2083bdbe 100644
--- a/src/layouts/Default.vue
+++ b/src/layouts/Default.vue
@@ -2,7 +2,7 @@
   <v-app :style="{ backgroundColor: currentTheme.background }">
     <v-main>
       <v-overlay :absolute="true" :value="overlay"> </v-overlay>
-      <router-view :isAuthenticated="checkAuth" />
+      <router-view :isAuthenticated="$store.getters['auth/isAuthenticated']" />
       <v-snackbar v-model="snackBar.enabled" timeout="3000">
         {{ snackBar.message }}
         <template v-slot:action="{ attrs }">
@@ -36,17 +36,11 @@ export default {
     aboutVersion: null,
     overlay: false,
     credentials: {},
-    checkAuth: false,
     snackBar: {
       enabled: false,
       message: "",
     },
   }),
-  created() {
-    this.getCredentials().then(() => {
-      this.updateAuth();
-    });
-  },
   mounted() {
     this.$root.$on("update-auth", this.updateAuth);
     this.$root.$on("set-snackbar", this.setSnackBar);
@@ -124,9 +118,9 @@ export default {
       localStorage.setItem("isDarkMode", isDarkMode);
     });
 
-    window.ipc.on("CREDENTIAL_CHANGE", () => {
-      this.getCredentials();
-    });
+    // window.ipc.on("CREDENTIAL_CHANGE", () => {
+    //   this.getCredentials();
+    // });
 
     window.ipc.on("ABOUT_DIALOG", async (version) => {
       this.aboutVersion = version;
@@ -144,31 +138,6 @@ export default {
       this.snackBar.enabled = true;
       this.snackBar.message = message;
     },
-    async updateAuth() {
-      if (this.credentials && Object.entries(this.credentials).length > 0) {
-        let authCheckResponse = await this.$integrationHelpers.checkAuth(
-          this.credentials
-        );
-        this.checkAuth = authCheckResponse.authed;
-        if (authCheckResponse.failedAuth?.length > 0) {
-          // TODO - Prompt the user if they'd like to remove the failing cred
-          let message = "";
-          for (const failedCred of authCheckResponse.failedAuth) {
-            message += `${failedCred.credentialType} `;
-          }
-          message += this.$tc("message.integrations_expired", 1);
-          this.setSnackBar(message);
-        }
-      }
-    },
-    async getCredentials() {
-      if (!window.ipc) return;
-      await window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CREDENTIALS })
-        .then((result) => {
-          this.credentials = result;
-        });
-    },
   },
   computed: {
     currentTheme() {
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 801447a4..20b9135f 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -1,6 +1,12 @@
 import { IPC_HANDLERS, IPC_FUNCTIONS } from "@/modules/constants";
 
 export default class ElectronService {
+  // Listeners
+  onNewSession(callback) {
+    window.ipc.on("NEW_SESSION", callback);
+  }
+
+  // Invokers
   setWindowSize({ width, height }) {
     window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
diff --git a/src/store/modules/auth.js b/src/store/modules/auth.js
index 3de81a11..332d6d71 100644
--- a/src/store/modules/auth.js
+++ b/src/store/modules/auth.js
@@ -1,9 +1,27 @@
 export const auth = {
   namespaced: true,
   state: () => ({
+    isAuthenticated: false,
     credentials: {},
   }),
-  mutations: {},
+  mutations: {
+    setIsAuthenticated(state, payload) {
+      state.isAuthenticated = payload;
+    },
+    setCredentials(state, payload) {
+      state.credentials = payload;
+    },
+  },
   actions: {},
-  getters: {},
+  getters: {
+    credentials: (state) => state.credentials,
+    isAuthenticated: (state) => state.isAuthenticated,
+    loggedInServices: (state) => {
+      const services = {};
+      for (const credentialType of Object.keys(state.credentials)) {
+        services[credentialType] = state.credentials[credentialType].length > 0;
+      }
+      return services;
+    },
+  },
 };
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 14272bcc..19aa3ae8 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,8 +1,8 @@
 <template>
   <v-container class="wrapper">
     <div class="header">
-      <div class="avatar" v-if="checkAuth">
-        <MenuPopover :credential-items="credentials" />
+      <div class="avatar" v-if="isAuthenticated">
+        <MenuPopover />
       </div>
     </div>
     <div class="content">
@@ -177,35 +177,16 @@ export default {
     LogoWrapper,
     MenuPopover,
   },
-  props: {
-    isAuthenticated: {
-      type: Boolean,
-      default: () => false,
-    },
-  },
-  watch: {
-    isAuthenticated: function (newValue) {
-      this.checkAuth = newValue;
-    },
-  },
   data() {
-    return {
-      credentials: {},
-      checkAuth: this.isAuthenticated,
-      showMenu: false,
-    };
+    return {};
   },
   computed: {
     ...mapGetters({
       hotkeys: "config/hotkeys",
+      credentials: "auth/credentials",
+      isAuthenticated: "auth/isAuthenticated",
+      loggedInServices: "auth/loggedInServices",
     }),
-    loggedInServices() {
-      const services = {};
-      for (const credentialType of Object.keys(this.credentials)) {
-        services[credentialType] = this.credentials[credentialType].length > 0;
-      }
-      return services;
-    },
     quickTestHotkey() {
       return this.$hotkeyHelpers.findBinding("home.quickTest", this.hotkeys);
     },
@@ -222,46 +203,39 @@ export default {
       );
     },
   },
-  created() {
-    this.getCredentials();
-  },
   mounted() {
-    if (!window.ipc) return;
-
-    // New session
-    window.ipc.on("NEW_SESSION", () => {
-      this.newSession();
-    });
+    if (this.$isElectron) {
+      this.$electronService.onNewSession(this.newSession);
+    }
   },
   methods: {
-    async getCredentials() {
-      this.credentials = await this.$storageService.getCredentials();
-    },
     async newSession() {
       if (this.$router.history.current.path === "/") {
         await this.$router.push("/main");
       }
     },
     async openSession() {
-      if (!window.ipc) return;
+      if (this.$isElectron) {
+        const { status, message, state } = await window.ipc.invoke(
+          IPC_HANDLERS.FILE_SYSTEM,
+          {
+            func: IPC_FUNCTIONS.OPEN_SESSION,
+          }
+        );
 
-      const { status, message, state } = await window.ipc.invoke(
-        IPC_HANDLERS.FILE_SYSTEM,
-        {
-          func: IPC_FUNCTIONS.OPEN_SESSION,
-        }
-      );
+        if (status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", message);
+          console.log(message);
+        } else {
+          this.$store.commit("restoreState", state);
 
-      if (status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", message);
-        console.log(message);
-      } else {
-        this.$store.commit("restoreState", state);
-
-        const currentPath = this.$router.history.current.path;
-        if (currentPath !== state.path) {
-          await this.$router.push({ path: state.path });
+          const currentPath = this.$router.history.current.path;
+          if (currentPath !== state.path) {
+            await this.$router.push({ path: state.path });
+          }
         }
+      } else {
+        // todo Add web version handler
       }
     },
     handleQuickTest() {

From 9c12f32fa8a31b3e0eb8768e6be317a62c4d8527 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 8 Dec 2023 12:44:02 +0200
Subject: [PATCH 07/41] started MainView refactoring

---
 src/store/modules/config.js |  4 +++
 src/views/MainView.vue      | 52 ++++++++++++-------------------------
 2 files changed, 21 insertions(+), 35 deletions(-)

diff --git a/src/store/modules/config.js b/src/store/modules/config.js
index 80d2045a..3da0c7fa 100644
--- a/src/store/modules/config.js
+++ b/src/store/modules/config.js
@@ -21,5 +21,9 @@ export const config = {
       return state;
     },
     hotkeys: (state) => state.hotkeys,
+    checklistPresessionStatus: (state) => state.checklist.presession.status,
+    checklistPresessionTasks: (state) => state.checklist.presession.tasks,
+    checklistPostsessionStatus: (state) => state.checklist.postsession.status,
+    checklistPostsessionTasks: (state) => state.checklist.postsession.tasks,
   },
 };
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 51b98a3a..2cbf795d 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -38,8 +38,8 @@
         </v-tabs>
       </div>
       <div class="avatar">
-        <div v-if="checkAuth">
-          <MenuPopover :credential-items="credentials" />
+        <div v-if="isAuthenticated">
+          <MenuPopover />
         </div>
         <div v-else>
           <v-menu :nudge-width="100" bottom z-index="99999" offset-y>
@@ -125,6 +125,7 @@ import {
   IPC_FUNCTIONS,
   SESSION_STATUSES,
 } from "../modules/constants";
+import { mapGetters } from "vuex";
 
 export default {
   name: "MainView",
@@ -141,16 +142,7 @@ export default {
     CheckTaskWrapper,
     MenuPopover,
   },
-  props: {
-    isAuthenticated: {
-      type: Boolean,
-      default: () => false,
-    },
-  },
   watch: {
-    isAuthenticated: function (newValue) {
-      this.checkAuth = newValue;
-    },
     presession: {
       handler: function () {
         this.checkStatusOfPreSessionTask();
@@ -165,8 +157,6 @@ export default {
       selected: [],
       activeSession: {},
       config: {},
-      credentials: {},
-      checkAuth: this.isAuthenticated,
       presession: {},
       postsession: {},
       checkedStatusOfPreSessionTask: false,
@@ -177,7 +167,6 @@ export default {
   created() {
     this.fetchItems();
     this.getConfig();
-    this.getCredentials();
   },
   mounted() {
     this.$root.$on("update-selected", this.updateSelected);
@@ -197,21 +186,23 @@ export default {
     window.ipc.on("CONFIG_CHANGE", () => {
       this.getConfig();
     });
-    window.ipc.on("CREDENTIAL_CHANGE", () => {
-      this.getCredentials();
-    });
     window.ipc.on("META_CHANGE", () => {
       this.fetchItems();
       this.getConfig();
-      this.getCredentials();
     });
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+      checklistPresessionStatus: "config/checklistPresessionStatus",
+      checklistPostsessionStatus: "config/checklistPostsessionStatus",
+      checklistPostsessionTasks: "config/checklistPostsessionTasks",
+      checklistPresessionTasks: "config/checklistPresessionTasks",
+      isAuthenticated: "auth/isAuthenticated",
+      credentials: "auth/credentials",
+    }),
     backHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "workspace.back",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("workspace.back", this.hotkeys);
     },
     status() {
       return this.$store.state.status;
@@ -249,8 +240,8 @@ export default {
         .then((result) => {
           this.config = result;
           this.presession = {
-            status: this.config.checklist.presession.status,
-            tasks: this.config.checklist.presession.tasks.map((task) => {
+            status: this.checklistPresessionStatus,
+            tasks: this.checklistPresessionTasks.map((task) => {
               return { ...task, checked: false };
             }),
           };
@@ -258,22 +249,13 @@ export default {
           this.checkStatusOfPreSessionTask();
 
           this.postsession = {
-            status: this.config.checklist.postsession.status,
-            tasks: this.config.checklist.postsession.tasks.map((task) => {
+            status: this.checklistPostsessionStatus,
+            tasks: this.checklistPostsessionTasks.map((task) => {
               return { ...task, checked: false };
             }),
           };
         });
     },
-    getCredentials() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CREDENTIALS })
-        .then((result) => {
-          this.credentials = result;
-        });
-    },
     fetchItems() {
       if (!window.ipc) return;
 

From a1f324d667009be2918d6001f5c555c9c092b5ed Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Sun, 10 Dec 2023 11:17:30 +0200
Subject: [PATCH 08/41] refactoring and debugging

---
 src/components/CheckTaskWrapper.vue |   4 -
 src/store/modules/config.js         |  26 +++++-
 src/views/MainView.vue              | 126 +++++++++++-----------------
 3 files changed, 75 insertions(+), 81 deletions(-)

diff --git a/src/components/CheckTaskWrapper.vue b/src/components/CheckTaskWrapper.vue
index c29d8812..18c99d56 100644
--- a/src/components/CheckTaskWrapper.vue
+++ b/src/components/CheckTaskWrapper.vue
@@ -45,10 +45,6 @@ export default {
       type: Array,
       default: () => [],
     },
-    type: {
-      type: String,
-      defaut: () => "pressession",
-    },
   },
   data() {
     return {
diff --git a/src/store/modules/config.js b/src/store/modules/config.js
index 3da0c7fa..45e0c475 100644
--- a/src/store/modules/config.js
+++ b/src/store/modules/config.js
@@ -1,7 +1,18 @@
 import Vue from "vue";
 export const config = {
   namespaced: true,
-  state: () => ({}),
+  state: () => ({
+    checklist: {
+      presession: {
+        status: false,
+        tasks: [],
+      },
+      postsession: {
+        status: false,
+        tasks: [],
+      },
+    },
+  }),
   mutations: {
     setFullConfig(state, payload) {
       // Clear existing state properties
@@ -23,7 +34,18 @@ export const config = {
     hotkeys: (state) => state.hotkeys,
     checklistPresessionStatus: (state) => state.checklist.presession.status,
     checklistPresessionTasks: (state) => state.checklist.presession.tasks,
-    checklistPostsessionStatus: (state) => state.checklist.postsession.status,
+    uncheckedRequiredPresessionTaskExist: (state) => {
+      if (!state.checklist.presession.status) {
+        this.checkedStatusOfPreSessionTask = true;
+      } else {
+        const uncheckedTasks = state.checklist.presession.tasks.filter(
+          (task) => !task.checked && task.required
+        );
+        return uncheckedTasks.length === 0;
+      }
+    },
+    checklistPostsessionStatus: (state) =>
+      state?.checklist?.postsession?.status,
     checklistPostsessionTasks: (state) => state.checklist.postsession.tasks,
   },
 };
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 2cbf795d..4f24f35e 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -72,12 +72,14 @@
     <div class="content">
       <v-tabs-items v-model="activeTab">
         <v-tab-item value="/main" :transition="false">
-          <TestWrapper :config-item="config" :credential-items="credentials" />
+          <TestWrapper
+            :config-item="$store.getters['config/fullConfig']"
+            :credential-items="credentials"
+          />
           <CheckTaskWrapper
             v-if="showCheckList"
-            :config-item="config"
+            :config-item="$store.getters['config/fullConfig']"
             :tasks="presession.tasks"
-            type="preseesion"
           />
         </v-tab-item>
         <v-tab-item value="/main/workspace" :transition="false">
@@ -94,10 +96,10 @@
       <ControlPanel
         :items="items"
         @add-item="addItem"
-        :config-item="config"
+        :config-item="$store.getters['config/fullConfig']"
         :credential-items="credentials"
         :selectedItems="selected"
-        :checkedStatusOfPreSessionTask="checkedStatusOfPreSessionTask"
+        :checkedStatusOfPreSessionTask="uncheckedRequiredPresessionTaskExist"
         view-mode="normal"
       />
       <TimeCounter v-if="$store.state.status !== 'pending'" />
@@ -142,65 +144,61 @@ export default {
     CheckTaskWrapper,
     MenuPopover,
   },
-  watch: {
-    presession: {
-      handler: function () {
-        this.checkStatusOfPreSessionTask();
-      },
-      deep: true,
-    },
-  },
   data() {
     return {
       activeTab: "/main",
       items: [],
       selected: [],
       activeSession: {},
-      config: {},
       presession: {},
-      postsession: {},
-      checkedStatusOfPreSessionTask: false,
       showTaskError: false,
       showMenu: false,
     };
   },
   created() {
-    this.fetchItems();
-    this.getConfig();
+    // this.fetchItems();
   },
   mounted() {
+    this.setInitialPresession();
+    this.fetchItems();
     this.$root.$on("update-selected", this.updateSelected);
     this.$root.$on("save-session", this.saveSession);
     this.$root.$on("new-session", () => {
-      this.presession.tasks = this.presession.tasks.map((item) => {
-        let temp = Object.assign({}, item);
-        temp.checked = false;
-        return temp;
-      });
+      this.setInitialPresession();
     });
     if (!window.ipc) return;
-
+    //
     window.ipc.on("DATA_CHANGE", () => {
+      console.log("data change");
       this.fetchItems();
     });
-    window.ipc.on("CONFIG_CHANGE", () => {
-      this.getConfig();
-    });
+    // window.ipc.on("CONFIG_CHANGE", () => {
+    //   this.getConfig();
+    // });
     window.ipc.on("META_CHANGE", () => {
+      console.log("meta change");
       this.fetchItems();
-      this.getConfig();
+      //   this.getConfig();
     });
   },
   computed: {
     ...mapGetters({
       hotkeys: "config/hotkeys",
       checklistPresessionStatus: "config/checklistPresessionStatus",
-      checklistPostsessionStatus: "config/checklistPostsessionStatus",
-      checklistPostsessionTasks: "config/checklistPostsessionTasks",
       checklistPresessionTasks: "config/checklistPresessionTasks",
       isAuthenticated: "auth/isAuthenticated",
       credentials: "auth/credentials",
     }),
+    uncheckedRequiredPresessionTaskExist() {
+      if (!this.presession.status) {
+        return true;
+      } else {
+        const uncheckedTasks = this.presession.tasks.filter(
+          (task) => !task.checked && task.required
+        );
+        return uncheckedTasks.length === 0;
+      }
+    },
     backHotkey() {
       return this.$hotkeyHelpers.findBinding("workspace.back", this.hotkeys);
     },
@@ -215,47 +213,20 @@ export default {
     },
   },
   methods: {
+    setInitialPresession() {
+      this.presession = {
+        status: this.checklistPresessionStatus,
+        tasks: this.checklistPresessionTasks.map((task) => {
+          return { ...task, checked: false };
+        }),
+      };
+    },
     navigate(link) {
       if (this.$route.path === link || this.status === SESSION_STATUSES.PENDING)
         return;
 
       this.$router.push({ path: link });
     },
-    checkStatusOfPreSessionTask() {
-      if (!this.presession.status) {
-        this.checkedStatusOfPreSessionTask = true;
-        return;
-      }
-
-      const uncheckedTasks = this.presession.tasks.filter(
-        (task) => !task.checked && task.required
-      );
-      this.checkedStatusOfPreSessionTask = uncheckedTasks.length === 0;
-    },
-    getConfig() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CONFIG })
-        .then((result) => {
-          this.config = result;
-          this.presession = {
-            status: this.checklistPresessionStatus,
-            tasks: this.checklistPresessionTasks.map((task) => {
-              return { ...task, checked: false };
-            }),
-          };
-
-          this.checkStatusOfPreSessionTask();
-
-          this.postsession = {
-            status: this.checklistPostsessionStatus,
-            tasks: this.checklistPostsessionTasks.map((task) => {
-              return { ...task, checked: false };
-            }),
-          };
-        });
-    },
     fetchItems() {
       if (!window.ipc) return;
 
@@ -264,22 +235,26 @@ export default {
         .then((result) => {
           this.items = result;
         });
+
+      console.log(this.items);
     },
     addItem(newItem) {
+      console.log("add item");
       this.items.push(newItem);
       this.saveSession(this.items);
     },
-    updateItems() {
-      this.items = this.items.map((item) => {
-        let temp = Object.assign({}, item);
-        if (temp.id === this.activeItem.id) {
-          temp = this.activeItem;
-        }
-        return temp;
-      });
-      this.saveSession(this.items);
-    },
+    // updateItems() {
+    //   this.items = this.items.map((item) => {
+    //     let temp = Object.assign({}, item);
+    //     if (temp.id === this.activeItem.id) {
+    //       temp = this.activeItem;
+    //     }
+    //     return temp;
+    //   });
+    //   this.saveSession(this.items);
+    // },
     saveSession(items) {
+      console.log("inside save session");
       if (!window.ipc) return;
 
       window.ipc.invoke(IPC_HANDLERS.DATABASE, {
@@ -291,6 +266,7 @@ export default {
       this.selected = value;
     },
     updateActiveSession(value) {
+      console.log("update active session");
       this.activeSession = value;
       this.openEditWindow(this.activeSession);
       // this.updateItems();

From d087367dbec497da0d37d7d735913d16e58c8d29 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 11 Dec 2023 10:17:44 +0200
Subject: [PATCH 09/41] refactoring, fixing store problem with saving, Main
 view now started rendering in a web app

---
 src/App.vue                                   |  2 +-
 src/services/electronService.js               | 17 ++++-
 .../storage-options/localJsonDbService.js     | 20 ++++-
 .../storage-options/restApiService.js         | 14 +++-
 src/services/storageInterface.js              | 12 ++-
 src/services/storageService.js                | 12 ++-
 src/store/index.js                            | 63 ++++++----------
 src/views/HomeView.vue                        |  1 +
 src/views/MainView.vue                        | 75 ++++---------------
 9 files changed, 101 insertions(+), 115 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index ec2a9aa0..deea3152 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -21,7 +21,7 @@ export default {
     if (this.$router.history.current.path === "/") {
       const state = await this.$storageService.getState();
       if (Object.keys(state).length) {
-        this.$store.commit("restoreState", state);
+        await this.$store.commit("restoreState", state);
         const currentPath = this.$router.history.current.path;
         if (state.path && currentPath !== state.path) {
           if (state.path.includes("result") && this.$isElectron) {
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 20b9135f..8eb2bd20 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -6,6 +6,14 @@ export default class ElectronService {
     window.ipc.on("NEW_SESSION", callback);
   }
 
+  onDataChange(callback) {
+    window.ipc.on("DATA_CHANGE", callback);
+  }
+
+  onMetaChange(callback) {
+    window.ipc.on("META_CHANGE", callback);
+  }
+
   // Invokers
   setWindowSize({ width, height }) {
     window.ipc.invoke(IPC_HANDLERS.WINDOW, {
@@ -16,10 +24,11 @@ export default class ElectronService {
       },
     });
   }
-  updateState(state) {
-    window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-      func: IPC_FUNCTIONS.UPDATE_STATE,
-      data: state,
+
+  openEditWindow(data) {
+    window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,
+      data: data,
     });
   }
 }
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index 95fd2501..c26f67b7 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -8,8 +8,11 @@ export default class LocalJsonDbService extends StorageInterface {
     });
   }
 
-  async setState(state) {
-    console.log(state);
+  async updateState(state) {
+    window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.UPDATE_STATE,
+      data: state,
+    });
   }
 
   async getConfig() {
@@ -23,4 +26,17 @@ export default class LocalJsonDbService extends StorageInterface {
       func: IPC_FUNCTIONS.GET_CREDENTIALS,
     });
   }
+
+  async getItems() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_ITEMS,
+    });
+  }
+
+  async updateItems(items) {
+    window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.UPDATE_ITEMS,
+      data: items,
+    });
+  }
 }
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index e2c9c848..c078dcf3 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -7,8 +7,8 @@ export default class RestApiService extends StorageInterface {
     return response.data;
   }
 
-  async setState(value) {
-    console.log(value);
+  async updateState(state) {
+    console.log(state);
     // saving state endpoint here
   }
 
@@ -21,4 +21,14 @@ export default class RestApiService extends StorageInterface {
     const response = await axios.get(`http://localhost:3000/credentials`);
     return response.data;
   }
+
+  async getItems() {
+    const response = await axios.get(`http://localhost:3000/items`);
+    return response.data;
+  }
+
+  async updateItems(items) {
+    console.log(items);
+    // saving state endpoint here
+  }
 }
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
index 93eb3587..15d00f14 100644
--- a/src/services/storageInterface.js
+++ b/src/services/storageInterface.js
@@ -4,8 +4,8 @@ export default class StorageInterface {
   }
 
   // eslint-disable-next-line
-  async setState(state) {
-    throw new Error("Method 'setState()' must be implemented.");
+  async updateState(state) {
+    throw new Error("Method 'updateState()' must be implemented.");
   }
 
   async getConfig() {
@@ -15,4 +15,12 @@ export default class StorageInterface {
   async getCredentials() {
     throw new Error("Method 'getCredentials()' must be implemented.");
   }
+
+  async getItems() {
+    throw new Error("Method 'fetchItems()' must be implemented.");
+  }
+
+  async updateItems(state) {
+    throw new Error("Method 'updateItems()' must be implemented.");
+  }
 }
diff --git a/src/services/storageService.js b/src/services/storageService.js
index 90c12e4e..fe054b8f 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -12,8 +12,8 @@ export default class StorageService {
     return await this.storage.getState();
   }
 
-  async setState(state) {
-    return this.storage.setState(state);
+  async updateState(state) {
+    return this.storage.updateState(state);
   }
 
   async getConfig() {
@@ -23,4 +23,12 @@ export default class StorageService {
   async getCredentials() {
     return await this.storage.getCredentials();
   }
+
+  async getItems() {
+    return await this.storage.getItems();
+  }
+
+  async updateItems(items) {
+    return this.storage.updateItems(items);
+  }
 }
diff --git a/src/store/index.js b/src/store/index.js
index ab1c2ee8..135aaee2 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -38,60 +38,42 @@ export default new Vuex.Store({
   mutations: {
     setTitle(state, payload) {
       state.title = payload;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setCharter(state, payload) {
       state.charter.content = payload.content;
       state.charter.text = payload.text;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setMindmap(state, payload) {
       state.mindmap.nodes = payload.nodes;
       state.mindmap.connections = payload.connections;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setPrecondition(state, payload) {
       state.preconditions.content = payload.content;
       state.preconditions.text = payload.text;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setDuration(state, payload) {
       state.duration = payload;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setStarted(state, payload) {
       state.started = payload;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setEnded(state, payload) {
       state.ended = payload;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setQuickTest(state, payload) {
       state.quickTest = payload;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     setPath(state, payload) {
       state.path = payload;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     updateSession(state, payload) {
       if (state.status !== payload.status) {
@@ -103,9 +85,7 @@ export default new Vuex.Store({
       if (state.duration !== payload.duration) {
         state.duration = payload.duration;
       }
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     clearState(state) {
       state.title = "";
@@ -129,9 +109,7 @@ export default new Vuex.Store({
       state.started = "";
       state.ended = "";
       state.quickTest = false;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     resetState(state) {
       state.duration = 0;
@@ -141,9 +119,7 @@ export default new Vuex.Store({
       state.started = "";
       state.ended = "";
       state.quickTest = false;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
     restoreState(state, payload) {
       state.title = payload.title;
@@ -162,12 +138,19 @@ export default new Vuex.Store({
       state.ended = payload.ended;
       state.quickTest = payload.quickTest;
       state.path = payload.path;
-      if (this.$isElectron) {
-        this.$electronService.updateState(state);
-      }
+      this._vm.$storageService.updateState(state);
     },
   },
-  actions: {},
+  actions: {
+    // async resetState(context, payload) {
+    //   await this._vm.$storageService.updateState(payload);
+    //   context.commit("resetState", payload);
+    // },
+    // async restoreState(context, payload) {
+    //   await this._vm.$storageService.updateState(payload);
+    //   context.commit("restoreState", payload);
+    // },
+  },
   modules: {
     auth,
     config,
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 19aa3ae8..e9788756 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -205,6 +205,7 @@ export default {
   },
   mounted() {
     if (this.$isElectron) {
+      // handle electron menu -> New Session
       this.$electronService.onNewSession(this.newSession);
     }
   },
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 4f24f35e..10579007 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -122,11 +122,7 @@ import TimeCounter from "../components/TimeCounter.vue";
 import CheckTaskWrapper from "@/components/CheckTaskWrapper.vue";
 import MenuPopover from "@/components/MenuPopover.vue";
 
-import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
-  SESSION_STATUSES,
-} from "../modules/constants";
+import { SESSION_STATUSES } from "../modules/constants";
 import { mapGetters } from "vuex";
 
 export default {
@@ -155,9 +151,6 @@ export default {
       showMenu: false,
     };
   },
-  created() {
-    // this.fetchItems();
-  },
   mounted() {
     this.setInitialPresession();
     this.fetchItems();
@@ -166,20 +159,11 @@ export default {
     this.$root.$on("new-session", () => {
       this.setInitialPresession();
     });
-    if (!window.ipc) return;
-    //
-    window.ipc.on("DATA_CHANGE", () => {
-      console.log("data change");
-      this.fetchItems();
-    });
-    // window.ipc.on("CONFIG_CHANGE", () => {
-    //   this.getConfig();
-    // });
-    window.ipc.on("META_CHANGE", () => {
-      console.log("meta change");
-      this.fetchItems();
-      //   this.getConfig();
-    });
+
+    if (this.$isElectron) {
+      this.$electronService.onDataChange(this.fetchItems);
+      this.$electronService.onMetaChange(this.fetchItems);
+    }
   },
   computed: {
     ...mapGetters({
@@ -221,61 +205,28 @@ export default {
         }),
       };
     },
-    navigate(link) {
-      if (this.$route.path === link || this.status === SESSION_STATUSES.PENDING)
-        return;
-
-      this.$router.push({ path: link });
-    },
-    fetchItems() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_ITEMS })
-        .then((result) => {
-          this.items = result;
-        });
-
-      console.log(this.items);
+    async fetchItems() {
+      this.items = await this.$storageService.getItems();
     },
     addItem(newItem) {
-      console.log("add item");
       this.items.push(newItem);
       this.saveSession(this.items);
     },
-    // updateItems() {
-    //   this.items = this.items.map((item) => {
-    //     let temp = Object.assign({}, item);
-    //     if (temp.id === this.activeItem.id) {
-    //       temp = this.activeItem;
-    //     }
-    //     return temp;
-    //   });
-    //   this.saveSession(this.items);
-    // },
     saveSession(items) {
-      console.log("inside save session");
-      if (!window.ipc) return;
-
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_ITEMS,
-        data: items,
-      });
+      this.$storageService.updateItems(items);
     },
     updateSelected(value) {
       this.selected = value;
     },
     updateActiveSession(value) {
-      console.log("update active session");
       this.activeSession = value;
       this.openEditWindow(this.activeSession);
-      // this.updateItems();
     },
     openEditWindow(data) {
-      window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,
-        data: data,
-      });
+      // todo we want to replace electron window with the vuetify dialog instead to make it work for both electron & web
+      if (this.$isElectron) {
+        this.$electronService.openEditWindow(data);
+      }
     },
     back() {
       this.$store.commit("resetState");

From 74790a56a2861e425447836f6a28c39b7c946e5c Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 11 Dec 2023 18:34:53 +0200
Subject: [PATCH 10/41] refactoring, moving electron-specific actions to the
 electronService.js, adding browser-specific logic in MenuPopover.vue

---
 src/components/MenuPopover.vue                | 48 ++++++++---------
 src/components/MindmapEditor.vue              |  9 ----
 src/components/TestWrapper.vue                | 52 +++++++------------
 src/components/dialogs/NodeEditDialog.vue     | 22 +++-----
 src/services/electronService.js               |  7 +++
 .../storage-options/localJsonDbService.js     |  7 +++
 .../storage-options/restApiService.js         |  5 ++
 src/services/storageInterface.js              |  6 +++
 src/services/storageService.js                |  4 ++
 src/store/modules/config.js                   | 14 ++---
 src/views/MainView.vue                        |  5 +-
 11 files changed, 83 insertions(+), 96 deletions(-)

diff --git a/src/components/MenuPopover.vue b/src/components/MenuPopover.vue
index 4abf4810..41bdf67e 100644
--- a/src/components/MenuPopover.vue
+++ b/src/components/MenuPopover.vue
@@ -82,7 +82,6 @@
   </v-menu>
 </template>
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
 import uuidv4 from "uuid";
 import { mapGetters } from "vuex";
 
@@ -114,37 +113,38 @@ export default {
   },
   methods: {
     async openAccountLink(credentialType, credential) {
+      console.log(credentialType, credential);
       if (credentialType === "yatt") {
-        await window.ipc
-          .invoke(IPC_HANDLERS.FILE_SYSTEM, {
-            func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
-            data: "https://app.yatt.ai/",
-          })
-          .then(() => {
-            this.showMenu = false;
-          });
+        const yattUrl = "https://app.yatt.ai/";
+        if (this.$isElectron) {
+          await this.$electronService.openExternalLink(yattUrl);
+        } else {
+          window.open(yattUrl, "_blank");
+        }
+        this.showMenu = false;
       } else if (credentialType === "jira") {
-        await window.ipc
-          .invoke(IPC_HANDLERS.FILE_SYSTEM, {
-            func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
-            data: credential.data.resource.url,
-          })
-          .then(() => {
-            this.showMenu = false;
-          });
+        const jiraUrl = credential.orgs[0].url;
+        if (this.$isElectron) {
+          await this.$electronService.openExternalLink(jiraUrl);
+        } else {
+          window.open(jiraUrl, "_blank");
+        }
+        this.showMenu = false;
+      } else if (credentialType === "testrail") {
+        const testRailUrl = `https://${credential.url}`;
+        if (this.$isElectron) {
+          await this.$electronService.openExternalLink(testRailUrl);
+        } else {
+          window.open(testRailUrl, "_blank");
+        }
+        this.showMenu = false;
       }
     },
     logout() {
       this.showMenu = false;
       const emptyCredentials = {};
       this.$store.commit("auth/setCredentials", emptyCredentials);
-
-      if (this.$isElectron) {
-        window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
-          data: emptyCredentials,
-        });
-      }
+      this.$storageService.updateCredentials(emptyCredentials);
     },
   },
 };
diff --git a/src/components/MindmapEditor.vue b/src/components/MindmapEditor.vue
index 818dd701..2640bc3b 100644
--- a/src/components/MindmapEditor.vue
+++ b/src/components/MindmapEditor.vue
@@ -2,7 +2,6 @@
   <div class="wrapper">
     <svg class="mindmap-svg" ref="mountPoint"></svg>
     <node-edit-dialog
-      :config-item="config"
       v-model="nodeEditDialog"
       :title="title"
       @save="updateNode"
@@ -41,10 +40,6 @@ export default {
   name: "MindmapEditor",
   components: { NodeEditDialog },
   props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
     nodesData: {
       type: Array,
       default: () => [],
@@ -67,9 +62,6 @@ export default {
     },
   },
   watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
     nodesData: function (newValue) {
       this.nodes = newValue;
     },
@@ -84,7 +76,6 @@ export default {
   },
   data() {
     return {
-      config: this.configItem,
       simulation: null,
       nodes: this.nodesData,
       connections: this.connectionsData,
diff --git a/src/components/TestWrapper.vue b/src/components/TestWrapper.vue
index 7fa7603c..b72b47a7 100644
--- a/src/components/TestWrapper.vue
+++ b/src/components/TestWrapper.vue
@@ -20,7 +20,7 @@
             :color="currentTheme.secondary"
             :loading="titleLoading"
             :append-icon="
-              aiAssistEnabled
+              isAiAssistEnabled
                 ? previousTitle
                   ? 'mdi-robot-off-outline'
                   : 'mdi-robot-outline'
@@ -104,7 +104,7 @@
               >
                 <template #aiAssist="">
                   <v-btn
-                    v-if="aiAssistEnabled"
+                    v-if="isAiAssistEnabled"
                     icon
                     small
                     :title="$tc('caption.ai_assist', 1)"
@@ -207,7 +207,7 @@
           >
             <template #aiAssist="">
               <v-btn
-                v-if="aiAssistEnabled"
+                v-if="isAiAssistEnabled"
                 icon
                 small
                 :title="$tc('caption.ai_assist', 1)"
@@ -238,6 +238,7 @@ import {
 } from "../modules/constants";
 
 import openAIIntegrationHelper from "../integrations/OpenAIIntegrationHelpers";
+import { mapGetters } from "vuex";
 
 export default {
   name: "TestWrapper",
@@ -248,16 +249,6 @@ export default {
     VTextField,
     MindmapEditor,
   },
-  props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
-    credentialItems: {
-      type: Object,
-      default: () => {},
-    },
-  },
   data() {
     return {
       title: this.$store.state.title,
@@ -286,44 +277,45 @@ export default {
       },
       preconditionsLoading: false,
       duration: "",
-      config: this.configItem,
-      credentials: this.credentialItems,
     };
   },
   computed: {
+    ...mapGetters({
+      isAiAssistEnabled: "config/isAiAssistEnabled",
+      hotkeys: "config/hotkeys",
+      config: "config/fullConfig",
+      credentials: "auth/credentials",
+    }),
     titleHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "sessionPlanning.title",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     charterHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "sessionPlanning.charter",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     timeLimitHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "sessionPlanning.timeLimit",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     preconditionsHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "sessionPlanning.preconditions",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     checkListHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "sessionPlanning.checklist",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
-    aiAssistEnabled() {
-      return this?.config?.ai?.enabled || false;
-    },
     currentTheme() {
       if (this.$vuetify.theme.dark) {
         return this.$vuetify.theme.themes.dark;
@@ -333,12 +325,6 @@ export default {
     },
   },
   watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
-    credentialItems: function (newValue) {
-      this.credentials = newValue;
-    },
     "$store.state.title": {
       deep: true,
       handler(newValue) {
@@ -475,7 +461,7 @@ export default {
       this.$store.commit("setDuration", temp);
     },
     handleMindmap(value) {
-      const new_nodes = value.nodes.map((obj) => {
+      const newNodes = value.nodes.map((obj) => {
         return {
           id: obj.id,
           text: obj.text,
@@ -483,15 +469,15 @@ export default {
           fy: obj.fy,
         };
       });
-      const new_connections = value.connections.map((obj) => {
+      const newConnections = value.connections.map((obj) => {
         return {
           source: obj.source.id,
           target: obj.target.id,
         };
       });
       const data = {
-        nodes: new_nodes,
-        connections: new_connections,
+        nodes: newNodes,
+        connections: newConnections,
       };
       this.$store.commit("setMindmap", data);
     },
diff --git a/src/components/dialogs/NodeEditDialog.vue b/src/components/dialogs/NodeEditDialog.vue
index 29dd191c..05898245 100644
--- a/src/components/dialogs/NodeEditDialog.vue
+++ b/src/components/dialogs/NodeEditDialog.vue
@@ -48,49 +48,39 @@
 
 <script>
 import LogoWrapper from "../LogoWrapper.vue";
+import { mapGetters } from "vuex";
 export default {
   name: "NodeEditDialog",
   components: {
     LogoWrapper,
   },
   props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
     title: {
       type: String,
       default: () => "",
     },
   },
   watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
     title: function () {
       this.text = this.title;
     },
   },
   data() {
     return {
-      config: this.configItem,
       text: "",
       valid: false,
       textRules: [(v) => !!v || "Node title is required"],
     };
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+    }),
     confirmHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.save",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.save", this.hotkeys);
     },
     cancelHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.cancel",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.cancel", this.hotkeys);
     },
     currentTheme() {
       if (this.$vuetify.theme.dark) {
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 8eb2bd20..3e9f9156 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -31,4 +31,11 @@ export default class ElectronService {
       data: data,
     });
   }
+
+  async openExternalLink(url) {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
+      data: url,
+    });
+  }
 }
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index c26f67b7..2df51181 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -27,6 +27,13 @@ export default class LocalJsonDbService extends StorageInterface {
     });
   }
 
+  async updateCredentials(credentials) {
+    window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
+      data: credentials,
+    });
+  }
+
   async getItems() {
     return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
       func: IPC_FUNCTIONS.GET_ITEMS,
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index c078dcf3..71245325 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -22,6 +22,11 @@ export default class RestApiService extends StorageInterface {
     return response.data;
   }
 
+  async updateCredentials(credentials) {
+    console.log(credentials);
+    // saving credentials endpoint here
+  }
+
   async getItems() {
     const response = await axios.get(`http://localhost:3000/items`);
     return response.data;
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
index 15d00f14..b36b0bdb 100644
--- a/src/services/storageInterface.js
+++ b/src/services/storageInterface.js
@@ -16,10 +16,16 @@ export default class StorageInterface {
     throw new Error("Method 'getCredentials()' must be implemented.");
   }
 
+  // eslint-disable-next-line
+  async updateCredentials(credentials) {
+    throw new Error("Method 'updateCredentials()' must be implemented.");
+  }
+
   async getItems() {
     throw new Error("Method 'fetchItems()' must be implemented.");
   }
 
+  // eslint-disable-next-line
   async updateItems(state) {
     throw new Error("Method 'updateItems()' must be implemented.");
   }
diff --git a/src/services/storageService.js b/src/services/storageService.js
index fe054b8f..9b7eeefa 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -24,6 +24,10 @@ export default class StorageService {
     return await this.storage.getCredentials();
   }
 
+  async updateCredentials(credentials) {
+    return this.storage.updateCredentials(credentials);
+  }
+
   async getItems() {
     return await this.storage.getItems();
   }
diff --git a/src/store/modules/config.js b/src/store/modules/config.js
index 45e0c475..438365f9 100644
--- a/src/store/modules/config.js
+++ b/src/store/modules/config.js
@@ -2,6 +2,9 @@ import Vue from "vue";
 export const config = {
   namespaced: true,
   state: () => ({
+    ai: {
+      enabled: false,
+    },
     checklist: {
       presession: {
         status: false,
@@ -34,16 +37,7 @@ export const config = {
     hotkeys: (state) => state.hotkeys,
     checklistPresessionStatus: (state) => state.checklist.presession.status,
     checklistPresessionTasks: (state) => state.checklist.presession.tasks,
-    uncheckedRequiredPresessionTaskExist: (state) => {
-      if (!state.checklist.presession.status) {
-        this.checkedStatusOfPreSessionTask = true;
-      } else {
-        const uncheckedTasks = state.checklist.presession.tasks.filter(
-          (task) => !task.checked && task.required
-        );
-        return uncheckedTasks.length === 0;
-      }
-    },
+    isAiAssistEnabled: (state) => state.ai?.enabled || false,
     checklistPostsessionStatus: (state) =>
       state?.checklist?.postsession?.status,
     checklistPostsessionTasks: (state) => state.checklist.postsession.tasks,
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 10579007..67269872 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -72,10 +72,7 @@
     <div class="content">
       <v-tabs-items v-model="activeTab">
         <v-tab-item value="/main" :transition="false">
-          <TestWrapper
-            :config-item="$store.getters['config/fullConfig']"
-            :credential-items="credentials"
-          />
+          <TestWrapper />
           <CheckTaskWrapper
             v-if="showCheckList"
             :config-item="$store.getters['config/fullConfig']"

From 04be48ea00fcb195c83498fc98bc736becc85ada Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 11 Dec 2023 19:15:46 +0200
Subject: [PATCH 11/41] refactoring and moving logic to storage service for
 CheckTaskWrapper.vue and NotesWrapper.vue, removing unused props

---
 src/components/CheckTaskWrapper.vue           | 17 ++++------
 src/components/NotesWrapper.vue               | 32 +++----------------
 .../storage-options/localJsonDbService.js     | 13 ++++++++
 .../storage-options/restApiService.js         | 10 ++++++
 src/services/storageInterface.js              |  9 ++++++
 src/services/storageService.js                |  8 +++++
 src/views/MainView.vue                        |  6 +---
 7 files changed, 52 insertions(+), 43 deletions(-)

diff --git a/src/components/CheckTaskWrapper.vue b/src/components/CheckTaskWrapper.vue
index 18c99d56..32e510e7 100644
--- a/src/components/CheckTaskWrapper.vue
+++ b/src/components/CheckTaskWrapper.vue
@@ -34,13 +34,11 @@
   </div>
 </template>
 <script>
+import { mapGetters } from "vuex";
+
 export default {
   name: "CheckTaskWrapper",
   props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
     tasks: {
       type: Array,
       default: () => [],
@@ -49,7 +47,6 @@ export default {
   data() {
     return {
       valid: true,
-      config: this.configItem,
     };
   },
   mounted() {
@@ -58,10 +55,13 @@ export default {
     });
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+    }),
     checklistHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "sessionPlanning.checklist",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     currentTheme() {
@@ -72,11 +72,6 @@ export default {
       }
     },
   },
-  watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
-  },
   methods: {
     rules(required) {
       if (required) {
diff --git a/src/components/NotesWrapper.vue b/src/components/NotesWrapper.vue
index 3546adb4..1f2757ca 100644
--- a/src/components/NotesWrapper.vue
+++ b/src/components/NotesWrapper.vue
@@ -555,8 +555,6 @@
 import draggable from "vuedraggable";
 import { VEmojiPicker } from "v-emoji-picker";
 
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
-
 export default {
   name: "NotesWrapper",
   components: {
@@ -609,34 +607,19 @@ export default {
   },
   methods: {
     async fetchNotes() {
-      if (!window.ipc) return;
-
-      await window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_NOTES,
-        })
-        .then((notes) => {
-          this.notes = notes;
-        });
+      this.notes = await this.$storageService.getNotes();
     },
     async handleNotes() {
       const regex = /(<([^>]+)>)/gi;
       this.notes.text = this.notes.content.replace(regex, "");
-      if (!window.ipc) return;
 
-      await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_NOTES,
-        data: this.notes,
-      });
+      await this.$storageService.updateNotes(this.notes);
     },
     handleChange() {
       this.saveData();
     },
     checkedItem(id) {
-      if (this.selected.includes(id)) {
-        return true;
-      }
-      return false;
+      return this.selected.includes(id);
     },
     handleSelected($event, id) {
       if ($event.target.checked && !this.selected.includes(id)) {
@@ -688,13 +671,8 @@ export default {
       });
       this.saveData();
     },
-    saveData() {
-      if (window.ipc) {
-        window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.UPDATE_ITEMS,
-          data: this.itemLists.slice().reverse(),
-        });
-      }
+    async saveData() {
+      await this.$storageService.updateItems(this.itemLists.slice().reverse());
     },
   },
 };
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index 2df51181..5ab34eab 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -46,4 +46,17 @@ export default class LocalJsonDbService extends StorageInterface {
       data: items,
     });
   }
+
+  async getNotes() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_NOTES,
+    });
+  }
+
+  async updateNotes(notes) {
+    await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.UPDATE_NOTES,
+      data: notes,
+    });
+  }
 }
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index 71245325..3e504509 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -36,4 +36,14 @@ export default class RestApiService extends StorageInterface {
     console.log(items);
     // saving state endpoint here
   }
+
+  async getNotes() {
+    const response = await axios.get(`http://localhost:3000/notes`);
+    return response.data;
+  }
+
+  async updateNotes(notes) {
+    console.log(notes);
+    // saving notes endpoint here
+  }
 }
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
index b36b0bdb..3590e04f 100644
--- a/src/services/storageInterface.js
+++ b/src/services/storageInterface.js
@@ -29,4 +29,13 @@ export default class StorageInterface {
   async updateItems(state) {
     throw new Error("Method 'updateItems()' must be implemented.");
   }
+
+  async getNotes() {
+    throw new Error("Method 'getNotes()' must be implemented.");
+  }
+
+  // eslint-disable-next-line
+  async updateNotes(notes) {
+    throw new Error("Method 'updateNotes()' must be implemented.");
+  }
 }
diff --git a/src/services/storageService.js b/src/services/storageService.js
index 9b7eeefa..066907a4 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -35,4 +35,12 @@ export default class StorageService {
   async updateItems(items) {
     return this.storage.updateItems(items);
   }
+
+  async getNotes() {
+    return await this.storage.getNotes();
+  }
+
+  async updateNotes(notes) {
+    return this.storage.updateNotes(notes);
+  }
 }
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 67269872..ed498556 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -73,11 +73,7 @@
       <v-tabs-items v-model="activeTab">
         <v-tab-item value="/main" :transition="false">
           <TestWrapper />
-          <CheckTaskWrapper
-            v-if="showCheckList"
-            :config-item="$store.getters['config/fullConfig']"
-            :tasks="presession.tasks"
-          />
+          <CheckTaskWrapper v-if="showCheckList" :tasks="presession.tasks" />
         </v-tab-item>
         <v-tab-item value="/main/workspace" :transition="false">
           <WorkspaceWrapper

From bae725a5b7655b57c27bd1718d73bb6c3da9f70d Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 12 Dec 2023 08:16:31 +0200
Subject: [PATCH 12/41] moving TimelineWrapper electron logic to services

---
 src/components/ControlPanel.vue               |   2 -
 src/components/TimelineWrapper.vue            | 115 ++++++------------
 src/services/electronService.js               |  31 +++++
 .../storage-options/localJsonDbService.js     |   7 ++
 .../storage-options/restApiService.js         |   6 +
 src/services/storageInterface.js              |   7 +-
 src/services/storageService.js                |   4 +
 7 files changed, 92 insertions(+), 80 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 4be82bf1..18ad72fb 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -1303,10 +1303,8 @@ export default {
     endSession() {
       if (this.postSessionData.status) {
         this.showEndSessionDialog();
-        return;
       } else {
         this.showSummaryDialog();
-        return;
       }
     },
     async endSessionProcess() {
diff --git a/src/components/TimelineWrapper.vue b/src/components/TimelineWrapper.vue
index 967661f3..f415272c 100644
--- a/src/components/TimelineWrapper.vue
+++ b/src/components/TimelineWrapper.vue
@@ -949,12 +949,7 @@ import { VEmojiPicker } from "v-emoji-picker";
 
 import dayjs from "dayjs";
 
-import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
-  STATUSES,
-  TEXT_TYPES,
-} from "../modules/constants";
+import { STATUSES, TEXT_TYPES } from "../modules/constants";
 
 export default {
   name: "TimelineWrapper",
@@ -1043,43 +1038,34 @@ export default {
       return hours + ":" + minutes + ":" + seconds;
     },
     async uploadEvidence() {
-      if (!window.ipc) return;
+      // todo add relative handler for web app
+      if (this.$isElectron) {
+        const { status, message, item } =
+          await this.$electronService.uploadEvidence();
 
-      const { status, message, item } = await window.ipc.invoke(
-        IPC_HANDLERS.CAPTURE,
-        {
-          func: IPC_FUNCTIONS.UPLOAD_EVIDENCE,
+        if (status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", message);
+        } else {
+          const data = {
+            sessionType: "File",
+            id: item.id,
+            fileType: item.fileType,
+            fileName: item.fileName,
+            filePath: item.filePath,
+            timer_mark: this.$store.state.timer,
+          };
+          await this.openEditorModal(data);
         }
-      );
-
-      if (status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", message);
-        console.log(message);
-      } else {
-        const data = {
-          sessionType: "File",
-          id: item.id,
-          fileType: item.fileType,
-          fileName: item.fileName,
-          filePath: item.filePath,
-          timer_mark: this.$store.state.timer,
-        };
-        this.openEditorModal(data);
       }
     },
     async openEditorModal(data) {
-      if (!window.ipc) return;
-
-      await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.OPEN_ADD_WINDOW,
-        data: { width: 700, height: 800, data: data },
-      });
+      if (this.$isElectron) {
+        // todo replace with vuetify dialog
+        await this.$electronService.openAddWindow(data);
+      }
     },
     checkedItem(id) {
-      if (this.selected.includes(id)) {
-        return true;
-      }
-      return false;
+      return this.selected.includes(id);
     },
     handleSelected($event, id) {
       if ($event.target.checked && !this.selected.includes(id)) {
@@ -1121,55 +1107,35 @@ export default {
       });
       this.saveData();
     },
-    handleActiveSession(id) {
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_ITEM_BY_ID,
-          data: id,
-        })
-        .then((data) => {
-          this.activeSession = data;
-          this.$emit("submit-session", this.activeSession);
-        });
+    async handleActiveSession(id) {
+      this.activeSession = await this.$storageService.getItemById(id);
+      this.$emit("submit-session", this.activeSession);
     },
-    dragItem(event, item) {
+    async dragItem(event, item) {
       event.preventDefault();
-      this.itemDragging = true;
-      if (!window.ipc) return;
-      window.ipc
-        .invoke(IPC_HANDLERS.FILE_SYSTEM, {
-          func: IPC_FUNCTIONS.DRAG_ITEM,
-          data: item,
-        })
-        .then(() => {
-          this.itemDragging = false;
-        });
+      if (this.$isElectron) {
+        // todo make dragging work in the web app
+        this.itemDragging = true;
+        await this.$electronService.dragItem(item);
+        this.itemDragging = false;
+      }
     },
     async dropFile(event) {
       event.preventDefault();
       event.stopPropagation();
       this.isDragging = false;
       if (!this.itemDragging) {
-        if (event.dataTransfer.files.length === 0 || !window.ipc) {
+        if (event.dataTransfer.files.length === 0 || !this.$isElectron) {
           return;
         }
 
         // TODO - Handle multiple files dropped.
-        const f = event.dataTransfer.files[0];
-        const { status, message, item } = await window.ipc.invoke(
-          IPC_HANDLERS.CAPTURE,
-          {
-            func: IPC_FUNCTIONS.DROP_FILE,
-            data: {
-              path: f.path,
-              name: f.name,
-            },
-          }
+        const { status, message, item } = await this.$electronService.dropFile(
+          event
         );
 
         if (status === STATUSES.ERROR) {
           this.$root.$emit("set-snackbar", message);
-          console.log(message);
         } else {
           const data = {
             sessionType: "File",
@@ -1179,7 +1145,7 @@ export default {
             filePath: item.filePath,
             timer_mark: this.$store.state.timer,
           };
-          this.openEditorModal(data);
+          await this.openEditorModal(data);
         }
         this.isDragging = false;
       }
@@ -1225,13 +1191,8 @@ export default {
       });
       this.saveData();
     },
-    saveData() {
-      if (window.ipc) {
-        window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.UPDATE_ITEMS,
-          data: this.itemLists,
-        });
-      }
+    async saveData() {
+      await this.$storageService.updateItems(this.itemLists);
     },
   },
 };
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 3e9f9156..9eeb64a3 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -25,6 +25,13 @@ export default class ElectronService {
     });
   }
 
+  async openAddWindow(data) {
+    await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_ADD_WINDOW,
+      data: { width: 700, height: 800, data },
+    });
+  }
+
   openEditWindow(data) {
     window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,
@@ -38,4 +45,28 @@ export default class ElectronService {
       data: url,
     });
   }
+
+  async uploadEvidence() {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.UPLOAD_EVIDENCE,
+    });
+  }
+
+  async dragItem(item) {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.DRAG_ITEM,
+      data: item,
+    });
+  }
+
+  async dropFile(event) {
+    const f = event.dataTransfer.files[0];
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.DROP_FILE,
+      data: {
+        path: f.path,
+        name: f.name,
+      },
+    });
+  }
 }
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index 5ab34eab..3dabebea 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -40,6 +40,13 @@ export default class LocalJsonDbService extends StorageInterface {
     });
   }
 
+  async getItemById(id) {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_ITEM_BY_ID,
+      data: id,
+    });
+  }
+
   async updateItems(items) {
     window.ipc.invoke(IPC_HANDLERS.DATABASE, {
       func: IPC_FUNCTIONS.UPDATE_ITEMS,
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index 3e504509..b9238bbb 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -32,6 +32,12 @@ export default class RestApiService extends StorageInterface {
     return response.data;
   }
 
+  async getItemById(id) {
+    console.log(id);
+    const response = await axios.get(`http://localhost:3000/item`);
+    return response.data;
+  }
+
   async updateItems(items) {
     console.log(items);
     // saving state endpoint here
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
index 3590e04f..82cbe1de 100644
--- a/src/services/storageInterface.js
+++ b/src/services/storageInterface.js
@@ -25,9 +25,14 @@ export default class StorageInterface {
     throw new Error("Method 'fetchItems()' must be implemented.");
   }
 
+  // eslint-disable-next-line
+  async getItemById(id) {
+    throw new Error("Method 'getItemById(id)' must be implemented.");
+  }
+
   // eslint-disable-next-line
   async updateItems(state) {
-    throw new Error("Method 'updateItems()' must be implemented.");
+    throw new Error("Method 'updateItems(state)' must be implemented.");
   }
 
   async getNotes() {
diff --git a/src/services/storageService.js b/src/services/storageService.js
index 066907a4..7672877e 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -32,6 +32,10 @@ export default class StorageService {
     return await this.storage.getItems();
   }
 
+  async getItemById(id) {
+    return await this.storage.getItemById(id);
+  }
+
   async updateItems(items) {
     return this.storage.updateItems(items);
   }

From 43f9711d5fc5967b7f88f6d0f2d72eec0f975d91 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 12 Dec 2023 08:33:18 +0200
Subject: [PATCH 13/41] refactored config and credentials for ControlPanel

---
 src/components/ControlPanel.vue | 98 +++++++++++----------------------
 src/views/MainView.vue          |  2 -
 2 files changed, 31 insertions(+), 69 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 18ad72fb..0c8963c8 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -102,11 +102,7 @@
                     </v-list-item-title>
                   </v-list-item-content>
                 </v-list-item>
-                <div
-                  v-if="
-                    this.credentials.jira && this.credentials.jira.length > 0
-                  "
-                >
+                <div v-if="credentials.jira && credentials.jira.length > 0">
                   <jira-export-session
                     :title="$tc(`caption.export_to_jira`, 1)"
                     :credential-items="credentials.jira"
@@ -116,10 +112,7 @@
                   />
                 </div>
                 <div
-                  v-if="
-                    this.credentials.testrail &&
-                    this.credentials.testrail.length > 0
-                  "
+                  v-if="credentials.testrail && credentials.testrail.length > 0"
                 >
                   <test-rail-export-session
                     :title="$tc(`caption.export_to_testrail`, 1)"
@@ -418,7 +411,7 @@
             <span>{{ $tc("caption.start_audio_record", 1) }}</span>
           </v-tooltip>
           <v-tooltip top v-if="recordAudioStarted">
-            <!-- CTODO test same binding for start/stop -->
+            <!-- TODO test same binding for start/stop -->
             <template v-slot:activator="{ on }">
               <v-btn
                 id="btn_stop_record_audio"
@@ -576,7 +569,7 @@
         <v-col
           cols="12"
           class="d-flex justify-center px-0 pt-0"
-          v-if="this.credentials.jira && this.credentials.jira.length > 0"
+          v-if="credentials.jira && credentials.jira.length > 0"
           v-shortkey="createIssueHotkey"
           @shortkey="openIssueMenu"
         >
@@ -708,7 +701,7 @@
 </template>
 
 <script>
-import { VContainer, VRow, VCol, VBtn, VIcon } from "vuetify/lib/components";
+import { VBtn, VCol, VContainer, VIcon, VRow } from "vuetify/lib/components";
 import uuidv4 from "uuid";
 
 import SourcePickerDialog from "./dialogs/SourcePickerDialog.vue";
@@ -722,24 +715,23 @@ import DurationConfirmDialog from "./dialogs/DurationConfirmDialog.vue";
 import AudioErrorDialog from "./dialogs/AudioErrorDialog.vue";
 import EndSessionDialog from "./dialogs/EndSessionDialog.vue";
 //import MinimizeControlWrapper from "../components/MinimizeControlWrapper.vue";
-
 import JiraExportSession from "./jira/JiraExportSession";
 import TestRailExportSession from "./testrail/TestRailExportSession";
 
 import JiraAddIssue from "./jira/JiraAddIssue";
 
 import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
+  DEFAULT_MAP_CONNECTIONS,
+  DEFAULT_MAP_NODES,
   IPC_BIND_KEYS,
+  IPC_FUNCTIONS,
+  IPC_HANDLERS,
   SESSION_STATUSES,
-  VIDEO_RESOLUTION,
   STATUSES,
+  VIDEO_RESOLUTION,
 } from "../modules/constants";
-import {
-  DEFAULT_MAP_NODES,
-  DEFAULT_MAP_CONNECTIONS,
-} from "../modules/constants";
+import { mapGetters } from "vuex";
+
 let mediaRecorder;
 let audioContext;
 let dest;
@@ -775,14 +767,6 @@ export default {
       type: Array,
       default: () => [],
     },
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
-    credentialItems: {
-      type: Object,
-      default: () => {},
-    },
     checkedStatusOfPreSessionTask: {
       type: Boolean,
       default: () => false,
@@ -811,12 +795,6 @@ export default {
     selectedItems: function (newValue) {
       this.selected = newValue;
     },
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
-    credentialItems: function (newValue) {
-      this.credentials = newValue;
-    },
     "$store.state.status": {
       deep: true,
       handler(newValue) {
@@ -846,76 +824,66 @@ export default {
     },
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+      config: "config/fullConfig",
+      credentials: "auth/credentials",
+    }),
     pauseHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "workspace.pause",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("workspace.pause", this.hotkeys);
     },
     resumeHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "workspace.resume",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("workspace.resume", this.hotkeys);
     },
     stopHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "workspace.stop",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("workspace.stop", this.hotkeys);
     },
     startVideoHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.videoStart",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     stopVideoHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.videoStop",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     screenshotHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.screenshot",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     startAudioHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.audioStart",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     stopAudioHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.audioStop",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     noteHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "workspace.note",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("workspace.note", this.hotkeys);
     },
     mindmapHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "workspace.mindmap",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("workspace.mindmap", this.hotkeys);
     },
     changeSourceHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.changeSource",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     createIssueHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "workspace.createIssue",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     postSessionData() {
@@ -926,8 +894,7 @@ export default {
       const timer = this.timer;
       const date = new Date(null);
       date.setSeconds(timer);
-      const result = date.toISOString().substr(11, 8);
-      return result;
+      return date.toISOString().substr(11, 8);
     },
     currentTheme() {
       if (this.$vuetify.theme.dark) {
@@ -961,8 +928,6 @@ export default {
       sources: [],
       sourceId: this.srcId,
       itemLists: this.items,
-      config: this.configItem,
-      credentials: this.credentialItems,
       audioDevices: [],
       loaded: false,
       status: this.$store.state.status,
@@ -1174,7 +1139,6 @@ export default {
     showNoteDialog() {
       if (this.viewMode === "normal") {
         this.noteDialog = true;
-        // settimeout
         setTimeout(() => {
           this.$refs.noteDialog.$refs.comment.editor.commands.focus();
         });
@@ -1278,7 +1242,7 @@ export default {
       if (this.viewMode === "normal") {
         const currentPath = this.$router.history.current.path;
         if (currentPath !== "/main/workspace") {
-          this.$router.push({ path: "/main/workspace" });
+          await this.$router.push({ path: "/main/workspace" });
         }
       }
     },
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index ed498556..0dcdb992 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -89,8 +89,6 @@
       <ControlPanel
         :items="items"
         @add-item="addItem"
-        :config-item="$store.getters['config/fullConfig']"
-        :credential-items="credentials"
         :selectedItems="selected"
         :checkedStatusOfPreSessionTask="uncheckedRequiredPresessionTaskExist"
         view-mode="normal"

From 3a0f4e54d400af4a14205b9851f6959ecdd5eda7 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 13 Dec 2023 21:01:01 +0200
Subject: [PATCH 14/41] moving some parts to the store, refactoring Control
 Panel, removing unused electron parts

---
 src/App.vue                         |   1 +
 src/components/CheckTaskWrapper.vue |  11 +-
 src/components/ControlPanel.vue     | 219 +++++-----------------------
 src/services/electronService.js     |  14 ++
 src/store/index.js                  |  26 +++-
 src/store/modules/config.js         |   1 +
 src/views/MainView.vue              |  29 ++--
 7 files changed, 100 insertions(+), 201 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index deea3152..e2ca6bab 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -25,6 +25,7 @@ export default {
         const currentPath = this.$router.history.current.path;
         if (state.path && currentPath !== state.path) {
           if (state.path.includes("result") && this.$isElectron) {
+            // todo replace with dialog as soon dialog will be implemented
             this.$electronService.setWindowSize({ width: 1440, height: 900 });
           }
           await this.$router.push({ path: state.path });
diff --git a/src/components/CheckTaskWrapper.vue b/src/components/CheckTaskWrapper.vue
index 32e510e7..8c1d9d78 100644
--- a/src/components/CheckTaskWrapper.vue
+++ b/src/components/CheckTaskWrapper.vue
@@ -12,9 +12,10 @@
       @shortkey="$hotkeyHelpers.focusField($refs, 'form')"
     >
       <v-form ref="form" v-model="valid" lazy-validation>
-        <div class="" v-for="task in tasks" :key="task.id">
+        <div v-for="task in tasks" :key="task.id">
           <v-checkbox
-            v-model="task.checked"
+            :value="task.checked"
+            @change="(val) => handleTaskCheck(task.id, val)"
             :rules="rules(task.required)"
             :label="`${task.content}`"
             dense
@@ -73,6 +74,12 @@ export default {
     },
   },
   methods: {
+    handleTaskCheck(taskId, checked) {
+      this.$store.commit("togglePreSessionTask", {
+        taskId,
+        checked: !!checked,
+      });
+    },
     rules(required) {
       if (required) {
         return [(v) => !!v || this.$tc("caption.required_checkbox", 1)];
diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 0c8963c8..7f346b6c 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -714,7 +714,6 @@ import NewSessionDialog from "./dialogs/NewSessionDialog.vue";
 import DurationConfirmDialog from "./dialogs/DurationConfirmDialog.vue";
 import AudioErrorDialog from "./dialogs/AudioErrorDialog.vue";
 import EndSessionDialog from "./dialogs/EndSessionDialog.vue";
-//import MinimizeControlWrapper from "../components/MinimizeControlWrapper.vue";
 import JiraExportSession from "./jira/JiraExportSession";
 import TestRailExportSession from "./testrail/TestRailExportSession";
 
@@ -723,7 +722,6 @@ import JiraAddIssue from "./jira/JiraAddIssue";
 import {
   DEFAULT_MAP_CONNECTIONS,
   DEFAULT_MAP_NODES,
-  IPC_BIND_KEYS,
   IPC_FUNCTIONS,
   IPC_HANDLERS,
   SESSION_STATUSES,
@@ -753,7 +751,6 @@ export default {
     DurationConfirmDialog,
     AudioErrorDialog,
     EndSessionDialog,
-    //MinimizeControlWrapper,
     JiraExportSession,
     TestRailExportSession,
     JiraAddIssue,
@@ -826,6 +823,7 @@ export default {
   computed: {
     ...mapGetters({
       hotkeys: "config/hotkeys",
+      postSessionData: "config/postSessionData",
       config: "config/fullConfig",
       credentials: "auth/credentials",
     }),
@@ -886,10 +884,6 @@ export default {
         this.hotkeys
       );
     },
-    postSessionData() {
-      if (this.config.checklist) return this.config.checklist.postsession;
-      else return {};
-    },
     elapsedTime() {
       const timer = this.timer;
       const date = new Date(null);
@@ -946,23 +940,11 @@ export default {
     };
   },
   mounted() {
-    // new session
-    window.ipc.on("NEW_SESSION", () => {
-      this.callback = () => this.startNewSessionFromFileMenu();
-      this.handleNewSessionDialog();
-    });
-
-    // save session
-    window.ipc.on("SAVE_SESSION", () => {
-      this.saveSession(() => {
-        this.handleSaveConfirmDialog();
-      });
-    });
-
-    // reset session
-    window.ipc.on("RESET_SESSION", () => {
-      this.resetConfirmDialog = true;
-    });
+    if (this.$isElectron) {
+      this.$electronService.onNewSession(this.newSession);
+      this.$electronService.onSaveSession(this.handleSaveConfirmDialog);
+      this.$electronService.onResetSession(this.showResetConfirmDialog);
+    }
 
     this.$root.$on("close-sourcepickerdialog", this.hideSourcePickerDialog);
     this.$root.$on("close-notedialog", this.hideNoteDialog);
@@ -990,7 +972,6 @@ export default {
     ) {
       this.showSourcePickerDialog();
     }
-    this.bindIPCEvent();
   },
   beforeDestroy() {
     this.$root.$off("close-sourcepickerdialog", this.hideSourcePickerDialog);
@@ -1000,6 +981,13 @@ export default {
     this.timer = 0;
   },
   methods: {
+    showResetConfirmDialog() {
+      this.resetConfirmDialog = true;
+    },
+    newSession() {
+      this.callback = () => this.startNewSessionFromFileMenu();
+      this.handleNewSessionDialog();
+    },
     openIssueMenu() {
       this.issueCreateDestinationMenu = true;
       setTimeout(() => {
@@ -1009,70 +997,6 @@ export default {
           .focus();
       }, 150); // TODO - this is probably prone to race conditions
     },
-    bindIPCEvent() {
-      if (!window.ipc) return;
-
-      window.ipc.on(IPC_BIND_KEYS.CLOSED_NOTE_DIALOG, (data) => {
-        this.addNote(data);
-      });
-      window.ipc.on(IPC_BIND_KEYS.CLOSED_SUMMARY_DIALOG, (data) => {
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.CLOSE_SESSION_AND_MINIIMIZED_WINDOW,
-          data: {
-            data: {
-              status: this.status,
-              timer: this.timer,
-              duration: this.duration,
-              sourceId: this.sourceId,
-              summary: data,
-            },
-            bindKey: IPC_BIND_KEYS.END_SESSION,
-          },
-        });
-      });
-      window.ipc.on(IPC_BIND_KEYS.CLOSED_ENDSESSION_DIALOG, (data) => {
-        if (data.passed) {
-          this.showSummaryDialog();
-        }
-      });
-      window.ipc.on(IPC_BIND_KEYS.CLOSED_SOURCEPICKER_DIALOG, (data) => {
-        if (data.sourceId) {
-          this.sourceId = data.sourceId;
-          this.$root.$emit("source-id-changed", this.sourceId);
-        }
-      });
-      window.ipc.on(IPC_BIND_KEYS.END_SESSION, (data) => {
-        if (data) {
-          this.timer = data.timer;
-          this.status = data.status;
-          this.duration = data.duration;
-          this.sourceId = data.sourceId;
-          this.updateStoreSession();
-          if (data.summary) {
-            this.addSummary(data.summary);
-          } else {
-            this.endSessionProcess();
-          }
-        } else {
-          this.endSessionProcess();
-        }
-      });
-      window.ipc.on(IPC_BIND_KEYS.CLOSED_MINIMIZE_WINDOW, (data) => {
-        this.status = data.status;
-        this.duration = data.duration;
-        this.timer = data.timer;
-        this.sourceId = data.sourceId;
-
-        if (
-          this.status !== data.status &&
-          data.status === SESSION_STATUSES.START
-        ) {
-          this.startSession(this.sourceId);
-        } else if (data.status === SESSION_STATUSES.PAUSE) {
-          this.pauseSession();
-        }
-      });
-    },
     handleNewSessionDialog() {
       this.newSessionDialog = true;
       setTimeout(() => {
@@ -1101,61 +1025,29 @@ export default {
       }, 100);
     },
     fetchSources() {
-      return new Promise(function (resolver, reject) {
-        if (!window.ipc) return reject();
-        window.ipc
-          .invoke(IPC_HANDLERS.CAPTURE, {
-            func: IPC_FUNCTIONS.GET_MEDIA_SOURCE,
-          })
-          .then((data) => {
-            return resolver(data);
-          });
-      });
+      if (this.$isElectron) {
+        return this.$electronService.getMediaSource();
+      }
+      // todo implement web version for this functionality
     },
-    showSourcePickerDialog() {
-      this.fetchSources().then((data) => {
+    async showSourcePickerDialog() {
+      try {
+        let data = await this.fetchSources();
         this.loaded = true;
         this.sources = data.filter((source) => source.name !== "yattie");
-        if (this.viewMode === "normal") {
-          this.sourcePickerDialog = true;
-        } else {
-          window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-            func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
-            data: {
-              path: "sourcepicker",
-              size: {
-                width: 600,
-                height: 500,
-              },
-              data: this.sources,
-            },
-          });
-        }
-      });
+        this.sourcePickerDialog = true;
+      } catch (err) {
+        console.log(err);
+      }
     },
     hideSourcePickerDialog() {
       this.sourcePickerDialog = false;
     },
     showNoteDialog() {
-      if (this.viewMode === "normal") {
-        this.noteDialog = true;
-        setTimeout(() => {
-          this.$refs.noteDialog.$refs.comment.editor.commands.focus();
-        });
-      } else {
-        if (!window.ipc) return;
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
-          data: {
-            path: "noteEditor",
-            size: {
-              width: 500,
-              height: 550,
-            },
-            data: this.config,
-          },
-        });
-      }
+      this.noteDialog = true;
+      setTimeout(() => {
+        this.$refs.noteDialog.$refs.comment.editor.commands.focus();
+      });
     },
     hideNoteDialog() {
       this.noteDialog = false;
@@ -1239,11 +1131,9 @@ export default {
         });
       }
 
-      if (this.viewMode === "normal") {
-        const currentPath = this.$router.history.current.path;
-        if (currentPath !== "/main/workspace") {
-          await this.$router.push({ path: "/main/workspace" });
-        }
+      const currentPath = this.$router.history.current.path;
+      if (currentPath !== "/main/workspace") {
+        await this.$router.push({ path: "/main/workspace" });
       }
     },
     pauseSession() {
@@ -1290,44 +1180,14 @@ export default {
       this.$router.push({ path: "/result" }).catch(() => {});
     },
     showSummaryDialog() {
-      if (this.viewMode === "normal") {
-        this.summaryDialog = true;
+      this.summaryDialog = true;
 
-        setTimeout(() => {
-          this.$refs.summaryDialog.$refs.comment.editor.commands.focus();
-        }, 200);
-      } else {
-        if (!window.ipc) return;
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
-          data: {
-            path: "summaryEditor",
-            size: {
-              width: 500,
-              height: 500,
-            },
-            data: this.config,
-          },
-        });
-      }
+      setTimeout(() => {
+        this.$refs.summaryDialog.$refs.comment.editor.commands.focus();
+      }, 200);
     },
     showEndSessionDialog() {
-      if (this.viewMode === "normal") {
-        this.endSessionDialog = true;
-      } else {
-        if (!window.ipc) return;
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
-          data: {
-            path: "endsession",
-            size: {
-              width: 450,
-              height: 500,
-            },
-            data: this.config,
-          },
-        });
-      }
+      this.endSessionDialog = true;
     },
     closeEndSessionDialog(status) {
       this.endSessionDialog = false;
@@ -1977,13 +1837,6 @@ export default {
         data: { sessionStatus: status },
       });
     },
-    async showNotePanel() {
-      if (!window.ipc) return;
-      await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.OPEN_NOTES_WINDOW,
-        data: { width: 700, height: 800 },
-      });
-    },
   },
 };
 </script>
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 9eeb64a3..44aa4e30 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -6,6 +6,14 @@ export default class ElectronService {
     window.ipc.on("NEW_SESSION", callback);
   }
 
+  onSaveSession(callback) {
+    window.ipc.on("SAVE_SESSION", callback);
+  }
+
+  onResetSession(callback) {
+    window.ipc.on("RESET_SESSION", callback);
+  }
+
   onDataChange(callback) {
     window.ipc.on("DATA_CHANGE", callback);
   }
@@ -69,4 +77,10 @@ export default class ElectronService {
       },
     });
   }
+
+  async getMediaSource() {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.GET_MEDIA_SOURCE,
+    });
+  }
 }
diff --git a/src/store/index.js b/src/store/index.js
index 135aaee2..c8364c06 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -13,6 +13,7 @@ Vue.use(Vuex);
 
 export default new Vuex.Store({
   state: {
+    id: null,
     title: "",
     charter: {
       content: "",
@@ -33,8 +34,9 @@ export default new Vuex.Store({
     ended: "",
     quickTest: false,
     path: "",
+    preSessionTasks: [],
+    postSessionTasks: [],
   },
-  getters: {},
   mutations: {
     setTitle(state, payload) {
       state.title = payload;
@@ -140,6 +142,20 @@ export default new Vuex.Store({
       state.path = payload.path;
       this._vm.$storageService.updateState(state);
     },
+    setPreSessionTasks(state, payload) {
+      state.preSessionTasks = payload;
+    },
+    togglePreSessionTask(state, { taskId, checked }) {
+      const taskIndex = state.preSessionTasks.findIndex(
+        (task) => task.id === taskId
+      );
+      if (taskIndex !== -1) {
+        state.preSessionTasks[taskIndex].checked = checked;
+      }
+    },
+    setPostSessionTasks(state, payload) {
+      state.postSessionTasks = payload;
+    },
   },
   actions: {
     // async resetState(context, payload) {
@@ -151,6 +167,14 @@ export default new Vuex.Store({
     //   context.commit("restoreState", payload);
     // },
   },
+  getters: {
+    uncheckedRequiredPresessionTaskExist(state) {
+      const uncheckedTasks = state.preSessionTasks.filter(
+        (task) => !task.checked && task.required
+      );
+      return uncheckedTasks.length === 0;
+    },
+  },
   modules: {
     auth,
     config,
diff --git a/src/store/modules/config.js b/src/store/modules/config.js
index 438365f9..ea56453a 100644
--- a/src/store/modules/config.js
+++ b/src/store/modules/config.js
@@ -38,6 +38,7 @@ export const config = {
     checklistPresessionStatus: (state) => state.checklist.presession.status,
     checklistPresessionTasks: (state) => state.checklist.presession.tasks,
     isAiAssistEnabled: (state) => state.ai?.enabled || false,
+    postSessionData: (state) => state.checklist.postsession,
     checklistPostsessionStatus: (state) =>
       state?.checklist?.postsession?.status,
     checklistPostsessionTasks: (state) => state.checklist.postsession.tasks,
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 0dcdb992..a9601dc2 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -73,7 +73,10 @@
       <v-tabs-items v-model="activeTab">
         <v-tab-item value="/main" :transition="false">
           <TestWrapper />
-          <CheckTaskWrapper v-if="showCheckList" :tasks="presession.tasks" />
+          <CheckTaskWrapper
+            v-if="showCheckList"
+            :tasks="$store.state.preSessionTasks"
+          />
         </v-tab-item>
         <v-tab-item value="/main/workspace" :transition="false">
           <WorkspaceWrapper
@@ -90,7 +93,7 @@
         :items="items"
         @add-item="addItem"
         :selectedItems="selected"
-        :checkedStatusOfPreSessionTask="uncheckedRequiredPresessionTaskExist"
+        :checkedStatusOfPreSessionTask="presessionValid"
         view-mode="normal"
       />
       <TimeCounter v-if="$store.state.status !== 'pending'" />
@@ -137,7 +140,6 @@ export default {
       items: [],
       selected: [],
       activeSession: {},
-      presession: {},
       showTaskError: false,
       showMenu: false,
     };
@@ -164,14 +166,11 @@ export default {
       isAuthenticated: "auth/isAuthenticated",
       credentials: "auth/credentials",
     }),
-    uncheckedRequiredPresessionTaskExist() {
-      if (!this.presession.status) {
+    presessionValid() {
+      if (!this.checklistPresessionStatus) {
         return true;
       } else {
-        const uncheckedTasks = this.presession.tasks.filter(
-          (task) => !task.checked && task.required
-        );
-        return uncheckedTasks.length === 0;
+        return this.$store.getters["uncheckedRequiredPresessionTaskExist"];
       }
     },
     backHotkey() {
@@ -183,18 +182,18 @@ export default {
     showCheckList() {
       return (
         this.$store.state.status === SESSION_STATUSES.PENDING &&
-        this.presession.status
+        this.checklistPresessionStatus
       );
     },
   },
   methods: {
     setInitialPresession() {
-      this.presession = {
-        status: this.checklistPresessionStatus,
-        tasks: this.checklistPresessionTasks.map((task) => {
+      this.$store.commit(
+        "setPreSessionTasks",
+        this.checklistPresessionTasks.map((task) => {
           return { ...task, checked: false };
-        }),
-      };
+        })
+      );
     },
     async fetchItems() {
       this.items = await this.$storageService.getItems();

From 04b2e0f5b1eab6f1781ad467e4cc787721c21510 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 15 Dec 2023 18:05:48 +0200
Subject: [PATCH 15/41] ControlPanel.vue refactored, moved all electron logic
 to services

---
 src/components/ControlPanel.vue               | 340 +++++++-----------
 src/modules/FileSystemUtility.js              |   5 +-
 src/services/electronService.js               |  35 ++
 .../storage-options/localJsonDbService.js     |  34 ++
 .../storage-options/restApiService.js         |  20 ++
 src/services/storageInterface.js              |   5 +
 src/services/storageService.js                |  20 ++
 src/store/index.js                            |   4 +
 8 files changed, 246 insertions(+), 217 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 7f346b6c..45a3fd45 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -722,8 +722,6 @@ import JiraAddIssue from "./jira/JiraAddIssue";
 import {
   DEFAULT_MAP_CONNECTIONS,
   DEFAULT_MAP_NODES,
-  IPC_FUNCTIONS,
-  IPC_HANDLERS,
   SESSION_STATUSES,
   STATUSES,
   VIDEO_RESOLUTION,
@@ -1107,29 +1105,30 @@ export default {
         this.changeSessionStatus(SESSION_STATUSES.START);
       }
 
-      const sessionId = await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.GET_SESSION_ID,
-      });
+      // creating new session ID here
+      let sessionId = null;
+      if (!this.$store.state.id) {
+        sessionId = this.$store.state.id;
+      } else {
+        sessionId = uuidv4();
+        this.$store.commit("setSessionId", sessionId);
+      }
 
-      if (sessionId === "") {
-        const data = {
-          title: this.$store.state.title,
-          charter: this.$store.state.charter,
-          preconditions: this.$store.state.preconditions,
-          duration: this.$store.state.duration,
-          status: this.$store.state.status,
-          timer: this.$store.state.timer,
-          started: this.$store.state.started,
-          ended: this.$store.state.ended,
-          quickTest: this.$store.state.quickTest,
-          path: this.$route.path,
-        };
+      const data = {
+        id: sessionId,
+        title: this.$store.state.title,
+        charter: this.$store.state.charter,
+        preconditions: this.$store.state.preconditions,
+        duration: this.$store.state.duration,
+        status: this.$store.state.status,
+        timer: this.$store.state.timer,
+        started: this.$store.state.started,
+        ended: this.$store.state.ended,
+        quickTest: this.$store.state.quickTest,
+        path: this.$route.path,
+      };
 
-        window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-          func: IPC_FUNCTIONS.CREATE_NEW_SESSION,
-          data: data,
-        });
-      }
+      await this.$storageService.createNewSession(data);
 
       const currentPath = this.$router.history.current.path;
       if (currentPath !== "/main/workspace") {
@@ -1168,14 +1167,8 @@ export default {
       this.status = SESSION_STATUSES.END;
       this.changeSessionStatus(SESSION_STATUSES.END);
       this.stopInterval();
-      if (window.ipc) {
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
-          data: {
-            width: 1440,
-            height: 900,
-          },
-        });
+      if (this.$isElectron) {
+        this.$electronService.setWindowSize({ width: 1440, height: 900 });
       }
       this.$router.push({ path: "/result" }).catch(() => {});
     },
@@ -1203,14 +1196,8 @@ export default {
       if (currentPath !== "/main/workspace") {
         this.$router.push({ path: "/main/workspace" });
       }
-      if (window.ipc) {
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
-          data: {
-            width: 800,
-            height: 600,
-          },
-        });
+      if (this.$isElectron) {
+        this.$electronService.setWindowSize({ width: 800, height: 600 });
       }
     },
     end() {
@@ -1252,29 +1239,26 @@ export default {
           ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
           video.remove();
           const imgURI = canvas.toDataURL("image/png");
-          if (!window.ipc) return;
 
-          const { status, message, item } = await window.ipc.invoke(
-            IPC_HANDLERS.CAPTURE,
-            {
-              func: IPC_FUNCTIONS.CREATE_IMAGE,
-              data: { url: imgURI },
-            }
-          );
+          if (this.$isElectron) {
+            // todo add web implementation
+            const { status, message, item } =
+              this.$electronService.createImage(imgURI);
 
-          if (status === STATUSES.ERROR) {
-            this.$root.$emit("set-snackbar", message);
-            console.log(message);
-          } else {
-            const data = {
-              id: item.id,
-              sessionType: "Screenshot",
-              fileType: "image",
-              fileName: item.fileName,
-              filePath: item.filePath,
-              timer_mark: this.timer,
-            };
-            this.openAddWindow(data);
+            if (status === STATUSES.ERROR) {
+              this.$root.$emit("set-snackbar", message);
+              console.log(message);
+            } else {
+              const data = {
+                id: item.id,
+                sessionType: "Screenshot",
+                fileType: "image",
+                fileName: item.fileName,
+                filePath: item.filePath,
+                timer_mark: this.timer,
+              };
+              await this.openAddWindow(data);
+            }
           }
         };
       };
@@ -1333,19 +1317,17 @@ export default {
             ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
             video.remove();
             const imgURI = canvas.toDataURL("image/png");
-            const { status, message, item } = await window.ipc.invoke(
-              IPC_HANDLERS.CAPTURE,
-              {
-                func: IPC_FUNCTIONS.CREATE_IMAGE,
-                data: { url: imgURI, isPoster: true },
-              }
-            );
 
-            if (status === STATUSES.ERROR) {
-              this.$root.$emit("set-snackbar", message);
-              console.log("Unable to generate poster for video: " + message);
+            if (this.$isElectron) {
+              const { status, message, item } =
+                await this.$electronService.createImage(imgURI, true);
+
+              if (status === STATUSES.ERROR) {
+                this.$root.$emit("set-snackbar", message);
+                console.log("Unable to generate poster for video: " + message);
+              }
+              poster = item.filePath;
             }
-            poster = item.filePath;
           };
         };
         mediaRecorder.ondataavailable = (e) => {
@@ -1357,31 +1339,26 @@ export default {
           this.recordVideoStarted = false;
           const blob = new Blob(frames, { type: "video/webm;codecs=h264" });
           const buffer = await blob.arrayBuffer();
-          if (!window.ipc) return;
 
-          const { status, message, item } = await window.ipc.invoke(
-            IPC_HANDLERS.CAPTURE,
-            {
-              func: IPC_FUNCTIONS.CREATE_VIDEO,
-              data: { buffer: buffer },
+          if (this.$isElectron) {
+            const { status, message, item } =
+              await this.$electronService.createVideo(buffer);
+            if (status === STATUSES.ERROR) {
+              this.$root.$emit("set-snackbar", message);
+              console.log(message);
+            } else {
+              const { id, fileName, filePath } = item;
+              const data = {
+                id,
+                sessionType: "Video",
+                fileType: "video",
+                fileName,
+                filePath,
+                poster: poster,
+                timer_mark: this.timer,
+              };
+              await this.openAddWindow(data);
             }
-          );
-
-          if (status === STATUSES.ERROR) {
-            this.$root.$emit("set-snackbar", message);
-            console.log(message);
-          } else {
-            const { id, fileName, filePath } = item;
-            const data = {
-              id,
-              sessionType: "Video",
-              fileType: "video",
-              fileName,
-              filePath,
-              poster: poster,
-              timer_mark: this.timer,
-            };
-            this.openAddWindow(data);
           }
         };
         frames = [];
@@ -1490,30 +1467,27 @@ export default {
             type: "audio/mpeg-3",
           });
           const buffer = await blob.arrayBuffer();
-          const { status, message, item } = await window.ipc.invoke(
-            IPC_HANDLERS.CAPTURE,
-            {
-              func: IPC_FUNCTIONS.CREATE_AUDIO,
-              data: { buffer: buffer },
-            }
-          );
+          if (this.$isElectron) {
+            const { status, message, item } =
+              await this.$electronService.createAudio(buffer);
 
-          if (status === STATUSES.ERROR) {
-            this.$root.$emit("set-snackbar", message);
-            console.log(message);
-          } else {
-            const data = {
-              id: item.id,
-              sessionType: "Audio",
-              fileType: "audio",
-              fileName: item.fileName,
-              filePath: item.filePath,
-              timer_mark: this.timer,
-              poster: "",
-            };
-            this.openAddWindow(data);
+            if (status === STATUSES.ERROR) {
+              this.$root.$emit("set-snackbar", message);
+              console.log(message);
+            } else {
+              const data = {
+                id: item.id,
+                sessionType: "Audio",
+                fileType: "audio",
+                fileName: item.fileName,
+                filePath: item.filePath,
+                timer_mark: this.timer,
+                poster: "",
+              };
+              await this.openAddWindow(data);
+            }
+            recordedChunks = [];
           }
-          recordedChunks = [];
         };
         mediaRecorder.start(1000);
       };
@@ -1554,23 +1528,14 @@ export default {
       }
     },
     async openAddWindow(data) {
-      if (!window.ipc) return;
-      await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.OPEN_ADD_WINDOW,
-        data: { width: 700, height: 800, data: data },
-      });
+      if (this.$isElectron) {
+        await this.$electronService.openAddWindow(data);
+      }
     },
     async addNote(data) {
-      if (!window.ipc) return;
-      // Save Note
-      const { status, message, item } = await window.ipc.invoke(
-        IPC_HANDLERS.CAPTURE,
-        {
-          func: IPC_FUNCTIONS.SAVE_NOTE,
-          data: data.comment,
-        }
+      const { status, message, item } = await this.$storageService.saveNote(
+        data.comment
       );
-
       if (status === STATUSES.ERROR) {
         this.$root.$emit("set-snackbar", message);
         console.log(message);
@@ -1615,7 +1580,7 @@ export default {
         this.$emit("add-item", data);
       }
       this.summaryDialog = false;
-      this.endSessionProcess();
+      await this.endSessionProcess();
     },
     addMindmap() {
       // TODO - With transition to try mindmap format, UUID generation should
@@ -1635,52 +1600,24 @@ export default {
       };
       this.openAddWindow(data);
     },
-    async minimize() {
-      const data = {
-        status: this.status,
-        timer: this.timer,
-        duration: this.duration,
-        sourceId: this.sourceId,
-      };
-      localStorage.setItem("state-data", JSON.stringify(data));
-      if (!window.ipc) return;
-      await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.OPEN_MINIMIZE_WINDOW,
-        data: { width: 400, height: 84 },
-      });
-    },
     async deleteItems() {
-      if (!window.ipc) return;
-      await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.DELETE_ITEMS,
-        data: this.selected,
-      });
-      await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.DELETE_NOTES,
-        data: this.selected,
-      });
+      await this.$storageService.deleteItems(this.selected);
       this.selected = [];
       this.$root.$emit("update-selected", this.selected);
       this.deleteConfirmDialog = false;
     },
     async exportItems() {
-      if (window.ipc) {
-        await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-          func: IPC_FUNCTIONS.EXPORT_ITEMS,
-          data: this.selected,
-        });
+      if (this.$isElectron) {
+        await this.$electronService.exportItems(this.selected);
+        this.selected = [];
+        this.$root.$emit("update-selected", this.selected);
       }
-      this.selected = [];
-      this.$root.$emit("update-selected", this.selected);
+      // todo add web handler for items export
     },
     async saveSession(callback = null) {
       this.newSessionDialog = false;
-      const sessionId = await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.GET_SESSION_ID,
-      });
-
       const data = {
-        id: sessionId,
+        id: this.$store.state.id,
         title: this.$store.state.title,
         charter: this.$store.state.charter,
         mindmap: this.$store.state.mindmap,
@@ -1693,11 +1630,7 @@ export default {
         quickTest: this.$store.state.quickTest,
         path: this.$route.path,
       };
-      if (!window.ipc) return;
-      const { status } = await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-        func: IPC_FUNCTIONS.SAVE_SESSION,
-        data: data,
-      });
+      const { status } = await this.$storageService.saveSession(data);
       if (status === STATUSES.SUCCESS && callback) {
         callback();
       }
@@ -1716,21 +1649,14 @@ export default {
       // Resetting state variables and store
       this.$store.commit("clearState");
 
-      // Set window size
-      if (window.ipc) {
-        window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-          func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
-          data: {
-            width: 800,
-            height: 600,
-          },
-        });
+      if (this.$isElectron) {
+        this.$electronService.setWindowSize({ width: 800, height: 600 });
       }
 
       // Navigate to main page if not already there
       const currentPath = this.$router.history.current.path;
       if (currentPath !== "/main") {
-        this.$router.push({ path: "/main" });
+        await this.$router.push({ path: "/main" });
       }
     },
     async newSessionFromButton() {
@@ -1753,10 +1679,12 @@ export default {
       this.audioErrorDialog = false;
       this.endSessionDialog = false;
 
-      // Persist data to filesystem
-      if (!window.ipc) return;
+      // creating new session ID here
+      let sessionId = uuidv4();
+      this.$store.commit("setSessionId", sessionId);
 
       const data = {
+        id: sessionId,
         title: this.$store.state.title,
         charter: this.$store.state.charter,
         preconditions: this.$store.state.preconditions,
@@ -1769,14 +1697,8 @@ export default {
         path: this.$route.path,
       };
 
-      await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-        func: IPC_FUNCTIONS.CREATE_NEW_SESSION,
-        data: data,
-      });
-
-      await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.RESET_DATA,
-      });
+      await this.$storageService.createNewSession(data);
+      await this.$storageService.resetData();
 
       // Stop any ongoing intervals
       this.stopInterval();
@@ -1796,25 +1718,15 @@ export default {
 
       this.$store.commit("resetState");
 
-      if (!window.ipc) return;
-      await window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.RESET_DATA,
-        })
-        .then(() => {
-          window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-            func: IPC_FUNCTIONS.SET_WINDOW_SIZE,
-            data: {
-              width: 800,
-              height: 600,
-            },
-          });
-          this.stopInterval();
-          const currentPath = this.$router.history.current.path;
-          if (currentPath !== "/main") {
-            this.$router.push({ path: "/main" });
-          }
-        });
+      await this.$storageService.resetData();
+      if (this.$isElectron) {
+        await this.$electronService.setWindowSize({ width: 800, height: 600 });
+      }
+      this.stopInterval();
+      const currentPath = this.$router.history.current.path;
+      if (currentPath !== "/main") {
+        await this.$router.push({ path: "/main" });
+      }
     },
     getCurrentDateTime() {
       const now = new Date();
@@ -1831,11 +1743,9 @@ export default {
       return currentDateTime;
     },
     changeSessionStatus(status) {
-      if (!window.ipc) return;
-      window.ipc.invoke(IPC_HANDLERS.MENU, {
-        func: IPC_FUNCTIONS.CHANGE_MENUITEM_STATUS,
-        data: { sessionStatus: status },
-      });
+      if (this.$isElectron) {
+        this.$electronService.changeMenuBySessionStatus(status);
+      }
     },
   },
 };
diff --git a/src/modules/FileSystemUtility.js b/src/modules/FileSystemUtility.js
index c4a1a17c..0e5806ee 100644
--- a/src/modules/FileSystemUtility.js
+++ b/src/modules/FileSystemUtility.js
@@ -61,7 +61,8 @@ module.exports.exportItems = async (ids) => {
 };
 
 module.exports.createNewSession = async (state) => {
-  state.id = uuidv4();
+  console.log("state ID", state.id);
+  // state.id = uuidv4();
   const dataFolder = path.join(configDir, "sessions", state.id);
   if (!fs.existsSync(dataFolder)) {
     fs.mkdirSync(dataFolder, { recursive: true });
@@ -173,7 +174,7 @@ module.exports.openSession = async () => {
     const encoded = fs.readFileSync(metaPath, "utf8");
     const state = JSON.parse(Buffer.from(encoded, "hex").toString());
 
-    const id = state.id || uuidv4();
+    const id = state.id;
     const dataFolder = path.join(configDir, "sessions", id);
     if (fs.existsSync(dataFolder)) {
       fs.rmdirSync(dataFolder);
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 44aa4e30..126d7196 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -83,4 +83,39 @@ export default class ElectronService {
       func: IPC_FUNCTIONS.GET_MEDIA_SOURCE,
     });
   }
+
+  async createImage(imgURI, isPoster = false) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.CREATE_IMAGE,
+      data: { url: imgURI, isPoster },
+    });
+  }
+
+  async createVideo(buffer) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.CREATE_VIDEO,
+      data: { buffer },
+    });
+  }
+
+  async createAudio(buffer) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.CREATE_AUDIO,
+      data: { buffer },
+    });
+  }
+
+  async exportItems(items) {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.EXPORT_ITEMS,
+      data: items,
+    });
+  }
+
+  async changeMenuBySessionStatus(sessionStatus) {
+    return await window.ipc.invoke(IPC_HANDLERS.MENU, {
+      func: IPC_FUNCTIONS.CHANGE_MENUITEM_STATUS,
+      data: { sessionStatus },
+    });
+  }
 }
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index 3dabebea..ea24c947 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -54,6 +54,13 @@ export default class LocalJsonDbService extends StorageInterface {
     });
   }
 
+  async deleteItems(items) {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.DELETE_ITEMS,
+      data: items,
+    });
+  }
+
   async getNotes() {
     return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
       func: IPC_FUNCTIONS.GET_NOTES,
@@ -66,4 +73,31 @@ export default class LocalJsonDbService extends StorageInterface {
       data: notes,
     });
   }
+
+  async createNewSession(data) {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.CREATE_NEW_SESSION,
+      data: data,
+    });
+  }
+
+  async saveSession(data) {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.SAVE_SESSION,
+      data: data,
+    });
+  }
+
+  async resetData() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.RESET_DATA,
+    });
+  }
+
+  async saveNote(note) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.SAVE_NOTE,
+      data: note,
+    });
+  }
 }
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index b9238bbb..87bddc57 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -43,6 +43,10 @@ export default class RestApiService extends StorageInterface {
     // saving state endpoint here
   }
 
+  async deleteItems(items) {
+    console.log(items);
+  }
+
   async getNotes() {
     const response = await axios.get(`http://localhost:3000/notes`);
     return response.data;
@@ -52,4 +56,20 @@ export default class RestApiService extends StorageInterface {
     console.log(notes);
     // saving notes endpoint here
   }
+
+  async createNewSession(data) {
+    console.log(data);
+  }
+
+  async saveSession(data) {
+    console.log(data);
+  }
+
+  async resetData() {
+    console.log("Reset data request goes here");
+  }
+
+  async saveNote() {
+    console.log("Save Note");
+  }
 }
diff --git a/src/services/storageInterface.js b/src/services/storageInterface.js
index 82cbe1de..742460bf 100644
--- a/src/services/storageInterface.js
+++ b/src/services/storageInterface.js
@@ -43,4 +43,9 @@ export default class StorageInterface {
   async updateNotes(notes) {
     throw new Error("Method 'updateNotes()' must be implemented.");
   }
+
+  // eslint-disable-next-line
+  async createNewSession(state) {
+    throw new Error("Method 'createNewSession(state)' must be implemented.");
+  }
 }
diff --git a/src/services/storageService.js b/src/services/storageService.js
index 7672877e..48da2246 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -40,6 +40,10 @@ export default class StorageService {
     return this.storage.updateItems(items);
   }
 
+  async deleteItems(items) {
+    return this.storage.deleteItems(items);
+  }
+
   async getNotes() {
     return await this.storage.getNotes();
   }
@@ -47,4 +51,20 @@ export default class StorageService {
   async updateNotes(notes) {
     return this.storage.updateNotes(notes);
   }
+
+  async createNewSession(data) {
+    return this.storage.createNewSession(data);
+  }
+
+  async saveSession(data) {
+    return await this.storage.saveSession(data);
+  }
+
+  async resetData() {
+    return this.storage.resetData();
+  }
+
+  async saveNote(note) {
+    return this.storage.saveNote(note);
+  }
 }
diff --git a/src/store/index.js b/src/store/index.js
index c8364c06..df61bbf4 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -38,6 +38,10 @@ export default new Vuex.Store({
     postSessionTasks: [],
   },
   mutations: {
+    setSessionId(state, payload) {
+      state.id = payload;
+      this._vm.$storageService.updateState(state);
+    },
     setTitle(state, payload) {
       state.title = payload;
       this._vm.$storageService.updateState(state);

From 8587f180cd7415a408c8783a5c975c73871f9b4a Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Sat, 16 Dec 2023 14:10:08 +0200
Subject: [PATCH 16/41] refactoring, fixed presession and postsession logic,
 fixed state id problem on initial app load

---
 src/components/CheckTaskWrapper.vue         | 11 ++---
 src/components/ControlPanel.vue             | 11 ++---
 src/components/dialogs/EndSessionDialog.vue | 54 ++++++++-------------
 src/modules/FileSystemUtility.js            |  6 ++-
 src/store/index.js                          | 16 +++++-
 src/views/MainView.vue                      | 28 +++++++++--
 6 files changed, 71 insertions(+), 55 deletions(-)

diff --git a/src/components/CheckTaskWrapper.vue b/src/components/CheckTaskWrapper.vue
index 8c1d9d78..1d6ad908 100644
--- a/src/components/CheckTaskWrapper.vue
+++ b/src/components/CheckTaskWrapper.vue
@@ -15,7 +15,7 @@
         <div v-for="task in tasks" :key="task.id">
           <v-checkbox
             :value="task.checked"
-            @change="(val) => handleTaskCheck(task.id, val)"
+            @change="(val) => $emit('taskToggle', task.id, val)"
             :rules="rules(task.required)"
             :label="`${task.content}`"
             dense
@@ -54,6 +54,9 @@ export default {
     this.$root.$on("start-new-session", () => {
       this.handleValidate();
     });
+    this.$root.$on("end-session", () => {
+      this.handleValidate();
+    });
   },
   computed: {
     ...mapGetters({
@@ -74,12 +77,6 @@ export default {
     },
   },
   methods: {
-    handleTaskCheck(taskId, checked) {
-      this.$store.commit("togglePreSessionTask", {
-        taskId,
-        checked: !!checked,
-      });
-    },
     rules(required) {
       if (required) {
         return [(v) => !!v || this.$tc("caption.required_checkbox", 1)];
diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 45a3fd45..5bd2c391 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -636,7 +636,7 @@
         ref="noteDialog"
         :configItem="config"
         :credentialItems="credentials"
-        @submit-note="addNote()"
+        @submit-note="addNote"
       />
       <SummaryDialog
         ref="summaryDialog"
@@ -692,9 +692,8 @@
       />
       <EndSessionDialog
         v-model="endSessionDialog"
-        :configItem="config"
         :post-session-data="postSessionData"
-        @proceed="closeEndSessionDialog()"
+        @proceed="closeEndSessionDialog"
       />
     </div>
   </v-container>
@@ -762,7 +761,7 @@ export default {
       type: Array,
       default: () => [],
     },
-    checkedStatusOfPreSessionTask: {
+    preSessionRequirementsMet: {
       type: Boolean,
       default: () => false,
     },
@@ -1003,7 +1002,7 @@ export default {
     },
     startNewSession() {
       this.$root.$emit("start-new-session");
-      if (!this.checkedStatusOfPreSessionTask) {
+      if (!this.preSessionRequirementsMet) {
         return;
       }
       this.newSessionFromButton();
@@ -1107,7 +1106,7 @@ export default {
 
       // creating new session ID here
       let sessionId = null;
-      if (!this.$store.state.id) {
+      if (this.$store.state.id) {
         sessionId = this.$store.state.id;
       } else {
         sessionId = uuidv4();
diff --git a/src/components/dialogs/EndSessionDialog.vue b/src/components/dialogs/EndSessionDialog.vue
index e44fdece..e914936b 100644
--- a/src/components/dialogs/EndSessionDialog.vue
+++ b/src/components/dialogs/EndSessionDialog.vue
@@ -3,9 +3,8 @@
     <v-sheet outlined rounded>
       <v-card :style="{ backgroundColor: currentTheme.background }">
         <CheckTaskWrapper
-          :tasks="tasks"
-          :showError="showTaskError"
-          type="postsession"
+          :tasks="$store.state.postSessionTasks"
+          @taskToggle="handleTaskCheck"
         />
         <div class="footer">
           <v-btn
@@ -34,6 +33,7 @@
 </template>
 <script>
 import CheckTaskWrapper from "../CheckTaskWrapper.vue";
+import { mapGetters } from "vuex";
 
 export default {
   name: "EndSessionDialog",
@@ -41,38 +41,23 @@ export default {
     CheckTaskWrapper,
   },
   props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
     postSessionData: {
       type: Object,
       default: () => {},
     },
   },
   data() {
-    return {
-      config: this.configItem,
-      showTaskError: false,
-    };
-  },
-  watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
+    return {};
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+    }),
     confirmHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.save",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.save", this.hotkeys);
     },
     cancelHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.cancel",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.cancel", this.hotkeys);
     },
     tasks() {
       return this.postSessionData ? this.postSessionData.tasks : [];
@@ -86,18 +71,17 @@ export default {
     },
   },
   methods: {
-    endSession: function () {
-      const uncheckedTasks = this.postSessionData.tasks.filter(
-        (task) => !task.checked && task.required
-      );
-
-      if (uncheckedTasks.length > 0) {
-        this.showTaskError = true;
-        return;
+    handleTaskCheck(taskId, checked) {
+      this.$store.commit("togglePostSessionTask", {
+        taskId,
+        checked: !!checked,
+      });
+    },
+    endSession: async function () {
+      await this.$root.$emit("end-session");
+      if (this.$store.getters.requiredPostSessionTasksChecked) {
+        this.$emit("proceed", true);
       }
-
-      this.showTaskError = false;
-      this.$emit("proceed", true);
     },
     handleCancel: function () {
       this.$emit("proceed", false);
diff --git a/src/modules/FileSystemUtility.js b/src/modules/FileSystemUtility.js
index 0e5806ee..e10cf5d2 100644
--- a/src/modules/FileSystemUtility.js
+++ b/src/modules/FileSystemUtility.js
@@ -61,7 +61,7 @@ module.exports.exportItems = async (ids) => {
 };
 
 module.exports.createNewSession = async (state) => {
-  console.log("state ID", state.id);
+  console.log("createNewSession, state ID:", state.id);
   // state.id = uuidv4();
   const dataFolder = path.join(configDir, "sessions", state.id);
   if (!fs.existsSync(dataFolder)) {
@@ -151,6 +151,7 @@ module.exports.saveSession = async (data) => {
 };
 
 module.exports.openSession = async () => {
+  console.log("openSession");
   const { canceled, filePaths } = await dialog.showOpenDialog({
     properties: ["openFile"],
     filters: [{ name: "Test File", extensions: ["test"] }],
@@ -203,6 +204,7 @@ module.exports.openSession = async () => {
 };
 
 module.exports.exportSession = async (params) => {
+  console.log("exportSession");
   debugger;
   const timestamp = dayjs().format("YYYY-MM-DD_HH-mm-ss-ms");
   const id = databaseUtility.getSessionID();
@@ -317,6 +319,7 @@ module.exports.exportSession = async (params) => {
 };
 
 module.exports.openConfigFile = async () => {
+  console.log("openConfigFile");
   const { canceled, filePaths } = await dialog.showOpenDialog({
     properties: ["openFile"],
     filters: [{ name: "Config File", extensions: ["json"] }],
@@ -354,6 +357,7 @@ module.exports.openConfigFile = async () => {
 };
 
 module.exports.openCredentialsFile = async () => {
+  console.log("openCredentialsFile");
   const { canceled, filePaths } = await dialog.showOpenDialog({
     properties: ["openFile"],
     filters: [{ name: "Credentials File", extensions: ["json"] }],
diff --git a/src/store/index.js b/src/store/index.js
index df61bbf4..4ab45a66 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -160,6 +160,14 @@ export default new Vuex.Store({
     setPostSessionTasks(state, payload) {
       state.postSessionTasks = payload;
     },
+    togglePostSessionTask(state, { taskId, checked }) {
+      const taskIndex = state.postSessionTasks.findIndex(
+        (task) => task.id === taskId
+      );
+      if (taskIndex !== -1) {
+        state.postSessionTasks[taskIndex].checked = checked;
+      }
+    },
   },
   actions: {
     // async resetState(context, payload) {
@@ -172,12 +180,18 @@ export default new Vuex.Store({
     // },
   },
   getters: {
-    uncheckedRequiredPresessionTaskExist(state) {
+    requiredPreSessionTasksChecked(state) {
       const uncheckedTasks = state.preSessionTasks.filter(
         (task) => !task.checked && task.required
       );
       return uncheckedTasks.length === 0;
     },
+    requiredPostSessionTasksChecked(state) {
+      const uncheckedTasks = state.postSessionTasks.filter(
+        (task) => !task.checked && task.required
+      );
+      return uncheckedTasks.length === 0;
+    },
   },
   modules: {
     auth,
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index a9601dc2..0a469866 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -76,6 +76,7 @@
           <CheckTaskWrapper
             v-if="showCheckList"
             :tasks="$store.state.preSessionTasks"
+            @taskToggle="handleTaskCheck"
           />
         </v-tab-item>
         <v-tab-item value="/main/workspace" :transition="false">
@@ -93,7 +94,7 @@
         :items="items"
         @add-item="addItem"
         :selectedItems="selected"
-        :checkedStatusOfPreSessionTask="presessionValid"
+        :preSessionRequirementsMet="presessionValid"
         view-mode="normal"
       />
       <TimeCounter v-if="$store.state.status !== 'pending'" />
@@ -145,12 +146,14 @@ export default {
     };
   },
   mounted() {
-    this.setInitialPresession();
+    this.setInitialPreSession();
+    this.setInitialPostSession();
     this.fetchItems();
     this.$root.$on("update-selected", this.updateSelected);
     this.$root.$on("save-session", this.saveSession);
     this.$root.$on("new-session", () => {
-      this.setInitialPresession();
+      this.setInitialPreSession();
+      this.setInitialPostSession();
     });
 
     if (this.$isElectron) {
@@ -163,6 +166,7 @@ export default {
       hotkeys: "config/hotkeys",
       checklistPresessionStatus: "config/checklistPresessionStatus",
       checklistPresessionTasks: "config/checklistPresessionTasks",
+      checklistPostsessionTasks: "config/checklistPostsessionTasks",
       isAuthenticated: "auth/isAuthenticated",
       credentials: "auth/credentials",
     }),
@@ -170,7 +174,7 @@ export default {
       if (!this.checklistPresessionStatus) {
         return true;
       } else {
-        return this.$store.getters["uncheckedRequiredPresessionTaskExist"];
+        return this.$store.getters.requiredPreSessionTasksChecked;
       }
     },
     backHotkey() {
@@ -187,7 +191,13 @@ export default {
     },
   },
   methods: {
-    setInitialPresession() {
+    handleTaskCheck(taskId, checked) {
+      this.$store.commit("togglePreSessionTask", {
+        taskId,
+        checked: !!checked,
+      });
+    },
+    setInitialPreSession() {
       this.$store.commit(
         "setPreSessionTasks",
         this.checklistPresessionTasks.map((task) => {
@@ -195,6 +205,14 @@ export default {
         })
       );
     },
+    setInitialPostSession() {
+      this.$store.commit(
+        "setPostSessionTasks",
+        this.checklistPostsessionTasks.map((task) => {
+          return { ...task, checked: false };
+        })
+      );
+    },
     async fetchItems() {
       this.items = await this.$storageService.getItems();
     },

From fab10ef072f6d86551218a0456c0ec5fe85cb384 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 18 Dec 2023 10:27:13 +0200
Subject: [PATCH 17/41] refactored, investigated and fixed problem with summary
 dialog

---
 src/components/ControlPanel.vue               |  6 +++---
 src/components/dialogs/NoteDialog.vue         |  4 ++--
 src/components/dialogs/SourcePickerDialog.vue | 17 +++++++----------
 src/components/dialogs/SummaryDialog.vue      | 14 ++++++--------
 4 files changed, 18 insertions(+), 23 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 5bd2c391..7adffbcf 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -628,7 +628,6 @@
         :sources="sources"
         :sourceId="sourceId"
         :loaded="loaded"
-        :configItem="config"
         @submit-source="startSession()"
       />
       <NoteDialog
@@ -644,7 +643,7 @@
         :configItem="config"
         :credentialItems="credentials"
         :summary="summary"
-        @submit-summary="addSummary()"
+        @submit-summary="addSummary"
       />
       <DeleteConfirmDialog
         v-model="deleteConfirmDialog"
@@ -1184,7 +1183,8 @@ export default {
     closeEndSessionDialog(status) {
       this.endSessionDialog = false;
       if (status) {
-        this.summaryDialog = true;
+        this.showSummaryDialog();
+        // this.summaryDialog = true;
       }
     },
     resume() {
diff --git a/src/components/dialogs/NoteDialog.vue b/src/components/dialogs/NoteDialog.vue
index ea9918d4..5402dac8 100644
--- a/src/components/dialogs/NoteDialog.vue
+++ b/src/components/dialogs/NoteDialog.vue
@@ -253,7 +253,7 @@ export default {
       config: this.configItem,
       comment: {
         type:
-          this.conifgItem &&
+          this.configItem &&
           this.configItem.commentType &&
           this.configItem.commentType !== ""
             ? this.configItem.commentType
@@ -263,7 +263,7 @@ export default {
       },
       previousComment: {
         type:
-          this.conifgItem &&
+          this.configItem &&
           this.configItem.commentType &&
           this.configItem.commentType !== ""
             ? this.configItem.commentType
diff --git a/src/components/dialogs/SourcePickerDialog.vue b/src/components/dialogs/SourcePickerDialog.vue
index 2e7dd109..04bcdd73 100644
--- a/src/components/dialogs/SourcePickerDialog.vue
+++ b/src/components/dialogs/SourcePickerDialog.vue
@@ -69,13 +69,11 @@
 </template>
 
 <script>
+import {mapGetters} from "vuex";
+
 export default {
   name: "SourcePickerDialog",
   props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
     sources: {
       type: Array,
       default: () => [],
@@ -87,29 +85,28 @@ export default {
   },
   data() {
     return {
-      config: this.configItem,
       activeSource: "",
     };
   },
   watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
     sourceId: function () {
       this.activeSource = this.sourceId;
     },
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+    }),
     confirmHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "general.save",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     cancelHotkey() {
       return this.$hotkeyHelpers.findBinding(
         "general.cancel",
-        this.config.hotkeys
+        this.hotkeys
       );
     },
     currentTheme() {
diff --git a/src/components/dialogs/SummaryDialog.vue b/src/components/dialogs/SummaryDialog.vue
index 9becb966..78f98998 100644
--- a/src/components/dialogs/SummaryDialog.vue
+++ b/src/components/dialogs/SummaryDialog.vue
@@ -136,6 +136,7 @@
 <script>
 import { TEXT_TYPES, AI_ENABLED_FIELDS } from "../../modules/constants";
 import openAIIntegrationHelper from "../../integrations/OpenAIIntegrationHelpers";
+import { mapGetters } from "vuex";
 
 export default {
   name: "SummaryDialog",
@@ -192,17 +193,14 @@ export default {
     this.handleClear();
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+    }),
     confirmHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.save",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.save", this.hotkeys);
     },
     cancelHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.cancel",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.cancel", this.hotkeys);
     },
     aiAssistEnabled() {
       return this?.config?.ai?.enabled || false;

From c9df476911f9d5b2f1b25fd5f4a2a3eab7b6bd4c Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 18 Dec 2023 14:47:31 +0200
Subject: [PATCH 18/41] refactored AddEvidence dependencies to services

---
 src/components/AudioWrapper.vue |   6 +-
 src/services/electronService.js |  26 +++++
 src/views/AddEvidence.vue       | 168 +++++++++++---------------------
 3 files changed, 83 insertions(+), 117 deletions(-)

diff --git a/src/components/AudioWrapper.vue b/src/components/AudioWrapper.vue
index 17c66757..fb9986d4 100644
--- a/src/components/AudioWrapper.vue
+++ b/src/components/AudioWrapper.vue
@@ -216,10 +216,8 @@ export default {
     async handleAudio() {
       const uri = this.wavesurfer.exportImage("image/png", 1, "dataURL");
 
-      let posterResult = await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
-        func: IPC_FUNCTIONS.CREATE_IMAGE,
-        data: { url: uri, isPoster: true },
-      });
+      let posterResult = await this.$electronService.createImage(uri, true);
+
       if (posterResult.status === STATUSES.ERROR) {
         this.$root.$emit("set-snackbar", posterResult.message);
         console.log(
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 126d7196..3b8e3753 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -10,6 +10,10 @@ export default class ElectronService {
     window.ipc.on("SAVE_SESSION", callback);
   }
 
+  onActiveSession(callback) {
+    window.ipc.on("ACTIVE_SESSION", callback);
+  }
+
   onResetSession(callback) {
     window.ipc.on("RESET_SESSION", callback);
   }
@@ -40,6 +44,12 @@ export default class ElectronService {
     });
   }
 
+  async closeAddWindow() {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.CLOSE_ADD_WINDOW,
+    });
+  }
+
   openEditWindow(data) {
     window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,
@@ -98,6 +108,15 @@ export default class ElectronService {
     });
   }
 
+  async optimizeVideo(filePath) {
+    return window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.OPTIMIZE_VIDEO,
+      data: {
+        filePath,
+      },
+    });
+  }
+
   async createAudio(buffer) {
     return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
       func: IPC_FUNCTIONS.CREATE_AUDIO,
@@ -118,4 +137,11 @@ export default class ElectronService {
       data: { sessionStatus },
     });
   }
+
+  async deleteFile(filePath) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.DELETE_FILE,
+      data: { filePath },
+    });
+  }
 }
diff --git a/src/views/AddEvidence.vue b/src/views/AddEvidence.vue
index d3446488..b3b0dfd1 100644
--- a/src/views/AddEvidence.vue
+++ b/src/views/AddEvidence.vue
@@ -240,15 +240,10 @@ import ReviewWrapper from "../components/ReviewWrapper.vue";
 import VueTagsInput from "@johmun/vue-tags-input";
 import { VEmojiPicker } from "v-emoji-picker";
 
-import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
-  TEXT_TYPES,
-  STATUSES,
-  AI_ENABLED_FIELDS,
-} from "../modules/constants";
+import { TEXT_TYPES, STATUSES, AI_ENABLED_FIELDS } from "../modules/constants";
 
 import openAIIntegrationHelper from "../integrations/OpenAIIntegrationHelpers";
+import { mapGetters } from "vuex";
 
 export default {
   name: "AddEvidence",
@@ -261,8 +256,6 @@ export default {
     return {
       item: {},
       items: [],
-      config: {},
-      credentials: {},
       comment: {
         type: "",
         content: "",
@@ -294,47 +287,31 @@ export default {
     this.getCredentials();
   },
   computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+      config: "config/fullConfig",
+      credentials: "auth/credentials",
+    }),
     nameHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.name",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.name", this.hotkeys);
     },
     followUpHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.followUp",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.followUp", this.hotkeys);
     },
     commentHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.comment",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.comment", this.hotkeys);
     },
     tagsHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.tags",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.tags", this.hotkeys);
     },
     typeHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.type",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.type", this.hotkeys);
     },
     saveHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.save",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.save", this.hotkeys);
     },
     cancelHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "evidence.cancel",
-        this.config.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("evidence.cancel", this.hotkeys);
     },
     aiAssistEnabled() {
       return this?.config?.ai?.enabled || false;
@@ -355,11 +332,21 @@ export default {
     },
   },
   mounted() {
-    if (!window.ipc) return;
+    if (this.$isElectron) {
+      this.$electronService.onActiveSession(this.activeSession);
+    }
+
+    // Focus on comment
+    this.$refs.comment.editor.commands.focus();
 
-    window.ipc.on("ACTIVE_SESSION", async (data) => {
+    this.$root.$on("update-session", this.updateSession);
+    this.$root.$on("update-processing", this.updateProcessing);
+    this.$root.$on("save-data", this.saveData);
+  },
+  methods: {
+    async activeSession(data) {
       // set theme mode
-      const isDarkMode = this.config.apperance === "dark" ? true : false;
+      const isDarkMode = this.config.apperance === "dark";
       this.$vuetify.theme.dark = isDarkMode;
       localStorage.setItem("isDarkMode", isDarkMode);
 
@@ -370,7 +357,7 @@ export default {
 
       // optimize video
       if (this.item.fileType === "video") {
-        this.optimizeVideo();
+        await this.optimizeVideo();
       } else {
         this.processing = false;
       }
@@ -387,16 +374,7 @@ export default {
           this.comment.text = temp.precondition.text;
         }
       });
-    });
-
-    // Focus on comment
-    this.$refs.comment.editor.commands.focus();
-
-    this.$root.$on("update-session", this.updateSession);
-    this.$root.$on("update-processing", this.updateProcessing);
-    this.$root.$on("save-data", this.saveData);
-  },
-  methods: {
+    },
     toggleFollowUp() {
       this.followUp = !this.followUp;
     },
@@ -407,57 +385,32 @@ export default {
       input.click();
       input.focus();
     },
-    fetchItems() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_ITEMS })
-        .then((result) => {
-          this.items = result;
-        });
+    async fetchItems() {
+      this.items = await this.$storageService.getItems();
     },
     async getConfig() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CONFIG,
-        })
-        .then((result) => {
-          this.config = result;
-        });
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
     },
     async getCredentials() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CREDENTIALS,
-        })
-        .then((result) => {
-          this.credentials = result;
-        });
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
     },
     async optimizeVideo() {
-      this.processing = true;
+      if (this.$isElectron) {
+        // todo add web handler for this
+        this.processing = true;
 
-      if (!window.ipc) return;
+        const { status, message } = await this.$electronService.optimizeVideo(
+          this.item.filePath
+        );
 
-      const { status, message } = await window.ipc.invoke(
-        IPC_HANDLERS.CAPTURE,
-        {
-          func: IPC_FUNCTIONS.OPTIMIZE_VIDEO,
-          data: {
-            filePath: this.item.filePath,
-          },
+        if (status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", message);
+          console.log(message);
         }
-      );
-
-      if (status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", message);
-        console.log(message);
+        this.processing = false;
       }
-      this.processing = false;
     },
     updateComment() {
       const regex = /(<([^>]+)>)/gi;
@@ -470,17 +423,11 @@ export default {
       this.processing = value;
     },
     async handleDiscard() {
-      await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
-        func: IPC_FUNCTIONS.DELETE_FILE,
-        data: { filePath: this.item.filePath },
-      });
-      await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
-        func: IPC_FUNCTIONS.DELETE_FILE,
-        data: { filePath: this.item.poster },
-      });
-      window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.CLOSE_ADD_WINDOW,
-      });
+      if (this.$isElectron) {
+        await this.$electronService.deleteFile(this.item.filePath);
+        await this.$electronService.deleteFile(this.item.poster);
+        await this.$electronService.closeAddWindow();
+      }
     },
     handleSave() {
       this.triggerSaveEvent = !this.triggerSaveEvent;
@@ -516,16 +463,11 @@ export default {
         createdAt: Date.now(),
       };
       this.items.push(newItem);
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.UPDATE_ITEMS,
-          data: this.items,
-        })
-        .then(() => {
-          window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-            func: IPC_FUNCTIONS.CLOSE_ADD_WINDOW,
-          });
-        });
+
+      await this.$storageService.updateItems(this.items);
+      if (this.$isElectron) {
+        await this.$electronService.closeAddWindow();
+      }
     },
     handleClear() {
       this.comment = {

From 4c473a0f98d0d5d83dbaf44738323c202ade5700 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 18 Dec 2023 14:59:13 +0200
Subject: [PATCH 19/41] refactored EditEvidence dependencies to services

---
 src/services/electronService.js | 10 +++-
 src/views/EditEvidence.vue      | 84 ++++++++++-----------------------
 2 files changed, 33 insertions(+), 61 deletions(-)

diff --git a/src/services/electronService.js b/src/services/electronService.js
index 3b8e3753..890c8be6 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -50,13 +50,19 @@ export default class ElectronService {
     });
   }
 
-  openEditWindow(data) {
-    window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+  async openEditWindow(data) {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,
       data: data,
     });
   }
 
+  async closeEditWindow() {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.CLOSE_EDIT_WINDOW,
+    });
+  }
+
   async openExternalLink(url) {
     return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
       func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
diff --git a/src/views/EditEvidence.vue b/src/views/EditEvidence.vue
index 5e3c1745..cc7819f2 100644
--- a/src/views/EditEvidence.vue
+++ b/src/views/EditEvidence.vue
@@ -297,12 +297,7 @@ import ReviewWrapper from "../components/ReviewWrapper.vue";
 import VueTagsInput from "@johmun/vue-tags-input";
 import { VEmojiPicker } from "v-emoji-picker";
 
-import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
-  TEXT_TYPES,
-  AI_ENABLED_FIELDS,
-} from "../modules/constants";
+import { TEXT_TYPES, AI_ENABLED_FIELDS } from "../modules/constants";
 
 import openAIIntegrationHelper from "../integrations/OpenAIIntegrationHelpers";
 
@@ -402,11 +397,17 @@ export default {
     },
   },
   mounted() {
-    if (!window.ipc) return;
-
-    window.ipc.on("ACTIVE_SESSION", async (data) => {
+    if (this.$isElectron) {
+      this.$electronService.onActiveSession(this.activeSession);
+    }
+    this.$root.$on("update-session", this.updateSession);
+    this.$root.$on("update-processing", this.updateProcessing);
+    this.$root.$on("save-data", this.saveData);
+  },
+  methods: {
+    activeSession(data) {
       // set theme mode
-      const isDarkMode = this.config.apperance === "dark" ? true : false;
+      const isDarkMode = this.config.apperance === "dark";
       this.$vuetify.theme.dark = isDarkMode;
       localStorage.setItem("isDarkMode", isDarkMode);
 
@@ -417,12 +418,7 @@ export default {
       this.name = splitName.slice(0, -1).join(".");
 
       this.processing = false;
-    });
-    this.$root.$on("update-session", this.updateSession);
-    this.$root.$on("update-processing", this.updateProcessing);
-    this.$root.$on("save-data", this.saveData);
-  },
-  methods: {
+    },
     toggleFollowUp() {
       this.item.followUp = !this.item.followUp;
     },
@@ -433,14 +429,8 @@ export default {
       input.click();
       input.focus();
     },
-    fetchItems() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_ITEMS })
-        .then((result) => {
-          this.items = result;
-        });
+    async fetchItems() {
+      this.items = await this.$storageService.getItems();
     },
     updateSession(value) {
       this.item = value;
@@ -449,26 +439,12 @@ export default {
       this.processing = value;
     },
     async getConfig() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CONFIG,
-        })
-        .then((result) => {
-          this.config = result;
-        });
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
     },
     async getCredentials() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CREDENTIALS,
-        })
-        .then((result) => {
-          this.credentials = result;
-        });
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
     },
     updateComment() {
       const regex = /(<([^>]+)>)/gi;
@@ -495,17 +471,15 @@ export default {
       this.item.comment.text = "";
     },
     handleDiscard() {
-      if (!window.ipc) return;
-
-      window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.CLOSE_EDIT_WINDOW,
-      });
+      if (this.$isElectron) {
+        this.$electronService.closeEditWindow();
+      }
     },
     async handleSave() {
       if (this.item.sessionType !== "Note") {
         this.triggerSaveEvent = true;
       } else {
-        this.saveData(this.item);
+        await this.saveData(this.item);
       }
     },
     handleName() {
@@ -531,17 +505,9 @@ export default {
         return temp;
       });
 
-      if (window.ipc) {
-        window.ipc
-          .invoke(IPC_HANDLERS.DATABASE, {
-            func: IPC_FUNCTIONS.UPDATE_ITEMS,
-            data: this.items,
-          })
-          .then(() => {
-            window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-              func: IPC_FUNCTIONS.CLOSE_EDIT_WINDOW,
-            });
-          });
+      await this.$storageService.updateItems(this.items);
+      if (this.$isElectron) {
+        await this.$electronService.closeEditWindow();
       }
     },
     async handleAISuggestion(field, event) {

From 4f78c326f65a8e18e5a5a6da711c53b6fb37127b Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 18 Dec 2023 18:30:51 +0200
Subject: [PATCH 20/41] refactored Default.vue events to electron service

---
 src/layouts/Default.vue         | 118 +++++++++++---------------------
 src/services/electronService.js |  35 ++++++++++
 2 files changed, 76 insertions(+), 77 deletions(-)

diff --git a/src/layouts/Default.vue b/src/layouts/Default.vue
index 2083bdbe..9604eab3 100644
--- a/src/layouts/Default.vue
+++ b/src/layouts/Default.vue
@@ -22,7 +22,7 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { STATUSES } from "../modules/constants";
 import AboutDialog from "../components/dialogs/AboutDialog.vue";
 export default {
   name: "DefaultLayout",
@@ -35,7 +35,6 @@ export default {
     aboutDialog: false,
     aboutVersion: null,
     overlay: false,
-    credentials: {},
     snackBar: {
       enabled: false,
       message: "",
@@ -49,89 +48,54 @@ export default {
     });
     this.$root.$on("close-aboutdialog", this.hideAboutDialog);
 
-    if (!window.ipc) return;
-
-    window.ipc.on("OPEN_CHILD_WINDOW", () => {
-      this.overlay = true;
-      this.$forceUpdate();
-    });
-    window.ipc.on("CLOSE_CHILD_WINDOW", ({ data }) => {
-      this.overlay = false;
-      if (data === "add" || data === "edit") {
-        const currentPath = this.$router.history.current.path;
-        if (currentPath !== "/main/workspace") {
-          this.$router.push({ path: "/main/workspace" });
-        }
-      }
-      this.$forceUpdate();
-    });
-
-    // new session for existing test
-    window.ipc.on("NEW_SESSION_TEST", async () => {
-      console.log("new session for existing test");
-    });
-
-    // new session for existing charter
-    window.ipc.on("NEW_SESSION_CHARTER", async () => {
-      console.log("new session for existing charter");
-    });
-
-    // open session
-    window.ipc.on("OPEN_SESSION", async () => {
-      if (!window.ipc) return;
-
-      const { status, message, state } = await window.ipc.invoke(
-        IPC_HANDLERS.FILE_SYSTEM,
-        {
-          func: IPC_FUNCTIONS.OPEN_SESSION,
+    if (this.$isElectron) {
+      this.$electronService.onOpenChildWindow(() => {
+        this.overlay = true;
+        this.$forceUpdate();
+      });
+      this.$electronService.onCloseChildWindow(({ data }) => {
+        this.overlay = false;
+        if (data === "add" || data === "edit") {
+          const currentPath = this.$router.history.current.path;
+          if (currentPath !== "/main/workspace") {
+            this.$router.push({ path: "/main/workspace" });
+          }
         }
-      );
-
-      if (status === STATUSES.ERROR) {
-        this.setSnackBar(message);
-        console.log(message);
-      } else {
-        this.$store.commit("restoreState", state);
-
-        const currentPath = this.$router.history.current.path;
-        if (currentPath !== state.path) {
-          this.$router.push({ path: state.path });
+        this.$forceUpdate();
+      });
+      this.$electronService.onOpenSession(async () => {
+        const { status, message, state } =
+          await this.$electronService.openSession();
+
+        if (status === STATUSES.ERROR) {
+          await this.setSnackBar(message);
+        } else {
+          this.$store.commit("restoreState", state);
+
+          const currentPath = this.$router.history.current.path;
+          if (currentPath !== state.path) {
+            await this.$router.push({ path: state.path });
+          }
         }
-      }
-    });
-
-    // save as charter
-    window.ipc.on("SAVE_AS_CHARTER", async () => {
-      console.log("save as charter");
-    });
-
-    // app setting
-    window.ipc.on("APP_SETTING", async () => {
-      await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.OPEN_SETTING_WINDOW,
       });
-    });
-
-    window.ipc.on("SET_THEME", ({ apperance }) => {
-      const isDarkMode = apperance === "dark" ? true : false;
-      this.$vuetify.theme.dark = isDarkMode;
-      localStorage.setItem("isDarkMode", isDarkMode);
-    });
-
-    // window.ipc.on("CREDENTIAL_CHANGE", () => {
-    //   this.getCredentials();
-    // });
-
-    window.ipc.on("ABOUT_DIALOG", async (version) => {
-      this.aboutVersion = version;
-      this.openAboutDialog();
-    });
+      this.$electronService.onOpenAboutWindow(this.openAboutDialog);
+      this.$electronService.onOpenSettingWindow(
+        this.$electronService.openSettingWindow
+      );
+      this.$electronService.onSetTheme(this.setTheme);
+    }
   },
   methods: {
+    setTheme({ appearance }) {
+      const isDarkMode = appearance === "dark";
+      this.$vuetify.theme.dark = isDarkMode;
+      localStorage.setItem("isDarkMode", isDarkMode.toString());
+    },
     hideAboutDialog() {
       this.aboutDialog = false;
     },
-    openAboutDialog() {
+    openAboutDialog(version) {
+      this.aboutVersion = version;
       this.aboutDialog = true;
     },
     async setSnackBar(message) {
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 890c8be6..73c7a59a 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -2,10 +2,29 @@ import { IPC_HANDLERS, IPC_FUNCTIONS } from "@/modules/constants";
 
 export default class ElectronService {
   // Listeners
+
+  onOpenSettingWindow(callback) {
+    window.ipc.on("APP_SETTING", callback);
+  }
+  onOpenAboutWindow(callback) {
+    window.ipc.on("ABOUT_DIALOG", callback);
+  }
+
+  onOpenChildWindow(callback) {
+    window.ipc.on("OPEN_CHILD_WINDOW", callback);
+  }
+
+  onCloseChildWindow(callback) {
+    window.ipc.on("CLOSE_CHILD_WINDOW", callback);
+  }
   onNewSession(callback) {
     window.ipc.on("NEW_SESSION", callback);
   }
 
+  onOpenSession(callback) {
+    window.ipc.on("OPEN_SESSION", callback);
+  }
+
   onSaveSession(callback) {
     window.ipc.on("SAVE_SESSION", callback);
   }
@@ -26,6 +45,10 @@ export default class ElectronService {
     window.ipc.on("META_CHANGE", callback);
   }
 
+  onSetTheme(callback) {
+    window.ipc.on("SET_THEME", callback);
+  }
+
   // Invokers
   setWindowSize({ width, height }) {
     window.ipc.invoke(IPC_HANDLERS.WINDOW, {
@@ -37,6 +60,12 @@ export default class ElectronService {
     });
   }
 
+  async openSettingWindow() {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_SETTING_WINDOW,
+    });
+  }
+
   async openAddWindow(data) {
     await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_ADD_WINDOW,
@@ -137,6 +166,12 @@ export default class ElectronService {
     });
   }
 
+  async openSession() {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.OPEN_SESSION,
+    });
+  }
+
   async changeMenuBySessionStatus(sessionStatus) {
     return await window.ipc.invoke(IPC_HANDLERS.MENU, {
       func: IPC_FUNCTIONS.CHANGE_MENUITEM_STATUS,

From 53e07f2097fce0f23ca6392104b75d17ed4103aa Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 18 Dec 2023 18:40:40 +0200
Subject: [PATCH 21/41] continue refactoring electron parts

---
 src/components/AudioWrapper.vue  |  2 +-
 src/components/ReviewWrapper.vue | 30 +++++++++++++++---------------
 src/services/electronService.js  |  7 +++++++
 src/views/HomeView.vue           | 11 +++--------
 4 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/src/components/AudioWrapper.vue b/src/components/AudioWrapper.vue
index fb9986d4..f6c4f152 100644
--- a/src/components/AudioWrapper.vue
+++ b/src/components/AudioWrapper.vue
@@ -107,7 +107,7 @@
 
 <script>
 import WaveSurfer from "wavesurfer.js";
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "@/modules/constants";
 export default {
   name: "AudioWrapper",
   props: {
diff --git a/src/components/ReviewWrapper.vue b/src/components/ReviewWrapper.vue
index b192c74d..8661c463 100644
--- a/src/components/ReviewWrapper.vue
+++ b/src/components/ReviewWrapper.vue
@@ -47,7 +47,7 @@ import AudioWrapper from "./AudioWrapper.vue";
 import FileWrapper from "./FileWrapper.vue";
 import MindmapEditor from "./MindmapEditor.vue";
 
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { STATUSES } from "../modules/constants";
 
 export default {
   name: "ReviewWrapper",
@@ -111,21 +111,21 @@ export default {
     async handleMindmap(value) {
       this.sessionItem.content.nodes = value.nodes;
       this.sessionItem.content.connections = value.connections;
-      const { status, message, item } = await window.ipc.invoke(
-        IPC_HANDLERS.CAPTURE,
-        {
-          func: IPC_FUNCTIONS.UPDATE_IMAGE,
-          data: { item: this.sessionItem, url: value.imgURI },
+      if (this.$isElectron) {
+        const { status, message, item } =
+          await this.$electronService.updateImage(
+            this.sessionItem,
+            value.imgURI
+          );
+        if (status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", message);
+          console.log(message);
+        } else {
+          this.sessionItem.fileName = item.fileName;
+          this.sessionItem.filePath = item.filePath;
+          this.$root.$emit("update-session", this.sessionItem);
+          this.$root.$emit("save-data");
         }
-      );
-      if (status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", message);
-        console.log(message);
-      } else {
-        this.sessionItem.fileName = item.fileName;
-        this.sessionItem.filePath = item.filePath;
-        this.$root.$emit("update-session", this.sessionItem);
-        this.$root.$emit("save-data");
       }
     },
   },
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 73c7a59a..35e8851c 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -136,6 +136,13 @@ export default class ElectronService {
     });
   }
 
+  async updateImage(item, url) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.UPDATE_IMAGE,
+      data: { item, url },
+    });
+  }
+
   async createVideo(buffer) {
     return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
       func: IPC_FUNCTIONS.CREATE_VIDEO,
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index e9788756..6bf9b116 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -167,7 +167,7 @@ import { VContainer, VBtn } from "vuetify/lib/components";
 import LogoWrapper from "../components/LogoWrapper.vue";
 import MenuPopover from "../components/MenuPopover.vue";
 
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { STATUSES } from "../modules/constants";
 import { mapGetters } from "vuex";
 export default {
   name: "HomeView",
@@ -217,16 +217,11 @@ export default {
     },
     async openSession() {
       if (this.$isElectron) {
-        const { status, message, state } = await window.ipc.invoke(
-          IPC_HANDLERS.FILE_SYSTEM,
-          {
-            func: IPC_FUNCTIONS.OPEN_SESSION,
-          }
-        );
+        const { status, message, state } =
+          await this.$electronService.openSession();
 
         if (status === STATUSES.ERROR) {
           this.$root.$emit("set-snackbar", message);
-          console.log(message);
         } else {
           this.$store.commit("restoreState", state);
 

From 2f5df2bd8f9e8d1732894f4694681b419e814a73 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Mon, 18 Dec 2023 19:45:13 +0200
Subject: [PATCH 22/41] continue refactoring electron parts from used
 components

---
 src/components/AudioWrapper.vue | 52 +++++++++++++++++----------------
 src/components/ImageEditor.vue  | 39 ++++++++++++-------------
 src/components/VideoWrapper.vue | 19 +++++-------
 src/services/electronService.js | 19 ++++++++++++
 4 files changed, 71 insertions(+), 58 deletions(-)

diff --git a/src/components/AudioWrapper.vue b/src/components/AudioWrapper.vue
index f6c4f152..438eae57 100644
--- a/src/components/AudioWrapper.vue
+++ b/src/components/AudioWrapper.vue
@@ -107,7 +107,8 @@
 
 <script>
 import WaveSurfer from "wavesurfer.js";
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "@/modules/constants";
+import { STATUSES } from "@/modules/constants";
+
 export default {
   name: "AudioWrapper",
   props: {
@@ -198,8 +199,7 @@ export default {
       // return this.wavesurfer.getCurrentTime();
       const duration = parseFloat(this.wavesurfer.getDuration());
       const current = parseFloat(this.wavesurfer.getCurrentTime());
-      const result = Math.round((current / duration) * 100);
-      this.currentProgress = result;
+      this.currentProgress = Math.round((current / duration) * 100);
     },
     syncSlideWithAudio() {
       this.wavesurfer.seekTo(this.currentProgress / 100);
@@ -214,33 +214,35 @@ export default {
       this.wavesurfer.setVolume(volume);
     },
     async handleAudio() {
-      const uri = this.wavesurfer.exportImage("image/png", 1, "dataURL");
+      if (this.$isElectron) {
+        // todo add web handler
+        const uri = this.wavesurfer.exportImage("image/png", 1, "dataURL");
 
-      let posterResult = await this.$electronService.createImage(uri, true);
+        let posterResult = await this.$electronService.createImage(uri, true);
 
-      if (posterResult.status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", posterResult.message);
-        console.log(
-          "Unable to generate waveform image: " + posterResult.message
-        );
-      }
+        if (posterResult.status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", posterResult.message);
+          console.log(
+            "Unable to generate waveform image: " + posterResult.message
+          );
+        }
 
-      let audioResult = await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
-        func: IPC_FUNCTIONS.UPDATE_AUDIO,
-        data: { item: this.sessionItem },
-      });
+        let audioResult = await this.$electronService.updateAudio(
+          this.sessionItem
+        );
 
-      if (audioResult.status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", audioResult.message);
-        console.log("Unable to update audio file: " + audioResult.message);
+        if (audioResult.status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", audioResult.message);
+          console.log("Unable to update audio file: " + audioResult.message);
+        }
+        this.sessionItem = {
+          ...this.sessionItem,
+          poster: posterResult.item.filePath,
+          ...audioResult.item,
+        };
+        this.$root.$emit("update-session", this.sessionItem);
+        this.$root.$emit("save-data", this.sessionItem);
       }
-      this.sessionItem = {
-        ...this.sessionItem,
-        poster: posterResult.item.filePath,
-        ...audioResult.item,
-      };
-      this.$root.$emit("update-session", this.sessionItem);
-      this.$root.$emit("save-data", this.sessionItem);
     },
   },
 };
diff --git a/src/components/ImageEditor.vue b/src/components/ImageEditor.vue
index 86921ec5..278b0cc5 100644
--- a/src/components/ImageEditor.vue
+++ b/src/components/ImageEditor.vue
@@ -12,7 +12,7 @@ import ImageEditor from "tui-image-editor";
 import "tui-image-editor/dist/tui-image-editor.css";
 import "tui-color-picker/dist/tui-color-picker.css";
 
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { STATUSES } from "../modules/constants";
 
 export default {
   name: "EditorPanel",
@@ -142,27 +142,24 @@ export default {
       }
     },
     async handleImage(needCallback = false) {
-      const imgURI = this.imageEditorInst.toDataURL();
-      const { status, message, item } = await window.ipc.invoke(
-        IPC_HANDLERS.CAPTURE,
-        {
-          func: IPC_FUNCTIONS.UPDATE_IMAGE,
-          data: { item: this.sessionItem, url: imgURI },
-        }
-      );
+      if (this.$isElectron) {
+        // todo add web handler
+        const imgURI = this.imageEditorInst.toDataURL();
+        const { status, message, item } =
+          await this.$electronService.updateImage(this.sessionItem, imgURI);
 
-      if (status === STATUSES.ERROR) {
-        this.$root.$emit("set-snackbar", message);
-        console.log(message);
-      } else {
-        // Force the timeline component to update the image through a fake QS
-        this.sessionItem.filePath =
-          this.sessionItem.filePath.substring(item.filePath.length) === "?"
-            ? item.filePath
-            : item.filePath + "?";
-        this.$root.$emit("update-session", this.sessionItem);
-        if (needCallback) {
-          this.$root.$emit("save-data", this.sessionItem);
+        if (status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", message);
+        } else {
+          // Force the timeline component to update the image through a fake QS
+          this.sessionItem.filePath =
+            this.sessionItem.filePath.substring(item.filePath.length) === "?"
+              ? item.filePath
+              : item.filePath + "?";
+          this.$root.$emit("update-session", this.sessionItem);
+          if (needCallback) {
+            this.$root.$emit("save-data", this.sessionItem);
+          }
         }
       }
     },
diff --git a/src/components/VideoWrapper.vue b/src/components/VideoWrapper.vue
index 301abcd6..7a18b271 100644
--- a/src/components/VideoWrapper.vue
+++ b/src/components/VideoWrapper.vue
@@ -70,7 +70,7 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS, STATUSES } from "../modules/constants";
+import { STATUSES } from "../modules/constants";
 export default {
   name: "VideoWrapper",
   components: {},
@@ -137,17 +137,12 @@ export default {
       const startVal = this.timeInSeconds(this.start);
       const endVal = this.timeInSeconds(this.end);
       this.handleProcessing(true);
-      const { status, message, item } = await window.ipc.invoke(
-        IPC_HANDLERS.CAPTURE,
-        {
-          func: IPC_FUNCTIONS.UPDATE_VIDEO,
-          data: {
-            item: this.sessionItem,
-            start: startVal,
-            end: endVal,
-            previousDuration: parseInt(this.duration),
-          },
-        }
+
+      const { status, message, item } = await this.$electronService.updateVideo(
+        this.sessionItem,
+        startVal,
+        endVal,
+        parseInt(this.duration)
       );
 
       if (status === STATUSES.ERROR) {
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 35e8851c..6012a121 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -143,6 +143,13 @@ export default class ElectronService {
     });
   }
 
+  async updateAudio(item) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.UPDATE_AUDIO,
+      data: { item },
+    });
+  }
+
   async createVideo(buffer) {
     return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
       func: IPC_FUNCTIONS.CREATE_VIDEO,
@@ -150,6 +157,18 @@ export default class ElectronService {
     });
   }
 
+  async updateVideo(item, start, end, previousDuration) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.UPDATE_VIDEO,
+      data: {
+        item,
+        start,
+        end,
+        previousDuration,
+      },
+    });
+  }
+
   async optimizeVideo(filePath) {
     return window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
       func: IPC_FUNCTIONS.OPTIMIZE_VIDEO,

From 646bbc2830681738dc775f8ffd8b5175e7174012 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 19 Dec 2023 08:39:16 +0200
Subject: [PATCH 23/41] continue refactoring electron parts from used
 components, auth, config and Setting view

---
 src/modules/CaptureUtility.js                 |  4 +-
 src/modules/IpcHandlers.js                    |  4 +-
 src/modules/constants.js                      |  2 +-
 src/services/electronService.js               | 15 +++++
 .../storage-options/localJsonDbService.js     | 13 ++++
 .../storage-options/restApiService.js         |  7 +++
 src/services/storageService.js                |  8 +++
 src/views/AuthenticationView.vue              | 30 ++++------
 src/views/SettingView.vue                     | 60 +++++--------------
 9 files changed, 72 insertions(+), 71 deletions(-)

diff --git a/src/modules/CaptureUtility.js b/src/modules/CaptureUtility.js
index 933fb7d9..16a99603 100644
--- a/src/modules/CaptureUtility.js
+++ b/src/modules/CaptureUtility.js
@@ -466,9 +466,9 @@ module.exports.dropFile = async (data) => {
   });
 };
 
-module.exports.setApperance = ({ apperance }) => {
+module.exports.setAppearance = ({ appearance }) => {
   const browserWindow = browserUtility.getBrowserWindow();
-  browserWindow.webContents.send("SET_THEME", { apperance });
+  browserWindow.webContents.send("SET_THEME", { appearance });
 };
 
 const generateIDAndName = (type, uid = undefined) => {
diff --git a/src/modules/IpcHandlers.js b/src/modules/IpcHandlers.js
index 211fe8da..b5452099 100644
--- a/src/modules/IpcHandlers.js
+++ b/src/modules/IpcHandlers.js
@@ -40,8 +40,8 @@ ipcMain.handle(IPC_HANDLERS.CAPTURE, async (event, args) => {
       return captureUtility.updateAudio(args.data);
     case IPC_FUNCTIONS.DROP_FILE:
       return captureUtility.dropFile(args.data);
-    case IPC_FUNCTIONS.SET_APPERANCE:
-      return captureUtility.setApperance(args.data);
+    case IPC_FUNCTIONS.SET_APPEARANCE:
+      return captureUtility.setAppearance(args.data);
     default:
       return null;
   }
diff --git a/src/modules/constants.js b/src/modules/constants.js
index 28bd85cc..208b8930 100644
--- a/src/modules/constants.js
+++ b/src/modules/constants.js
@@ -36,7 +36,7 @@ export const IPC_FUNCTIONS = {
   OPEN_MODAL_WINDOW: "openModalWindow",
   CLOSE_MODAL_WINDOW: "closeModalWindow",
   SET_WINDOW_SIZE: "setWindowSize",
-  SET_APPERANCE: "setApperance",
+  SET_APPEARANCE: "setAppearance",
   OPEN_NOTES_WINDOW: "openNotesWindow",
   CLOSE_NOTES_WINDOW: "closeNotesWindow",
   MOVE_WINDOW: "moveWindow",
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 6012a121..92be1e72 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -45,6 +45,14 @@ export default class ElectronService {
     window.ipc.on("META_CHANGE", callback);
   }
 
+  onConfigChange(callback) {
+    window.ipc.on("CONFIG_CHANGE", callback);
+  }
+
+  onCredentialChange(callback) {
+    window.ipc.on("CREDENTIAL_CHANGE", callback);
+  }
+
   onSetTheme(callback) {
     window.ipc.on("SET_THEME", callback);
   }
@@ -211,4 +219,11 @@ export default class ElectronService {
       data: { filePath },
     });
   }
+
+  async setAppearance(appearance) {
+    return await window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
+      func: IPC_FUNCTIONS.SET_APPEARANCE,
+      data: { appearance },
+    });
+  }
 }
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index ea24c947..4b48b307 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -21,12 +21,25 @@ export default class LocalJsonDbService extends StorageInterface {
     });
   }
 
+  async updateConfig(config) {
+    return window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.UPDATE_CONFIG,
+      data: config,
+    });
+  }
+
   async getCredentials() {
     return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
       func: IPC_FUNCTIONS.GET_CREDENTIALS,
     });
   }
 
+  async getMetaData() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_METADATA,
+    });
+  }
+
   async updateCredentials(credentials) {
     window.ipc.invoke(IPC_HANDLERS.DATABASE, {
       func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
diff --git a/src/services/storage-options/restApiService.js b/src/services/storage-options/restApiService.js
index 87bddc57..1e151d9e 100644
--- a/src/services/storage-options/restApiService.js
+++ b/src/services/storage-options/restApiService.js
@@ -17,11 +17,18 @@ export default class RestApiService extends StorageInterface {
     return response.data;
   }
 
+  async updateConfig(config) {
+    console.log(config);
+    // saving credentials endpoint here
+  }
+
   async getCredentials() {
     const response = await axios.get(`http://localhost:3000/credentials`);
     return response.data;
   }
 
+  async getMetaData() {}
+
   async updateCredentials(credentials) {
     console.log(credentials);
     // saving credentials endpoint here
diff --git a/src/services/storageService.js b/src/services/storageService.js
index 48da2246..c59e05e3 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -20,10 +20,18 @@ export default class StorageService {
     return await this.storage.getConfig();
   }
 
+  async updateConfig(config) {
+    return await this.storage.updateConfig(config);
+  }
+
   async getCredentials() {
     return await this.storage.getCredentials();
   }
 
+  async getMetaData() {
+    return await this.storage.getMetaData();
+  }
+
   async updateCredentials(credentials) {
     return this.storage.updateCredentials(credentials);
   }
diff --git a/src/views/AuthenticationView.vue b/src/views/AuthenticationView.vue
index 9464ce58..b592cc37 100644
--- a/src/views/AuthenticationView.vue
+++ b/src/views/AuthenticationView.vue
@@ -9,7 +9,6 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
 export default {
   name: "AuthenticationView",
   components: {},
@@ -30,28 +29,19 @@ export default {
     });
   },
   mounted() {
-    window.ipc.on("CONFIG_CHANGE", () => {
-      this.getConfig();
-    });
-
-    window.ipc.on("CREDENTIAL_CHANGE", () => {
-      this.getCredentials();
-    });
+    if (this.$isElectron) {
+      this.$electronService.onConfigChange(this.getConfig);
+      this.$electronService.onCredentialChange(this.getCredentials);
+    }
   },
   methods: {
-    getConfig() {
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CONFIG })
-        .then((result) => {
-          this.config = result;
-        });
+    async getConfig() {
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
     },
-    getCredentials() {
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_CREDENTIALS })
-        .then((result) => {
-          this.credentials = result;
-        });
+    async getCredentials() {
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
     },
   },
 };
diff --git a/src/views/SettingView.vue b/src/views/SettingView.vue
index bc60ea97..e5aecaaa 100644
--- a/src/views/SettingView.vue
+++ b/src/views/SettingView.vue
@@ -43,7 +43,6 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
 export default {
   name: "SettingView",
   components: {},
@@ -114,63 +113,32 @@ export default {
   },
   methods: {
     async getMetadata() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_METADATA,
-        })
-        .then((result) => {
-          this.metadata = result;
-        });
+      this.metadata = await this.$storageService.getMetaData();
     },
     async getConfig() {
-      if (!window.ipc) return;
-
-      await window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CONFIG,
-        })
-        .then((result) => {
-          this.config = result;
-        });
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
     },
     updateConfig(value) {
       this.config = value;
-      if (!window.ipc) return;
+      this.$storageService.updateConfig(this.config);
 
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_CONFIG,
-        data: this.config,
-      });
-
-      const isDarkMode = this.config.apperance === "dark" ? true : false;
+      const isDarkMode = this.config.apperance === "dark";
       this.$vuetify.theme.dark = isDarkMode;
-      localStorage.setItem("isDarkMode", isDarkMode);
-      window.ipc.invoke(IPC_HANDLERS.CAPTURE, {
-        func: IPC_FUNCTIONS.SET_APPERANCE,
-        data: { apperance: this.config.apperance },
-      });
+      localStorage.setItem("isDarkMode", isDarkMode.toString());
+
+      if (this.$isElectron) {
+        this.$electronService.setAppearance(this.config.apperance);
+      }
     },
     async getCredentials() {
-      if (!window.ipc) return;
-
-      await window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CREDENTIALS,
-        })
-        .then((result) => {
-          this.credentials = result;
-        });
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
     },
     updateCredentials(value) {
       this.credentials = value;
-      if (!window.ipc) return;
-
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
-        data: this.credentials,
-      });
+      this.$store.commit("auth/setCredentials", this.credentials);
+      this.$storageService.updateCredentials(this.credentials);
     },
   },
 };

From 01200f756c65ceb140eb3943f76dcd6963355694 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 19 Dec 2023 09:51:18 +0200
Subject: [PATCH 24/41] fixed problem with exporting session with notes

---
 src/components/ExportPanel.vue   |  3 +++
 src/modules/CaptureUtility.js    |  3 +++
 src/modules/FileSystemUtility.js | 22 ++++++++++++----------
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/components/ExportPanel.vue b/src/components/ExportPanel.vue
index 429a2935..b9670265 100644
--- a/src/components/ExportPanel.vue
+++ b/src/components/ExportPanel.vue
@@ -126,6 +126,7 @@ export default {
   methods: {
     async exportSession() {
       const data = {
+        id: this.$store.state.id,
         title: this.$store.state.title,
         charter: this.$store.state.charter,
         preconditions: this.$store.state.preconditions,
@@ -135,6 +136,8 @@ export default {
         ended: this.$store.state.ended,
       };
 
+      console.log(data);
+
       if (!window.ipc) return;
 
       await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
diff --git a/src/modules/CaptureUtility.js b/src/modules/CaptureUtility.js
index 16a99603..48be0ae9 100644
--- a/src/modules/CaptureUtility.js
+++ b/src/modules/CaptureUtility.js
@@ -336,6 +336,9 @@ module.exports.saveNote = (comment) => {
     databaseUtility.getSessionID(),
     fileName
   );
+
+  console.log("Note File Path", filePath);
+
   fs.writeFile(filePath, comment.text, function (err) {
     if (err) {
       console.log(err);
diff --git a/src/modules/FileSystemUtility.js b/src/modules/FileSystemUtility.js
index e10cf5d2..40524334 100644
--- a/src/modules/FileSystemUtility.js
+++ b/src/modules/FileSystemUtility.js
@@ -204,20 +204,22 @@ module.exports.openSession = async () => {
 };
 
 module.exports.exportSession = async (params) => {
-  console.log("exportSession");
-  debugger;
   const timestamp = dayjs().format("YYYY-MM-DD_HH-mm-ss-ms");
-  const id = databaseUtility.getSessionID();
-  const notesFileName = "yattie-session-" + timestamp + "-notes.txt";
+  // const id = databaseUtility.getSessionID();
+  const id = params.id;
+  // const notesFileName = "yattie-session-" + timestamp + "-notes.txt";
   const notes = databaseUtility.getNotes();
   let notesFilePath = "";
-  if (notes.text !== "") {
-    notesFilePath = captureUtility.saveNote({
-      fileName: notesFileName,
-      comment: notes,
-    });
-  }
 
+  if (notes.text) {
+    // notesFilePath = captureUtility.saveNote({
+    //   fileName: notesFileName,
+    //   comment: notes,
+    // });
+    const notesItem = captureUtility.saveNote(notes)
+    notesFilePath = notesItem.item.filePath;
+    console.log(notesFilePath);
+  }
   // show save dialog
   const fileName = "yattie-session-" + timestamp + ".zip";
   const { filePath } = await dialog.showSaveDialog({

From 93230f6ad7de01941c6f709fd4fddf14803bbfca Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 19 Dec 2023 09:57:16 +0200
Subject: [PATCH 25/41] adding support to pass specific filename

---
 src/modules/CaptureUtility.js    | 8 +++-----
 src/modules/FileSystemUtility.js | 8 ++------
 2 files changed, 5 insertions(+), 11 deletions(-)

diff --git a/src/modules/CaptureUtility.js b/src/modules/CaptureUtility.js
index 48be0ae9..74370da1 100644
--- a/src/modules/CaptureUtility.js
+++ b/src/modules/CaptureUtility.js
@@ -328,17 +328,15 @@ module.exports.deleteFile = ({ filePath }) => {
   }
 };
 
-module.exports.saveNote = (comment) => {
+module.exports.saveNote = (comment, fileNameToSave = "") => {
   const { id, fileName } = generateIDAndName("text");
   const filePath = path.join(
     configDir,
     "sessions",
     databaseUtility.getSessionID(),
-    fileName
+    fileNameToSave ? fileNameToSave : fileName
   );
 
-  console.log("Note File Path", filePath);
-
   fs.writeFile(filePath, comment.text, function (err) {
     if (err) {
       console.log(err);
@@ -352,7 +350,7 @@ module.exports.saveNote = (comment) => {
     status: STATUSES.SUCCESS,
     item: {
       id,
-      fileName,
+      fileName: fileNameToSave ? fileNameToSave : fileName,
       filePath,
     },
   };
diff --git a/src/modules/FileSystemUtility.js b/src/modules/FileSystemUtility.js
index 40524334..a052f610 100644
--- a/src/modules/FileSystemUtility.js
+++ b/src/modules/FileSystemUtility.js
@@ -207,16 +207,12 @@ module.exports.exportSession = async (params) => {
   const timestamp = dayjs().format("YYYY-MM-DD_HH-mm-ss-ms");
   // const id = databaseUtility.getSessionID();
   const id = params.id;
-  // const notesFileName = "yattie-session-" + timestamp + "-notes.txt";
+  const notesFileName = "yattie-session-" + timestamp + "-notes.txt";
   const notes = databaseUtility.getNotes();
   let notesFilePath = "";
 
   if (notes.text) {
-    // notesFilePath = captureUtility.saveNote({
-    //   fileName: notesFileName,
-    //   comment: notes,
-    // });
-    const notesItem = captureUtility.saveNote(notes)
+    const notesItem = captureUtility.saveNote(notes, notesFileName)
     notesFilePath = notesItem.item.filePath;
     console.log(notesFilePath);
   }

From 0cf70fa1975a7af35cd58b019fda0683a997072c Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 19 Dec 2023 20:42:23 +0200
Subject: [PATCH 26/41] refactoring electron parts in components which are in
 use

---
 src/components/ExportPanel.vue                | 13 +---
 .../authentication/SigninJiraWrapper.vue      | 72 +++++++++----------
 .../authentication/SigninWrapper.vue          | 10 ++-
 .../authentication/SignupMainWrapper.vue      | 12 ++--
 src/services/electronService.js               | 43 ++++++++++-
 src/views/NoteView.vue                        | 21 ++----
 src/views/ShareOAuthView.vue                  | 29 +++-----
 7 files changed, 98 insertions(+), 102 deletions(-)

diff --git a/src/components/ExportPanel.vue b/src/components/ExportPanel.vue
index b9670265..d405de10 100644
--- a/src/components/ExportPanel.vue
+++ b/src/components/ExportPanel.vue
@@ -73,8 +73,6 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
-
 //import JiraExportSession from "./jira/JiraExportSession";
 //import TestRailExportSession from "./testrail/TestRailExportSession";
 
@@ -136,14 +134,9 @@ export default {
         ended: this.$store.state.ended,
       };
 
-      console.log(data);
-
-      if (!window.ipc) return;
-
-      await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-        func: IPC_FUNCTIONS.EXPORT_SESSION,
-        data: data,
-      });
+      if (this.$isElectron) {
+        await this.$electronService.exportSession(data);
+      }
     },
   },
 };
diff --git a/src/components/authentication/SigninJiraWrapper.vue b/src/components/authentication/SigninJiraWrapper.vue
index 870a74b7..83505e04 100644
--- a/src/components/authentication/SigninJiraWrapper.vue
+++ b/src/components/authentication/SigninJiraWrapper.vue
@@ -233,7 +233,6 @@ import axios from "axios";
 import dayjs from "dayjs";
 import uuidv4 from "uuid";
 import { Buffer } from "buffer";
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../../modules/constants";
 import yattIntegrationHelper from "../../integrations/YattIntegrationHelpers";
 import integrationHelper from "../../integrations/IntegrationHelpers";
 import jiraIntegrationHelper from "../../integrations/JiraIntegrationHelpers";
@@ -322,9 +321,9 @@ export default {
     };
   },
   mounted() {
-    window.ipc.on("JIRA_LOGIN", (data) => {
-      this.postLogin(data);
-    });
+    if (this.$isElectron) {
+      this.$electronService.onJiraLogin(this.postLogin);
+    }
   },
   computed: {
     currentTheme() {
@@ -336,24 +335,23 @@ export default {
     },
   },
   methods: {
-    back() {
+    async back() {
       if (this.connectWithServerOAuth) {
-        window.ipc.invoke(IPC_HANDLERS.SERVER, {
-          func: IPC_FUNCTIONS.STOP_SERVER,
-        });
+        if (this.$isElectron) {
+          await this.$electronService.stopServer();
+        }
       }
 
       if (this.previousRoute.path.includes("setting")) {
-        this.$router.push({ path: this.previousRoute.path });
+        await this.$router.push({ path: this.previousRoute.path });
       } else {
         this.$router.back();
       }
     },
     openExternalLink(url) {
-      window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-        func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
-        data: url,
-      });
+      if (this.$isElectron) {
+        this.$electronService.openExternalLink(url);
+      }
     },
     useServerOAuth() {
       this.connectWithCloudOAuth = false;
@@ -375,18 +373,17 @@ export default {
           await integrationHelper.generateCodeChallengeFromVerifier(
             codeVerifier
           );
-        await window.ipc
-          .invoke(IPC_HANDLERS.SERVER, {
-            func: IPC_FUNCTIONS.START_SERVER,
-            data: {
+
+        if (this.$isElectron) {
+          try {
+            await this.$electronService.startServer({
               clientId: this.clientId,
               clientSecret: this.clientSecret,
               url: this.instanceUrl,
               codeVerifier: codeVerifier,
               codeChallenge: codeChallenge,
-            },
-          })
-          .then(async () => {
+            });
+
             this.loading = true;
             this.$root.$emit("overlay", true);
 
@@ -395,10 +392,9 @@ export default {
             await axios
               .get(url)
               .then(async (response) => {
-                await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-                  func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
-                  data: response.data,
-                });
+                if (this.$isElectron) {
+                  await this.$electronService.openExternalLink(response.data);
+                }
                 this.loading = false;
                 this.$root.$emit("overlay", false);
                 if (response.status !== 200) {
@@ -416,11 +412,11 @@ export default {
                   ? error.message
                   : this.$tc("message.api_error", 1);
               });
-          })
-          .catch((error) => {
+          } catch (error) {
             this.snackBar.enabled = true;
             this.snackBar.message = error ? error : "Failed start server";
-          });
+          }
+        }
       }
     },
     async signInWithCloud() {
@@ -437,10 +433,9 @@ export default {
         const url = encodeURI(
           `https://auth.atlassian.com/authorize?audience=api.atlassian.com&prompt=consent&client_id=${clientId}&scope=${scopes}&state=${serverURL};${tokenId}&response_type=code&redirect_uri=${redirectURL}`
         );
-        await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-          func: IPC_FUNCTIONS.OPEN_EXTERNAL_LINK,
-          data: url,
-        });
+        if (this.$isElectron) {
+          await this.$electronService.openExternalLink(url);
+        }
 
         const wait = function (period) {
           return new Promise((resolve) => {
@@ -499,17 +494,14 @@ export default {
             } else {
               tempCredentials.yatt[0].oauthTokenIds = [tokenId];
             }
-            await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-              func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
-              data: tempCredentials,
-            });
+            await this.$storageService.updateCredentials(tempCredentials);
           }
-          this.postLogin(finalResponse.data);
+          await this.postLogin(finalResponse.data);
         }
       }
     },
     async signInWithApiKey() {
-      this.postLogin({
+      await this.postLogin({
         jira: {
           type: "basic",
           accessToken: Buffer.from(this.userName + ":" + this.apiKey).toString(
@@ -582,9 +574,9 @@ export default {
                         this.$root.$emit("overlay", false);
 
                         if (this.connectWithServerOAuth) {
-                          window.ipc.invoke(IPC_HANDLERS.SERVER, {
-                            func: IPC_FUNCTIONS.STOP_SERVER,
-                          });
+                          if (this.$isElectron) {
+                            this.$electronService.stopServer();
+                          }
                         }
 
                         this.$router.push({ path: this.previousRoute.path });
diff --git a/src/components/authentication/SigninWrapper.vue b/src/components/authentication/SigninWrapper.vue
index 74c14c6e..bfe8831d 100644
--- a/src/components/authentication/SigninWrapper.vue
+++ b/src/components/authentication/SigninWrapper.vue
@@ -111,8 +111,6 @@
 </template>
 
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../../modules/constants";
-
 export default {
   name: "SigninWrapper",
   components: {},
@@ -164,10 +162,10 @@ export default {
   },
   mounted() {},
   methods: {
-    back: function () {
-      window.ipc.invoke(IPC_HANDLERS.SERVER, {
-        func: IPC_FUNCTIONS.STOP_SERVER,
-      });
+    back: async function () {
+      if (this.$isElectron) {
+        await this.$electronService.stopServer();
+      }
 
       this.$router.back();
     },
diff --git a/src/components/authentication/SignupMainWrapper.vue b/src/components/authentication/SignupMainWrapper.vue
index 7d73b01a..c79bdb27 100644
--- a/src/components/authentication/SignupMainWrapper.vue
+++ b/src/components/authentication/SignupMainWrapper.vue
@@ -122,7 +122,6 @@
 
 <script>
 import axios from "axios";
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../../modules/constants";
 import dayjs from "dayjs";
 
 export default {
@@ -167,9 +166,9 @@ export default {
   },
   computed: {},
   mounted() {
-    window.ipc.on("JIRA_LOGIN", (data) => {
-      this.jiraLogin(data);
-    });
+    if (this.$isElectron) {
+      this.$electronService.onJiraLogin(this.jiraLogin);
+    }
   },
   methods: {
     async callJiraAPI() {
@@ -231,10 +230,7 @@ export default {
               this.credentials[0].type = "jira";
               this.credentials[0].data = jiraData;
 
-              window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-                func: IPC_FUNCTIONS.UPDATE_CREDENTIALS,
-                data: this.credentials,
-              });
+              this.$storageService.updateCredentials(this.credentials);
 
               setTimeout(() => {
                 this.loading = false;
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 92be1e72..cdf44dad 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -1,4 +1,8 @@
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "@/modules/constants";
+import {
+  IPC_HANDLERS,
+  IPC_FUNCTIONS,
+  IPC_BIND_KEYS,
+} from "@/modules/constants";
 
 export default class ElectronService {
   // Listeners
@@ -57,6 +61,14 @@ export default class ElectronService {
     window.ipc.on("SET_THEME", callback);
   }
 
+  onJiraLogin(callback) {
+    window.ipc.on("JIRA_LOGIN", callback);
+  }
+
+  onModalData(callback) {
+    window.ipc.on(IPC_BIND_KEYS.MODAL_DATA, callback);
+  }
+
   // Invokers
   setWindowSize({ width, height }) {
     window.ipc.invoke(IPC_HANDLERS.WINDOW, {
@@ -87,6 +99,15 @@ export default class ElectronService {
     });
   }
 
+  async closeShareOauthWindow() {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.CLOSE_MODAL_WINDOW,
+      data: {
+        bindKey: IPC_BIND_KEYS.CLOSED_SHARE_OAUTH_DIALOG,
+      },
+    });
+  }
+
   async openEditWindow(data) {
     return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,
@@ -226,4 +247,24 @@ export default class ElectronService {
       data: { appearance },
     });
   }
+
+  async exportSession(data) {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.EXPORT_SESSION,
+      data,
+    });
+  }
+
+  async stopServer() {
+    return await window.ipc.invoke(IPC_HANDLERS.SERVER, {
+      func: IPC_FUNCTIONS.STOP_SERVER,
+    });
+  }
+
+  async startServer(data) {
+    return await window.ipc.invoke(IPC_HANDLERS.SERVER, {
+      func: IPC_FUNCTIONS.START_SERVER,
+      data,
+    });
+  }
 }
diff --git a/src/views/NoteView.vue b/src/views/NoteView.vue
index 49fca26c..cb839905 100644
--- a/src/views/NoteView.vue
+++ b/src/views/NoteView.vue
@@ -12,8 +12,6 @@
   </v-container>
 </template>
 <script>
-import { IPC_HANDLERS, IPC_FUNCTIONS } from "../modules/constants";
-
 export default {
   name: "NoteView",
   components: {},
@@ -23,26 +21,15 @@ export default {
     };
   },
   mounted() {
-    if (!window.ipc) return;
-
-    window.ipc.on("DATA_CHANGE", () => {
-      this.fetchNotes();
-    });
-
+    if (this.$isElectron) {
+      this.$electronService.onDataChange(this.fetchNotes);
+    }
     this.fetchNotes();
   },
   computed: {},
   methods: {
     async fetchNotes() {
-      if (!window.ipc) return;
-
-      await window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_NOTES,
-        })
-        .then((notes) => {
-          this.notes = notes;
-        });
+      return await this.$storageService.getNotes();
     },
   },
 };
diff --git a/src/views/ShareOAuthView.vue b/src/views/ShareOAuthView.vue
index 5efe7e30..d6c7ef35 100644
--- a/src/views/ShareOAuthView.vue
+++ b/src/views/ShareOAuthView.vue
@@ -52,12 +52,6 @@
   </v-container>
 </template>
 <script>
-import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
-  IPC_BIND_KEYS,
-} from "../modules/constants";
-
 export default {
   name: "ShareOAuth",
   components: {},
@@ -75,22 +69,17 @@ export default {
     },
   },
   created() {
-    if (!window.ipc) return;
-
-    window.ipc.on(IPC_BIND_KEYS.MODAL_DATA, (data) => {
-      this.credentials = data;
-    });
+    if (this.$isElectron) {
+      this.$electronService.onModalData((data) => {
+        this.credentials = data;
+      });
+    }
   },
   methods: {
-    handleDone() {
-      if (!window.ipc) return;
-
-      window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-        func: IPC_FUNCTIONS.CLOSE_MODAL_WINDOW,
-        data: {
-          bindKey: IPC_BIND_KEYS.CLOSED_SHARE_OAUTH_DIALOG,
-        },
-      });
+    async handleDone() {
+      if (this.$isElectron) {
+        await this.$electronService.closeShareOauthWindow();
+      }
     },
   },
 };

From e490c2915bc17be060253ec33a2870852e62c50e Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 20 Dec 2023 10:42:22 +0200
Subject: [PATCH 27/41] refactoring and fixing problems in settings tabs

---
 src/components/settings/GeneralTab.vue  | 56 +++++++------------------
 src/components/settings/TemplateTab.vue | 41 +++++++++---------
 src/services/electronService.js         | 26 ++++++++++++
 3 files changed, 60 insertions(+), 63 deletions(-)

diff --git a/src/components/settings/GeneralTab.vue b/src/components/settings/GeneralTab.vue
index 7f1540b5..0cd8d99e 100644
--- a/src/components/settings/GeneralTab.vue
+++ b/src/components/settings/GeneralTab.vue
@@ -199,12 +199,7 @@
 </template>
 
 <script>
-import {
-  IPC_HANDLERS,
-  IPC_FUNCTIONS,
-  TEXT_TYPES,
-  STATUSES,
-} from "../../modules/constants";
+import { TEXT_TYPES, STATUSES } from "../../modules/constants";
 export default {
   name: "GeneralTab",
   components: {},
@@ -278,49 +273,26 @@ export default {
       this.$emit("submit-config", this.config);
     },
     async openConfigFile() {
-      const { status, message } = await window.ipc.invoke(
-        IPC_HANDLERS.FILE_SYSTEM,
-        {
-          func: IPC_FUNCTIONS.OPEN_CONFIG_FILE,
+      if (this.$isElectron) {
+        const { status } = await this.$electronService.openConfigFile();
+        if (status === STATUSES.SUCCESS) {
+          this.$root.$emit("change-meta");
         }
-      );
-      console.log(status, message);
-      if (status === STATUSES.SUCCESS) {
-        this.$root.$emit("change-meta");
       }
     },
     async openCredentialsFile() {
-      const { status, message } = await window.ipc.invoke(
-        IPC_HANDLERS.FILE_SYSTEM,
-        {
-          func: IPC_FUNCTIONS.OPEN_CREDENTIALS_FILE,
+      if (this.$isElectron) {
+        const { status } = await this.$electronService.openCredentialsFile();
+        if (status === STATUSES.SUCCESS) {
+          this.$root.$emit("change-meta");
         }
-      );
-      console.log(status, message);
-      if (status === STATUSES.SUCCESS) {
-        this.$root.$emit("change-meta");
       }
     },
-    showOAuthDialog() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CREDENTIALS,
-        })
-        .then((credentials) => {
-          window.ipc.invoke(IPC_HANDLERS.WINDOW, {
-            func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
-            data: {
-              path: "shareOAuth",
-              size: {
-                width: 400,
-                height: 550,
-              },
-              data: credentials,
-            },
-          });
-        });
+    async showOAuthDialog() {
+      const credentials = await this.$storageService.getCredentials();
+      if (this.$isElectron) {
+        await this.$electronService.openShareOauthWindow(credentials);
+      }
     },
   },
 };
diff --git a/src/components/settings/TemplateTab.vue b/src/components/settings/TemplateTab.vue
index 3c39b9d0..a0be24ee 100644
--- a/src/components/settings/TemplateTab.vue
+++ b/src/components/settings/TemplateTab.vue
@@ -5,7 +5,7 @@
       {{ $t("message.improve_note") }}
     </p>
 
-    <v-row>
+    <v-row v-if="template">
       <v-col cols="12" class="pa-4">
         <div class="mb-3 session-type">
           <p class="subtitle-1 mb-1" :style="{ color: currentTheme.secondary }">
@@ -107,21 +107,15 @@
 
 <script>
 import { SESSION_TYPES } from "../../modules/constants";
+import { mapGetters } from "vuex";
 export default {
   name: "TemplateTab",
   components: {},
-  props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
-  },
+  props: {},
   computed: {
+    ...mapGetters({
+      config: "config/fullConfig",
+    }),
     currentTheme() {
       if (this.$vuetify.theme.dark) {
         return this.$vuetify.theme.themes.dark;
@@ -132,14 +126,19 @@ export default {
   },
   data() {
     return {
-      config: this.configItem,
-      templates: this.configItem.templates,
-      template: this.configItem.templates[0],
-      type: this.configItem.templates[0].type,
+      templatesToChange: null, // this.config.templates,
+      configToChange: null,
+      template: null, // this.config.templates[0],
+      type: null, // this.config.templates[0].type,
       sessionTypes: SESSION_TYPES,
     };
   },
-  mounted() {},
+  mounted() {
+    this.templatesToChange = structuredClone(this.config.templates);
+    this.configToChange = structuredClone(this.config);
+    this.template = this.configToChange.templates[0];
+    this.type = this.configToChange.templates[0].type;
+  },
   methods: {
     updatePrecondition() {
       const regex = /(<([^>]+)>)/gi;
@@ -147,7 +146,7 @@ export default {
         this.template.precondition.content.replace(regex, "");
     },
     handleTemplate() {
-      this.templates.map((item) => {
+      this.templatesToChange.map((item) => {
         let temp = Object.assign({}, item);
         if (temp.type === this.type) {
           this.template = temp;
@@ -159,15 +158,15 @@ export default {
       this.template = this.templates[0];
     },
     saveTemplate() {
-      this.templates = this.templates.map((item) => {
+      this.templatesToChange = this.templatesToChange.map((item) => {
         let temp = Object.assign({}, item);
         if (temp.type === this.template.type) {
           temp = this.template;
         }
         return temp;
       });
-      this.config.templates = this.templates;
-      this.$emit("submit-config", this.config);
+      this.configToChange.templates = this.templatesToChange;
+      this.$emit("submit-config", this.configToChange);
     },
   },
 };
diff --git a/src/services/electronService.js b/src/services/electronService.js
index cdf44dad..2e4a396a 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -108,6 +108,32 @@ export default class ElectronService {
     });
   }
 
+  async openConfigFile() {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.OPEN_CONFIG_FILE,
+    });
+  }
+
+  async openCredentialsFile() {
+    return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+      func: IPC_FUNCTIONS.OPEN_CREDENTIALS_FILE,
+    });
+  }
+
+  async openShareOauthWindow(credentials) {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
+      data: {
+        path: "shareOAuth",
+        size: {
+          width: 400,
+          height: 550,
+        },
+        data: credentials,
+      },
+    });
+  }
+
   async openEditWindow(data) {
     return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,

From cb41f41299791d4eee1f7c44e3bf61b8785e186f Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 20 Dec 2023 10:55:25 +0200
Subject: [PATCH 28/41] fixing tabs to work with new structure

---
 src/components/settings/AddonsTab.vue         | 38 +++++++++++--------
 .../settings/ConfigCheckListTab.vue           |  2 -
 src/components/settings/TemplateTab.vue       |  8 ++--
 3 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/src/components/settings/AddonsTab.vue b/src/components/settings/AddonsTab.vue
index 9ff81251..b12f188c 100755
--- a/src/components/settings/AddonsTab.vue
+++ b/src/components/settings/AddonsTab.vue
@@ -1,6 +1,6 @@
 <template>
   <v-container class="content-wrapper">
-    <v-row>
+    <v-row v-if="configToChange">
       <v-col cols="12" class="border-bottom pa-4 screen-recording-section">
         <p class="body-1" :style="{ color: currentTheme.default }">
           {{ $tc("caption.ai_assist", 1) }}
@@ -13,7 +13,7 @@
           </div>
           <div class="flex-grow-0">
             <v-switch
-              v-model="config.ai.enabled"
+              :value="config.ai.enabled"
               inset
               hide-details
               dense
@@ -73,7 +73,8 @@
 <script>
 import dayjs from "dayjs";
 import openAIIntegrationHelper from "../../integrations/OpenAIIntegrationHelpers";
-import { DEFAULT_OPENAI_CONFIGS } from "../../modules/constants";
+import { DEFAULT_OPENAI_CONFIGS } from "@/modules/constants";
+import { mapGetters } from "vuex";
 
 export default {
   name: "AddonsTab",
@@ -83,10 +84,10 @@ export default {
       type: Object,
       default: () => {},
     },
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
+    // configItem: {
+    //   type: Object,
+    //   default: () => {},
+    // },
     credentialItems: {
       type: Object,
       default: () => {},
@@ -96,14 +97,17 @@ export default {
     metadata: function (newValue) {
       this.meta = newValue;
     },
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
+    // configItem: function (newValue) {
+    //   this.config = newValue;
+    // },
     credentialItems: function (newValue) {
       this.credentials = newValue;
     },
   },
   computed: {
+    ...mapGetters({
+      config: "config/fullConfig",
+    }),
     currentTheme() {
       if (this.$vuetify.theme.dark) {
         return this.$vuetify.theme.themes.dark;
@@ -115,7 +119,8 @@ export default {
   data() {
     return {
       meta: this.metadata,
-      config: this.configItem,
+      configToChange: null,
+      // config: this.configItem,
       credentials: this.credentialItems,
       rules: {
         noAsterisk: (value) =>
@@ -127,14 +132,17 @@ export default {
       customErrors: [],
     };
   },
+  mounted() {
+    this.configToChange = structuredClone(this.config);
+  },
   methods: {
     handleConfig() {
-      if (this.config.ai.enabled) {
-        this.config.ai.openai = DEFAULT_OPENAI_CONFIGS;
+      if (this.configToChange.ai.enabled) {
+        this.configToChange.ai.openai = DEFAULT_OPENAI_CONFIGS;
       } else {
-        this.config.ai.openai = {};
+        this.configToChange.ai.openai = {};
       }
-      this.$emit("submit-config", this.config);
+      this.$emit("submit-config", this.configToChange);
     },
     async handleOpenAIKey() {
       let validates = this.$refs.openAIKey.validate();
diff --git a/src/components/settings/ConfigCheckListTab.vue b/src/components/settings/ConfigCheckListTab.vue
index 761fb335..4b0ae196 100644
--- a/src/components/settings/ConfigCheckListTab.vue
+++ b/src/components/settings/ConfigCheckListTab.vue
@@ -263,8 +263,6 @@ export default {
       }
     },
     updateData: function (key, data) {
-      if (!window.ipc) return;
-
       const config = {
         ...this.config,
         checklist: {
diff --git a/src/components/settings/TemplateTab.vue b/src/components/settings/TemplateTab.vue
index a0be24ee..6ca9d554 100644
--- a/src/components/settings/TemplateTab.vue
+++ b/src/components/settings/TemplateTab.vue
@@ -106,7 +106,7 @@
 </template>
 
 <script>
-import { SESSION_TYPES } from "../../modules/constants";
+import { SESSION_TYPES } from "@/modules/constants";
 import { mapGetters } from "vuex";
 export default {
   name: "TemplateTab",
@@ -126,10 +126,10 @@ export default {
   },
   data() {
     return {
-      templatesToChange: null, // this.config.templates,
+      templatesToChange: null,
       configToChange: null,
-      template: null, // this.config.templates[0],
-      type: null, // this.config.templates[0].type,
+      template: null,
+      type: null,
       sessionTypes: SESSION_TYPES,
     };
   },

From bff4147db3e1c7a7fdd30784bd26d5258028e23d Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 20 Dec 2023 11:12:23 +0200
Subject: [PATCH 29/41] fixed all settings tabs to work with a new store
 structure, cleaning things

---
 src/components/settings/AddonsTab.vue         |  8 -----
 .../settings/ConfigCheckListTab.vue           | 30 +++++++++----------
 src/components/settings/HotkeysTab.vue        | 29 ++++++++----------
 3 files changed, 27 insertions(+), 40 deletions(-)

diff --git a/src/components/settings/AddonsTab.vue b/src/components/settings/AddonsTab.vue
index b12f188c..2203618e 100755
--- a/src/components/settings/AddonsTab.vue
+++ b/src/components/settings/AddonsTab.vue
@@ -84,10 +84,6 @@ export default {
       type: Object,
       default: () => {},
     },
-    // configItem: {
-    //   type: Object,
-    //   default: () => {},
-    // },
     credentialItems: {
       type: Object,
       default: () => {},
@@ -97,9 +93,6 @@ export default {
     metadata: function (newValue) {
       this.meta = newValue;
     },
-    // configItem: function (newValue) {
-    //   this.config = newValue;
-    // },
     credentialItems: function (newValue) {
       this.credentials = newValue;
     },
@@ -120,7 +113,6 @@ export default {
     return {
       meta: this.metadata,
       configToChange: null,
-      // config: this.configItem,
       credentials: this.credentialItems,
       rules: {
         noAsterisk: (value) =>
diff --git a/src/components/settings/ConfigCheckListTab.vue b/src/components/settings/ConfigCheckListTab.vue
index 4b0ae196..78980a32 100644
--- a/src/components/settings/ConfigCheckListTab.vue
+++ b/src/components/settings/ConfigCheckListTab.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container class="wrapper">
+  <v-container v-if="configToChange" class="wrapper">
     <div class="title">{{ $tc("caption.session_checklist", 1) }}</div>
     <p class="mt-2 mb-4">
       {{ $t("message.use_pre_post_test_checklist") }}
@@ -132,19 +132,13 @@
   </v-container>
 </template>
 <script>
+import { mapGetters } from "vuex";
+
 export default {
   name: "ConfigCheckListTab",
   components: {},
-  props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
-  },
+  props: {},
   watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-    },
     preTaskList: {
       handler: function () {
         this.updateData("presession", {
@@ -169,7 +163,7 @@ export default {
   },
   data() {
     return {
-      config: this.configItem,
+      configToChange: null,
       preTaskList: [],
       postTaskList: [],
       presessionStatus: false,
@@ -178,6 +172,9 @@ export default {
     };
   },
   computed: {
+    ...mapGetters({
+      config: "config/fullConfig",
+    }),
     currentTheme() {
       if (this.$vuetify.theme.dark) {
         return this.$vuetify.theme.themes.dark;
@@ -186,6 +183,9 @@ export default {
       }
     },
   },
+  mounted() {
+    this.configToChange = structuredClone(this.config);
+  },
   methods: {
     fetchData: function () {
       this.preTaskList = this.config.checklist.presession.tasks;
@@ -263,15 +263,15 @@ export default {
       }
     },
     updateData: function (key, data) {
-      const config = {
-        ...this.config,
+      this.configToChange = {
+        ...this.configToChange,
         checklist: {
-          ...this.config.checklist,
+          ...this.configToChange.checklist,
           [key]: data,
         },
       };
 
-      this.$emit("submit-config", config);
+      this.$emit("submit-config", this.configToChange);
     },
     handleStatus: function () {
       if (this.tab === "pre") {
diff --git a/src/components/settings/HotkeysTab.vue b/src/components/settings/HotkeysTab.vue
index bbbaba4f..deac0cf4 100755
--- a/src/components/settings/HotkeysTab.vue
+++ b/src/components/settings/HotkeysTab.vue
@@ -5,7 +5,7 @@
       {{ $t("message.speed_hotkey") }}
     </p>
 
-    <v-row>
+    <v-row v-if="configToChange">
       <v-col cols="12" class="pa-4">
         <div class="mb-3 session-type">
           <p class="subtitle-1 mb-1" :style="{ color: currentTheme.secondary }">
@@ -52,6 +52,7 @@
 import { HOTKEY_PAGES } from "../../modules/constants";
 
 import KeyCaptureDialog from "../dialogs/KeyCaptureDialog.vue";
+import { mapGetters } from "vuex";
 
 export default {
   name: "HotkeyTab",
@@ -59,18 +60,11 @@ export default {
     KeyCaptureDialog,
   },
   props: {
-    configItem: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  watch: {
-    configItem: function (newValue) {
-      this.config = newValue;
-      this.hotkeys = newValue.hotkeys;
-    },
   },
   computed: {
+    ...mapGetters({
+      config: "config/fullConfig",
+    }),
     currentTheme() {
       if (this.$vuetify.theme.dark) {
         return this.$vuetify.theme.themes.dark;
@@ -81,8 +75,8 @@ export default {
   },
   data() {
     return {
-      config: this.configItem,
-      hotkeys: this.configItem.hotkeys,
+      configToChange: null,
+      hotkeys: null,
       chosenPage: "",
       hotkeyPages: HOTKEY_PAGES,
       keyCaptureDialog: false,
@@ -99,8 +93,10 @@ export default {
     });
   },
   mounted() {
+    this.configToChange = structuredClone(this.config);
+    this.hotkeys = this.configToChange.hotkeys;
     if (this.chosenPage === "") {
-      this.chosenPage = Object.keys(this.configItem.hotkeys)[0];
+      this.chosenPage = Object.keys(this.configToChange.hotkeys)[0];
     }
   },
   methods: {
@@ -108,16 +104,15 @@ export default {
       if (!key || !bindings) return;
       // Accept key and binding, then update and save
       this.hotkeys[this.chosenPage][key] = bindings;
-      this.config.hotkeys = this.hotkeys;
+      this.configToChange.hotkeys = this.hotkeys;
 
-      this.$emit("submit-config", this.config);
+      this.$emit("submit-config", this.configToChange);
 
       this.keyCaptureDialog = false;
       this.selectedKey = "";
       this.selectedBindings = [];
     },
     showKeyCaptureDialog(key, bindings) {
-      if (!window.ipc) return;
       this.selectedKey = key;
       this.selectedBindings = bindings;
       this.keyCaptureDialog = true;

From 7d92bc6718d0c4366a88295973a0ffcac5917512 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 20 Dec 2023 11:26:47 +0200
Subject: [PATCH 30/41] refactoring ResultView

---
 src/components/settings/HotkeysTab.vue |  3 +-
 src/views/ResultView.vue               | 71 ++++++++------------------
 2 files changed, 21 insertions(+), 53 deletions(-)

diff --git a/src/components/settings/HotkeysTab.vue b/src/components/settings/HotkeysTab.vue
index deac0cf4..0d0bc810 100755
--- a/src/components/settings/HotkeysTab.vue
+++ b/src/components/settings/HotkeysTab.vue
@@ -59,8 +59,7 @@ export default {
   components: {
     KeyCaptureDialog,
   },
-  props: {
-  },
+  props: {},
   computed: {
     ...mapGetters({
       config: "config/fullConfig",
diff --git a/src/views/ResultView.vue b/src/views/ResultView.vue
index 0ac82885..c063998f 100644
--- a/src/views/ResultView.vue
+++ b/src/views/ResultView.vue
@@ -207,7 +207,7 @@ import ReviewWrapper from "../components/ReviewWrapper.vue";
 import VueTagsInput from "@johmun/vue-tags-input";
 import { VEmojiPicker } from "v-emoji-picker";
 
-import { IPC_HANDLERS, IPC_FUNCTIONS, TEXT_TYPES } from "../modules/constants";
+import { TEXT_TYPES } from "@/modules/constants";
 
 export default {
   name: "ResultView",
@@ -255,22 +255,16 @@ export default {
     this.$root.$on("save-data", this.updateActiveSession);
     this.$root.$on("update-session", this.updateActiveSession);
 
-    if (!window.ipc) return;
-
-    window.ipc.on("DATA_CHANGE", () => {
-      this.fetchItems();
-    });
-    window.ipc.on("CONFIG_CHANGE", () => {
-      this.getConfig();
-    });
-    window.ipc.on("CREDENTIAL_CHANGE", () => {
-      this.getCredentials();
-    });
-    window.ipc.on("META_CHANGE", () => {
-      this.fetchItems();
-      this.getConfig();
-      this.getCredentials();
-    });
+    if (this.$isElectron) {
+      this.$electronService.onDataChange(this.fetchItems);
+      this.$electronService.onConfigChange(this.getConfig);
+      this.$electronService.onCredentialChange(this.getCredentials);
+      this.$electronService.onMetaChange(() => {
+        this.fetchItems();
+        this.getConfig();
+        this.getCredentials();
+      });
+    }
   },
   computed: {
     searchItems() {
@@ -287,36 +281,16 @@ export default {
     },
   },
   methods: {
-    fetchItems() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, { func: IPC_FUNCTIONS.GET_ITEMS })
-        .then((result) => {
-          this.items = result;
-        });
+    async fetchItems() {
+      this.items = await this.$storageService.getItems();
     },
-    getConfig() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CONFIG,
-        })
-        .then((result) => {
-          this.config = result;
-        });
+    async getConfig() {
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
     },
-    getCredentials() {
-      if (!window.ipc) return;
-
-      window.ipc
-        .invoke(IPC_HANDLERS.DATABASE, {
-          func: IPC_FUNCTIONS.GET_CREDENTIALS,
-        })
-        .then((result) => {
-          this.credentials = result;
-        });
+    async getCredentials() {
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
     },
     selectEmoji(emoji) {
       this.emojiMenu = false;
@@ -368,12 +342,7 @@ export default {
         return temp;
       });
 
-      if (!window.ipc) return;
-
-      window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.UPDATE_ITEMS,
-        data: this.items,
-      });
+      this.$storageService.updateItems(this.items);
     },
     handleClear() {
       this.activeSession.comment = "";

From 92be6b633addd0aa6155ae75da30e8a73cfa189d Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Sun, 31 Dec 2023 10:05:33 +0200
Subject: [PATCH 31/41] fixed problem with screenshots and video

---
 src/components/ControlPanel.vue               |  6 ++++--
 src/components/dialogs/SourcePickerDialog.vue | 12 +++---------
 2 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 7adffbcf..b394c3aa 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -628,7 +628,7 @@
         :sources="sources"
         :sourceId="sourceId"
         :loaded="loaded"
-        @submit-source="startSession()"
+        @submit-source="startSession"
       />
       <NoteDialog
         v-model="noteDialog"
@@ -1242,7 +1242,9 @@ export default {
           if (this.$isElectron) {
             // todo add web implementation
             const { status, message, item } =
-              this.$electronService.createImage(imgURI);
+              await this.$electronService.createImage(imgURI);
+
+            console.log({ item });
 
             if (status === STATUSES.ERROR) {
               this.$root.$emit("set-snackbar", message);
diff --git a/src/components/dialogs/SourcePickerDialog.vue b/src/components/dialogs/SourcePickerDialog.vue
index 04bcdd73..49ee48a0 100644
--- a/src/components/dialogs/SourcePickerDialog.vue
+++ b/src/components/dialogs/SourcePickerDialog.vue
@@ -69,7 +69,7 @@
 </template>
 
 <script>
-import {mapGetters} from "vuex";
+import { mapGetters } from "vuex";
 
 export default {
   name: "SourcePickerDialog",
@@ -98,16 +98,10 @@ export default {
       hotkeys: "config/hotkeys",
     }),
     confirmHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.save",
-        this.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.save", this.hotkeys);
     },
     cancelHotkey() {
-      return this.$hotkeyHelpers.findBinding(
-        "general.cancel",
-        this.hotkeys
-      );
+      return this.$hotkeyHelpers.findBinding("general.cancel", this.hotkeys);
     },
     currentTheme() {
       if (this.$vuetify.theme.dark) {

From 8271a91246dca4a37e4960a04353a3871d6db899 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 3 Jan 2024 10:07:11 +0200
Subject: [PATCH 32/41] comment-related changes, clearings

---
 package.json                     |  1 -
 src/components/ControlPanel.vue  | 35 ++++++++++++++++----------------
 src/components/MenuPopover.vue   |  1 -
 src/modules/FileSystemUtility.js |  3 ---
 src/store/index.js               | 11 +---------
 src/store/modules/config.js      | 18 ++++++++++++++++
 6 files changed, 37 insertions(+), 32 deletions(-)

diff --git a/package.json b/package.json
index a2595929..ab4e600b 100644
--- a/package.json
+++ b/package.json
@@ -45,7 +45,6 @@
     "ffprobe-static": "^3.1.0",
     "fluent-ffmpeg": "^2.1.2",
     "form-data": "^4.0.0",
-    "json-server": "^0.17.4",
     "lodash": "^4.17.21",
     "node-polyfill-webpack-plugin": "^2.0.1",
     "simple-json-db": "^2.0.0",
diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index b394c3aa..c080e09a 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -712,6 +712,7 @@ import NewSessionDialog from "./dialogs/NewSessionDialog.vue";
 import DurationConfirmDialog from "./dialogs/DurationConfirmDialog.vue";
 import AudioErrorDialog from "./dialogs/AudioErrorDialog.vue";
 import EndSessionDialog from "./dialogs/EndSessionDialog.vue";
+//import MinimizeControlWrapper from "../components/MinimizeControlWrapper.vue";
 import JiraExportSession from "./jira/JiraExportSession";
 import TestRailExportSession from "./testrail/TestRailExportSession";
 
@@ -747,6 +748,7 @@ export default {
     DurationConfirmDialog,
     AudioErrorDialog,
     EndSessionDialog,
+    // MinimizeControlWrapper,
     JiraExportSession,
     TestRailExportSession,
     JiraAddIssue,
@@ -1030,7 +1032,7 @@ export default {
       try {
         let data = await this.fetchSources();
         this.loaded = true;
-        this.sources = data.filter((source) => source.name !== "yattie");
+        this.sources = data;
         this.sourcePickerDialog = true;
       } catch (err) {
         console.log(err);
@@ -1110,23 +1112,22 @@ export default {
       } else {
         sessionId = uuidv4();
         this.$store.commit("setSessionId", sessionId);
-      }
-
-      const data = {
-        id: sessionId,
-        title: this.$store.state.title,
-        charter: this.$store.state.charter,
-        preconditions: this.$store.state.preconditions,
-        duration: this.$store.state.duration,
-        status: this.$store.state.status,
-        timer: this.$store.state.timer,
-        started: this.$store.state.started,
-        ended: this.$store.state.ended,
-        quickTest: this.$store.state.quickTest,
-        path: this.$route.path,
-      };
+        const data = {
+          id: sessionId,
+          title: this.$store.state.title,
+          charter: this.$store.state.charter,
+          preconditions: this.$store.state.preconditions,
+          duration: this.$store.state.duration,
+          status: this.$store.state.status,
+          timer: this.$store.state.timer,
+          started: this.$store.state.started,
+          ended: this.$store.state.ended,
+          quickTest: this.$store.state.quickTest,
+          path: this.$route.path,
+        };
 
-      await this.$storageService.createNewSession(data);
+        await this.$storageService.createNewSession(data);
+      }
 
       const currentPath = this.$router.history.current.path;
       if (currentPath !== "/main/workspace") {
diff --git a/src/components/MenuPopover.vue b/src/components/MenuPopover.vue
index 41bdf67e..c9564fcf 100644
--- a/src/components/MenuPopover.vue
+++ b/src/components/MenuPopover.vue
@@ -113,7 +113,6 @@ export default {
   },
   methods: {
     async openAccountLink(credentialType, credential) {
-      console.log(credentialType, credential);
       if (credentialType === "yatt") {
         const yattUrl = "https://app.yatt.ai/";
         if (this.$isElectron) {
diff --git a/src/modules/FileSystemUtility.js b/src/modules/FileSystemUtility.js
index a052f610..0bb4a30d 100644
--- a/src/modules/FileSystemUtility.js
+++ b/src/modules/FileSystemUtility.js
@@ -61,8 +61,6 @@ module.exports.exportItems = async (ids) => {
 };
 
 module.exports.createNewSession = async (state) => {
-  console.log("createNewSession, state ID:", state.id);
-  // state.id = uuidv4();
   const dataFolder = path.join(configDir, "sessions", state.id);
   if (!fs.existsSync(dataFolder)) {
     fs.mkdirSync(dataFolder, { recursive: true });
@@ -205,7 +203,6 @@ module.exports.openSession = async () => {
 
 module.exports.exportSession = async (params) => {
   const timestamp = dayjs().format("YYYY-MM-DD_HH-mm-ss-ms");
-  // const id = databaseUtility.getSessionID();
   const id = params.id;
   const notesFileName = "yattie-session-" + timestamp + "-notes.txt";
   const notes = databaseUtility.getNotes();
diff --git a/src/store/index.js b/src/store/index.js
index 4ab45a66..9055bba9 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -169,16 +169,7 @@ export default new Vuex.Store({
       }
     },
   },
-  actions: {
-    // async resetState(context, payload) {
-    //   await this._vm.$storageService.updateState(payload);
-    //   context.commit("resetState", payload);
-    // },
-    // async restoreState(context, payload) {
-    //   await this._vm.$storageService.updateState(payload);
-    //   context.commit("restoreState", payload);
-    // },
-  },
+  actions: {},
   getters: {
     requiredPreSessionTasksChecked(state) {
       const uncheckedTasks = state.preSessionTasks.filter(
diff --git a/src/store/modules/config.js b/src/store/modules/config.js
index ea56453a..6a4b10f0 100644
--- a/src/store/modules/config.js
+++ b/src/store/modules/config.js
@@ -2,9 +2,20 @@ import Vue from "vue";
 export const config = {
   namespaced: true,
   state: () => ({
+    useLocal: true,
+    apperance: "light",
     ai: {
       enabled: false,
     },
+    showIssue: false,
+    appLabel: false,
+    defaultLabel: "#1976D2FF",
+    commentType: "Comment",
+    audioCapture: false,
+    videoQuality: "high",
+    debugMode: false,
+    summary: false,
+    templates: [],
     checklist: {
       presession: {
         status: false,
@@ -15,6 +26,13 @@ export const config = {
         tasks: [],
       },
     },
+    hotkeys: {
+      evidence: {},
+      general: {},
+      home: {},
+      sessionPlanning: {},
+      workspace: {},
+    },
   }),
   mutations: {
     setFullConfig(state, payload) {

From abcc020f2e22e3d2b65cb44423912c2e0176863f Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 3 Jan 2024 10:14:38 +0200
Subject: [PATCH 33/41] formatting

---
 src/views/AddEvidence.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/AddEvidence.vue b/src/views/AddEvidence.vue
index cd39f2c5..b4dab228 100644
--- a/src/views/AddEvidence.vue
+++ b/src/views/AddEvidence.vue
@@ -435,7 +435,7 @@ export default {
     createJiraTicket: async function (val) {
       if (val) {
         let response = await jiraIntegrationHelper.getAllProjects(
-            this.credentials.jira
+          this.credentials.jira
         );
         this.projects = response.projects;
       }

From 96aa931001cacdad71085519d54119a3f9de6282 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 3 Jan 2024 12:59:32 +0200
Subject: [PATCH 34/41] viewMode support for the future

---
 src/components/ControlPanel.vue | 53 ++++++++++++++++++++++---------
 src/services/electronService.js | 56 +++++++++++++++++++++++++++++++++
 2 files changed, 95 insertions(+), 14 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index c080e09a..59a7e2dc 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -1033,7 +1033,13 @@ export default {
         let data = await this.fetchSources();
         this.loaded = true;
         this.sources = data;
-        this.sourcePickerDialog = true;
+        if (this.viewMode === "normal") {
+          this.sourcePickerDialog = true;
+        } else {
+          if (this.$isElectron) {
+            await this.$electronService.openSourcePickerWindow(this.sources);
+          }
+        }
       } catch (err) {
         console.log(err);
       }
@@ -1042,10 +1048,16 @@ export default {
       this.sourcePickerDialog = false;
     },
     showNoteDialog() {
-      this.noteDialog = true;
-      setTimeout(() => {
-        this.$refs.noteDialog.$refs.comment.editor.commands.focus();
-      });
+      if (this.viewMode === "normal") {
+        this.noteDialog = true;
+        setTimeout(() => {
+          this.$refs.noteDialog.$refs.comment.editor.commands.focus();
+        });
+      } else {
+        if (this.$isElectron) {
+          this.$electronService.openNoteEditorWindow(this.config);
+        }
+      }
     },
     hideNoteDialog() {
       this.noteDialog = false;
@@ -1129,9 +1141,11 @@ export default {
         await this.$storageService.createNewSession(data);
       }
 
-      const currentPath = this.$router.history.current.path;
-      if (currentPath !== "/main/workspace") {
-        await this.$router.push({ path: "/main/workspace" });
+      if (this.viewMode === "normal") {
+        const currentPath = this.$router.history.current.path;
+        if (currentPath !== "/main/workspace") {
+          await this.$router.push({ path: "/main/workspace" });
+        }
       }
     },
     pauseSession() {
@@ -1172,20 +1186,31 @@ export default {
       this.$router.push({ path: "/result" }).catch(() => {});
     },
     showSummaryDialog() {
-      this.summaryDialog = true;
+      if (this.viewMode === "normal") {
+        this.summaryDialog = true;
 
-      setTimeout(() => {
-        this.$refs.summaryDialog.$refs.comment.editor.commands.focus();
-      }, 200);
+        setTimeout(() => {
+          this.$refs.summaryDialog.$refs.comment.editor.commands.focus();
+        }, 200);
+      } else {
+        if (this.$isElectron) {
+          this.$electronService.openSummaryWindow(this.config);
+        }
+      }
     },
     showEndSessionDialog() {
-      this.endSessionDialog = true;
+      if (this.viewMode === "normal") {
+        this.endSessionDialog = true;
+      } else {
+        if (this.$isElectron) {
+          this.$electronService.openEndSessionWindow(this.config);
+        }
+      }
     },
     closeEndSessionDialog(status) {
       this.endSessionDialog = false;
       if (status) {
         this.showSummaryDialog();
-        // this.summaryDialog = true;
       }
     },
     resume() {
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 2e4a396a..7acfa68f 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -134,6 +134,62 @@ export default class ElectronService {
     });
   }
 
+  async openSourcePickerWindow(sources) {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
+      data: {
+        path: "sourcepicker",
+        size: {
+          width: 600,
+          height: 500,
+        },
+        data: sources,
+      },
+    });
+  }
+
+  async openNoteEditorWindow(config) {
+    return window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
+      data: {
+        path: "noteEditor",
+        size: {
+          width: 500,
+          height: 550,
+        },
+        data: config,
+      },
+    });
+  }
+
+  async openSummaryWindow(config) {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
+      data: {
+        path: "summaryEditor",
+        size: {
+          width: 500,
+          height: 500,
+        },
+        data: config,
+      },
+    });
+  }
+
+  async openEndSessionWindow(config) {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_MODAL_WINDOW,
+      data: {
+        path: "endsession",
+        size: {
+          width: 450,
+          height: 500,
+        },
+        data: config,
+      },
+    });
+  }
+
   async openEditWindow(data) {
     return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,

From 2d69e2b4a36631c0f6ce7dd9f0bedef01c7acf3d Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Wed, 3 Jan 2024 13:03:11 +0200
Subject: [PATCH 35/41] viewMode and minimize support for the future

---
 src/components/ControlPanel.vue | 12 ++++++++++++
 src/services/electronService.js |  7 +++++++
 2 files changed, 19 insertions(+)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 59a7e2dc..745554a7 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -1774,6 +1774,18 @@ export default {
         this.$electronService.changeMenuBySessionStatus(status);
       }
     },
+    async minimize() {
+      const data = {
+        status: this.status,
+        timer: this.timer,
+        duration: this.duration,
+        sourceId: this.sourceId,
+      };
+      localStorage.setItem("state-data", JSON.stringify(data));
+      if (this.$isElectron) {
+        await this.$electronService.openMinimizeWindow();
+      }
+    },
   },
 };
 </script>
diff --git a/src/services/electronService.js b/src/services/electronService.js
index 7acfa68f..900b132e 100644
--- a/src/services/electronService.js
+++ b/src/services/electronService.js
@@ -190,6 +190,13 @@ export default class ElectronService {
     });
   }
 
+  async openMinimizeWindow() {
+    return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
+      func: IPC_FUNCTIONS.OPEN_MINIMIZE_WINDOW,
+      data: { width: 400, height: 84 },
+    });
+  }
+
   async openEditWindow(data) {
     return await window.ipc.invoke(IPC_HANDLERS.WINDOW, {
       func: IPC_FUNCTIONS.OPEN_EDIT_WINDOW,

From c01e2a2363378bb6302133c49947c191652260f4 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Sun, 7 Jan 2024 22:19:02 +0200
Subject: [PATCH 36/41] progress on replacing Evidence views with vuetify
 dialogs

---
 src/App.vue                                   |   1 -
 src/components/ControlPanel.vue               |   2 +-
 src/components/TimelineWrapper.vue            |  34 +-
 src/components/dialogs/AddEvidenceDialog.vue  | 756 ++++++++++++++++++
 src/components/dialogs/EditEvidenceDialog.vue | 694 ++++++++++++++++
 5 files changed, 1481 insertions(+), 6 deletions(-)
 create mode 100644 src/components/dialogs/AddEvidenceDialog.vue
 create mode 100644 src/components/dialogs/EditEvidenceDialog.vue

diff --git a/src/App.vue b/src/App.vue
index e2ca6bab..deea3152 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -25,7 +25,6 @@ export default {
         const currentPath = this.$router.history.current.path;
         if (state.path && currentPath !== state.path) {
           if (state.path.includes("result") && this.$isElectron) {
-            // todo replace with dialog as soon dialog will be implemented
             this.$electronService.setWindowSize({ width: 1440, height: 900 });
           }
           await this.$router.push({ path: state.path });
diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 745554a7..e3cec37a 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -1183,7 +1183,7 @@ export default {
       if (this.$isElectron) {
         this.$electronService.setWindowSize({ width: 1440, height: 900 });
       }
-      this.$router.push({ path: "/result" }).catch(() => {});
+      await this.$router.push({ path: "/result" });
     },
     showSummaryDialog() {
       if (this.viewMode === "normal") {
diff --git a/src/components/TimelineWrapper.vue b/src/components/TimelineWrapper.vue
index f415272c..77c6fdfb 100644
--- a/src/components/TimelineWrapper.vue
+++ b/src/components/TimelineWrapper.vue
@@ -932,6 +932,18 @@
         </v-btn>
       </v-col>
     </v-row>
+    <AddEvidenceDialog
+      v-if="evidenceData"
+      v-model="addEvidenceDialog"
+      :item-data="evidenceData"
+      @close="addEvidenceDialog = false"
+    />
+    <EditEvidenceDialog
+      v-if="itemToEdit"
+      v-model="editEvidenceDialog"
+      :item-data="itemToEdit"
+      @close="editEvidenceDialog = false"
+    />
   </v-container>
 </template>
 
@@ -949,11 +961,15 @@ import { VEmojiPicker } from "v-emoji-picker";
 
 import dayjs from "dayjs";
 
-import { STATUSES, TEXT_TYPES } from "../modules/constants";
+import { STATUSES, TEXT_TYPES } from "@/modules/constants";
+import AddEvidenceDialog from "@/components/dialogs/AddEvidenceDialog.vue";
+import EditEvidenceDialog from "@/components/dialogs/EditEvidenceDialog.vue";
 
 export default {
   name: "TimelineWrapper",
   components: {
+    EditEvidenceDialog,
+    AddEvidenceDialog,
     VContainer,
     VRow,
     VCol,
@@ -998,6 +1014,7 @@ export default {
       itemLists: this.items,
       selected: [],
       activeSession: {},
+      itemToEdit: null,
       tags: "",
       eventName: this.eventType,
       textTypes: TEXT_TYPES,
@@ -1006,6 +1023,9 @@ export default {
       itemDragging: false,
       emojiMenu: {},
       selectedId: null,
+      addEvidenceDialog: false,
+      evidenceData: null,
+      editEvidenceDialog: false,
     };
   },
   computed: {
@@ -1038,6 +1058,7 @@ export default {
       return hours + ":" + minutes + ":" + seconds;
     },
     async uploadEvidence() {
+      console.log("upload evidence");
       // todo add relative handler for web app
       if (this.$isElectron) {
         const { status, message, item } =
@@ -1054,7 +1075,9 @@ export default {
             filePath: item.filePath,
             timer_mark: this.$store.state.timer,
           };
-          await this.openEditorModal(data);
+          // await this.openEditorModal(data);
+          this.evidenceData = data;
+          this.addEvidenceDialog = true;
         }
       }
     },
@@ -1108,8 +1131,10 @@ export default {
       this.saveData();
     },
     async handleActiveSession(id) {
-      this.activeSession = await this.$storageService.getItemById(id);
-      this.$emit("submit-session", this.activeSession);
+      this.itemToEdit = await this.$storageService.getItemById(id);
+      this.editEvidenceDialog = true;
+      // this.activeSession = await this.$storageService.getItemById(id);
+      // this.$emit("submit-session", this.activeSession);
     },
     async dragItem(event, item) {
       event.preventDefault();
@@ -1121,6 +1146,7 @@ export default {
       }
     },
     async dropFile(event) {
+      console.log("Drop file");
       event.preventDefault();
       event.stopPropagation();
       this.isDragging = false;
diff --git a/src/components/dialogs/AddEvidenceDialog.vue b/src/components/dialogs/AddEvidenceDialog.vue
new file mode 100644
index 00000000..e6dcc5c5
--- /dev/null
+++ b/src/components/dialogs/AddEvidenceDialog.vue
@@ -0,0 +1,756 @@
+<template>
+  <v-dialog
+    v-bind="$attrs"
+    v-on="$listeners"
+    persistent
+    width="100%"
+    max-width="900px"
+    eager
+  >
+    <v-sheet outlined rounded>
+      <div class="content">
+        <div class="content-top">
+          <ReviewWrapper
+            v-if="item"
+            :item="item"
+            :processing="processing"
+            :configItem="config"
+            :trigger-save="triggerSaveEvent"
+            :auto-save="autoSaveEvent"
+          />
+        </div>
+        <v-divider></v-divider>
+        <div class="content-bottom">
+          <div class="actions-wrapper">
+            <template v-if="emojis.length">
+              <v-btn
+                rounded
+                color="primary"
+                class="pa-0 mb-1"
+                height="26"
+                min-width="45"
+                v-for="(emoji, i) in emojis"
+                :key="i"
+                :disabled="processing"
+                @click="removeEmoji(emoji)"
+              >
+                <span class="emoji-icon">{{ emoji.data }}</span>
+                <v-icon x-small>mdi-close</v-icon>
+              </v-btn>
+            </template>
+
+            <v-menu
+              v-model="emojiMenu"
+              :close-on-content-click="false"
+              right
+              bottom
+              nudge-bottom="4"
+              offset-y
+            >
+              <template v-slot:activator="{ on: emojiMenu }">
+                <v-tooltip bottom>
+                  <template v-slot:activator="{ on: tooltip }">
+                    <v-btn
+                      rounded
+                      class="pa-0 mb-1"
+                      height="26"
+                      min-width="35"
+                      v-on="{
+                        ...emojiMenu,
+                        ...tooltip,
+                      }"
+                      :disabled="processing"
+                    >
+                      <img
+                        :src="require('../../assets/icon/add-emoticon.svg')"
+                        width="24"
+                        height="24"
+                      />
+                    </v-btn>
+                  </template>
+                  <span>{{ $tc("caption.add_reaction", 1) }}</span>
+                </v-tooltip>
+              </template>
+              <v-card class="emoji-lookup">
+                <VEmojiPicker
+                  labelSearch="Search"
+                  lang="en-US"
+                  @select="selectEmoji"
+                />
+              </v-card>
+            </v-menu>
+          </div>
+          <div
+            class="check-box"
+            v-shortkey="followUpHotkey"
+            @shortkey="toggleFollowUp()"
+          >
+            <label
+              ><input
+                type="checkbox"
+                name="follow_up"
+                class="item-select"
+                v-model="followUp"
+                :disabled="processing"
+              />{{ $tc("caption.required_follow_up", 1) }}
+            </label>
+          </div>
+          <div
+            v-shortkey="nameHotkey"
+            @shortkey="$hotkeyHelpers.focusField($refs, 'nameTextField')"
+          >
+            <v-text-field
+              name="name"
+              color="secondary"
+              :label="$tc('caption.filename', 1)"
+              v-model="name"
+              :suffix="fileSuffix"
+              :disabled="processing"
+              ref="nameTextField"
+              @input="handleName"
+            />
+          </div>
+          <v-card v-if="commentLoading" class="loading-wrapper" outlined flat>
+            <v-progress-circular
+              :color="currentTheme.primary"
+              size="70"
+              absolute
+              indeterminate
+            ></v-progress-circular>
+          </v-card>
+          <div
+            v-else
+            v-shortkey="commentHotkey"
+            @shortkey="$hotkeyHelpers.focusField($refs, 'comment')"
+          >
+            <v-tiptap
+              v-model="comment.content"
+              :placeholder="$t('message.insert_comment')"
+              ref="comment"
+              :toolbar="[
+                'headings',
+                '|',
+                'bold',
+                'italic',
+                'underline',
+                '|',
+                'color',
+                '|',
+                'bulletList',
+                'orderedList',
+                '|',
+                'link',
+                'emoji',
+                'blockquote',
+                '|',
+                '#aiAssist',
+              ]"
+              @input="updateComment"
+            >
+              <template #aiAssist="">
+                <v-btn
+                  v-if="aiAssistEnabled"
+                  icon
+                  small
+                  :title="$tc('caption.ai_assist', 1)"
+                  @click="handleAISuggestion('comment', $event)"
+                >
+                  <v-icon>{{
+                    previousComment?.content
+                      ? "mdi-robot-off-outline"
+                      : "mdi-robot-outline"
+                  }}</v-icon>
+                </v-btn>
+              </template>
+            </v-tiptap>
+          </div>
+          <div
+            v-shortkey="tagsHotkey"
+            @shortkey="$hotkeyHelpers.focusField($refs, 'tags')"
+          >
+            <vue-tags-input
+              ref="tags"
+              class="input-box"
+              v-model="tagText"
+              :tags="tags"
+              label="Tags"
+              :max-tags="10"
+              :maxlength="20"
+              @tags-changed="handleTags"
+              :placeholder="$t('message.insert_tag')"
+              :disabled="processing"
+            />
+          </div>
+
+          <div class="flex">
+            <v-menu
+              v-if="!createJiraTicket"
+              top
+              :offset-y="true"
+              :close-on-content-click="false"
+              ref="issueMenu"
+              v-model="issueCreateDestinationMenu"
+            >
+              <template v-slot:activator="{ on: issueCreateDestinationMenu }">
+                <v-tooltip top>
+                  <template v-slot:activator="{ on: onTooltip }">
+                    <v-btn
+                      id="btn__bug"
+                      class="control-btn mx-1"
+                      fab
+                      outlined
+                      small
+                      color="default"
+                      v-on="{ ...issueCreateDestinationMenu, ...onTooltip }"
+                    >
+                      <img
+                        v-if="$vuetify.theme.dark === false"
+                        :src="require('../../assets/icon/bug.svg')"
+                        width="24"
+                        height="24"
+                      />
+                      <img
+                        v-else
+                        :src="require('../../assets/icon/bug-gray.svg')"
+                        width="24"
+                        height="24"
+                      />
+                    </v-btn>
+                  </template>
+
+                  <span>{{ $tc("caption.create_new_issue", 1) }}</span>
+                </v-tooltip>
+              </template>
+              <v-card class="mx-auto" width="150" tile>
+                <v-list dense>
+                  <v-list-item
+                    @click="
+                      createJiraTicket = true;
+                      issueCreateDestinationMenu = false;
+                    "
+                  >
+                    <v-list-item-icon class="mr-4">
+                      <v-avatar size="24">
+                        <img
+                          :src="require('../../assets/icon/jira.png')"
+                          width="24"
+                          alt="avatar"
+                        />
+                      </v-avatar>
+                    </v-list-item-icon>
+                    <v-list-item-content>
+                      <v-list-item-title>{{
+                        $tc("caption.jira", 1)
+                      }}</v-list-item-title>
+                    </v-list-item-content>
+                  </v-list-item>
+                </v-list>
+              </v-card>
+            </v-menu>
+            <v-btn
+              v-if="createJiraTicket"
+              class="text-capitalize pa-0 back-btn"
+              plain
+              @click="createJiraTicket = false"
+              >{{ $tc("caption.cancel_creating_issue", 1) }}</v-btn
+            >
+          </div>
+          <JiraAddIssueForm
+            v-if="createJiraTicket"
+            :credential-items="credentials.jira"
+            :trigger-save="triggerJiraSaveTicket"
+            :items="[item]"
+            @issueAdded="handleSaveAndClose"
+          />
+          <div class="comment-type">
+            <div
+              :style="{ color: currentTheme.secondary }"
+              v-shortkey="typeHotkey"
+              @shortkey="openCommentType()"
+            >
+              {{ $tc("caption.comment_type", 1) }}
+            </div>
+            <v-select
+              ref="commentType"
+              :items="commentTypes"
+              v-model="comment.type"
+              :placeholder="$tc('caption.comment_type', 1)"
+              :disabled="processing"
+              solo
+              dense
+              hide-details="true"
+            ></v-select>
+          </div>
+        </div>
+      </div>
+      <div class="footer">
+        <v-btn
+          class="text-capitalize"
+          fill
+          small
+          color="white"
+          :style="{ color: currentTheme.black }"
+          @click="handleClear"
+        >
+          {{ $tc("caption.clear", 1) }}
+        </v-btn>
+        <div class="d-flex">
+          <v-btn
+            class="mr-2 text-capitalize"
+            fill
+            small
+            color="white"
+            :disabled="processing"
+            :style="{ color: currentTheme.black }"
+            v-shortkey="cancelHotkey"
+            @shortkey="handleDiscard()"
+            @click="handleDiscard()"
+          >
+            {{ $tc("caption.discard", 1) }}
+          </v-btn>
+          <v-btn
+            class="text-capitalize"
+            fill
+            small
+            color="primary"
+            :disabled="processing"
+            v-shortkey="saveHotkey"
+            @shortkey="handleSave()"
+            @click="handleSave()"
+          >
+            {{ $tc("caption.save", 1) }}
+          </v-btn>
+        </div>
+      </div>
+    </v-sheet>
+  </v-dialog>
+</template>
+
+<script>
+import ReviewWrapper from "@/components/ReviewWrapper.vue";
+import VueTagsInput from "@johmun/vue-tags-input";
+import { VEmojiPicker } from "v-emoji-picker";
+
+import { TEXT_TYPES, STATUSES, AI_ENABLED_FIELDS } from "@/modules/constants";
+
+import openAIIntegrationHelper from "../../integrations/OpenAIIntegrationHelpers";
+import { mapGetters } from "vuex";
+import jiraIntegrationHelper from "@/integrations/JiraIntegrationHelpers";
+import JiraAddIssueForm from "@/components/jira/JiraAddIssueForm.vue";
+
+export default {
+  name: "AddEvidenceDialog",
+  components: {
+    ReviewWrapper,
+    VueTagsInput,
+    VEmojiPicker,
+    JiraAddIssueForm,
+  },
+  props: {
+    itemData: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data() {
+    return {
+      createJiraTicket: false,
+      issueCreateDestinationMenu: false,
+      items: [],
+      item: null,
+      comment: {
+        type: "",
+        content: "",
+        text: "",
+      },
+      previousComment: {
+        type: "",
+        content: "",
+        text: "",
+      },
+      commentLoading: false,
+      name: "",
+      tagText: "",
+      tags: [],
+      emojiMenu: false,
+      emojis: [],
+      followUp: false,
+      commentTypes: Object.keys(TEXT_TYPES).filter(
+        (item) => item !== "Summary"
+      ),
+      processing: true,
+      triggerSaveEvent: false,
+      triggerJiraSaveTicket: false,
+      jiraTicketSaved: false,
+      autoSaveEvent: false,
+    };
+  },
+  created() {
+    this.fetchItems();
+    this.getConfig();
+    this.getCredentials();
+  },
+  computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+      config: "config/fullConfig",
+      credentials: "auth/credentials",
+    }),
+    nameHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.name", this.hotkeys);
+    },
+    followUpHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.followUp", this.hotkeys);
+    },
+    commentHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.comment", this.hotkeys);
+    },
+    tagsHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.tags", this.hotkeys);
+    },
+    typeHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.type", this.hotkeys);
+    },
+    saveHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.save", this.hotkeys);
+    },
+    cancelHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.cancel", this.hotkeys);
+    },
+    aiAssistEnabled() {
+      return this?.config?.ai?.enabled || false;
+    },
+    fileSuffix() {
+      let splitName = [];
+      if (this.item?.fileName) {
+        splitName = this.item?.fileName.split(".");
+      }
+      return splitName.length > 1 ? "." + splitName[splitName.length - 1] : "";
+    },
+    currentTheme() {
+      if (this.$vuetify.theme.dark) {
+        return this.$vuetify.theme.themes.dark;
+      } else {
+        return this.$vuetify.theme.themes.light;
+      }
+    },
+  },
+  mounted() {
+    if (this.$isElectron) {
+      // this.$electronService.onActiveSession(this.activeSession);
+      this.activeSession();
+    }
+
+    // Focus on comment
+    this.$refs.comment.editor.commands.focus();
+
+    this.$root.$on("update-session", this.updateSession);
+    this.$root.$on("update-processing", this.updateProcessing);
+    this.$root.$on("save-data", this.saveData);
+  },
+  watch: {
+    createJiraTicket: async function (val) {
+      if (val) {
+        let response = await jiraIntegrationHelper.getAllProjects(
+          this.credentials.jira
+        );
+        this.projects = response.projects;
+      }
+    },
+  },
+  methods: {
+    async activeSession() {
+      // set theme mode
+      const isDarkMode = this.config.apperance === "dark";
+      this.$vuetify.theme.dark = isDarkMode;
+      localStorage.setItem("isDarkMode", isDarkMode);
+
+      this.item = { ...this.itemData };
+
+      const splitName = this.item?.fileName.split(".") || [""];
+      this.name = splitName.slice(0, -1).join(".");
+
+      // optimize video
+      if (this.item.fileType === "video") {
+        await this.optimizeVideo();
+      } else {
+        this.processing = false;
+      }
+
+      // set comment type by config
+      if (this.config.commentType && this.config.commentType !== "") {
+        this.comment.type = this.config.commentType;
+      }
+      // set templates by config
+      this.config.templates.map((item) => {
+        let temp = Object.assign({}, item);
+        if (temp.type === this.item.sessionType) {
+          this.comment.content = temp.precondition.content;
+          this.comment.text = temp.precondition.text;
+        }
+      });
+    },
+    toggleFollowUp() {
+      this.followUp = !this.followUp;
+    },
+    openCommentType() {
+      const input = this.$refs.commentType.$el.querySelector(
+        "input:not([type=hidden]),textarea:not([type=hidden])"
+      );
+      input.click();
+      input.focus();
+    },
+    async fetchItems() {
+      this.items = await this.$storageService.getItems();
+    },
+    async getConfig() {
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
+    },
+    async getCredentials() {
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
+    },
+    async optimizeVideo() {
+      if (this.$isElectron) {
+        // todo add web handler for this
+        this.processing = true;
+
+        const { status, message } = await this.$electronService.optimizeVideo(
+          this.item.filePath
+        );
+
+        if (status === STATUSES.ERROR) {
+          this.$root.$emit("set-snackbar", message);
+          console.log(message);
+        }
+        this.processing = false;
+      }
+    },
+    updateComment() {
+      const regex = /(<([^>]+)>)/gi;
+      this.comment.text = this.comment.content.replace(regex, "");
+    },
+    updateSession(value) {
+      this.item = value;
+    },
+    updateProcessing(value) {
+      this.processing = value;
+    },
+    async handleDiscard() {
+      if (this.$isElectron) {
+        await this.$electronService.deleteFile(this.item.filePath);
+        await this.$electronService.deleteFile(this.item.poster);
+        await this.$electronService.closeAddWindow();
+      }
+    },
+    async handleSave() {
+      if (this.createJiraTicket) {
+        this.triggerJiraSaveTicket = !this.triggerJiraSaveTicket;
+      } else {
+        await this.handleSaveAndClose();
+      }
+    },
+    async handleSaveAndClose() {
+      this.triggerSaveEvent = !this.triggerSaveEvent;
+    },
+    handleName() {
+      this.item.fileName = this.name + this.fileSuffix;
+    },
+    handleTags(newTags) {
+      this.tags = newTags;
+    },
+    handleFollowUp($event) {
+      this.followUp = $event.target.checked;
+    },
+    selectEmoji(emoji) {
+      this.emojiMenu = false;
+      if (this.emojis.filter((item) => item.data === emoji.data).length) {
+        this.emojis = this.emojis.filter((item) => item.data !== emoji.data);
+      } else {
+        this.emojis.push(emoji);
+      }
+    },
+    removeEmoji(emoji) {
+      this.emojis = this.emojis.filter((item) => item.data !== emoji.data);
+    },
+    async saveData() {
+      const newItem = {
+        ...this.item,
+        comment: this.comment,
+        tags: this.tags,
+        emoji: this.emojis,
+        followUp: this.followUp,
+        timer_mark: this.item.timer_mark,
+        createdAt: Date.now(),
+      };
+      this.items.push(newItem);
+
+      await this.$storageService.updateItems(this.items);
+      // if (this.$isElectron) {
+      //   await this.$electronService.closeAddWindow();
+      // }
+      console.log("Inside Save Data");
+      this.$emit("close");
+    },
+    handleClear() {
+      this.comment = {
+        type: "Comment",
+        content: "",
+        text: "",
+      };
+    },
+    async handleAISuggestion(field, event) {
+      if (
+        (this[field]?.trim && this[field]?.trim()) ||
+        this[field]?.content?.trim()
+      ) {
+        let button = event.srcElement;
+        let enable = true;
+        let previousField =
+          "previous" + field[0].toUpperCase() + field.substring(1);
+        if (button.classList.contains("mdi-robot-off-outline")) {
+          enable = false;
+        }
+
+        if (enable) {
+          if (AI_ENABLED_FIELDS[field].type === "textField") {
+            this[previousField] = this[field];
+          } else {
+            this[previousField] = Object.assign({}, this[field]);
+          }
+          this[field + "Loading"] = true;
+          let response = await openAIIntegrationHelper.enhanceText(
+            this.credentials,
+            this.config,
+            field,
+            this[field]
+          );
+          if (response.error) {
+            enable = false;
+            if (AI_ENABLED_FIELDS[field].type === "textField") {
+              this[previousField] = "";
+            } else {
+              this[previousField] = {
+                content: "",
+                text: "",
+              };
+            }
+            this.$root.$emit(
+              "set-snackbar",
+              `${this.$tc("message.please_try_again", 1)} ${this.$tc(
+                "message.error",
+                1
+              )}: ${response.error}`
+            );
+          } else {
+            if (AI_ENABLED_FIELDS[field].type === "textField") {
+              this[field] = response.content;
+            } else {
+              this[field].content = response.content;
+            }
+          }
+          this[AI_ENABLED_FIELDS[field].callback]();
+          this[field + "Loading"] = false;
+        } else {
+          this[field] = this[previousField];
+          this[previousField] = "";
+        }
+
+        if (enable) {
+          button.classList.remove("mdi-robot-outline");
+          button.classList.add("mdi-robot-off-outline");
+        } else {
+          button.classList.remove("mdi-robot-off-outline");
+          button.classList.add("mdi-robot-outline");
+        }
+      } else {
+        this.$root.$emit(
+          "set-snackbar",
+          this.$tc("message.ai_assist_not_empty", 1)
+        );
+      }
+    },
+  },
+};
+</script>
+<style scoped>
+.v-icon.mdi.theme--light.mdi-robot-off-outline {
+  color: rgba(255, 0, 0, 0.6) !important;
+}
+.v-icon.mdi.theme--dark.mdi-robot-off-outline {
+  color: rgba(255, 0, 0, 1) !important;
+}
+.loading-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 250px;
+}
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  width: 100%;
+  overflow-y: auto;
+  padding: 0;
+}
+.content {
+  flex-grow: 1;
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+}
+.content .content-top {
+  padding: 20px;
+  flex-grow: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.content .content-bottom {
+  padding: 20px;
+  padding-bottom: 0;
+  display: flex;
+  flex-direction: column;
+  row-gap: 10px;
+}
+.actions-wrapper {
+  display: flex;
+  column-gap: 3px;
+  flex-wrap: wrap;
+}
+.actions-wrapper .v-btn.theme--dark {
+  background-color: white;
+  margin-left: 2px;
+}
+.emoji-icon {
+  font-size: 18px;
+  line-height: 1;
+}
+.check-box {
+  display: flex;
+  align-items: center;
+}
+.check-box > label {
+  display: flex;
+  column-gap: 5px;
+  font-size: 13px;
+  align-items: center;
+  font-weight: 500;
+  line-height: 20px;
+  color: #6b7280;
+}
+.footer {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+}
+.name-box {
+  background: #fff;
+  padding: 4px;
+}
+</style>
diff --git a/src/components/dialogs/EditEvidenceDialog.vue b/src/components/dialogs/EditEvidenceDialog.vue
new file mode 100644
index 00000000..a286e344
--- /dev/null
+++ b/src/components/dialogs/EditEvidenceDialog.vue
@@ -0,0 +1,694 @@
+<template>
+  <v-dialog
+    v-bind="$attrs"
+    v-on="$listeners"
+    persistent
+    width="100%"
+    max-width="900px"
+    eager
+  >
+    <v-sheet outlined rounded>
+      <div class="content">
+        <div
+          class="content-top"
+          v-if="Object.keys(item).length && item.fileType !== 'text'"
+        >
+          <ReviewWrapper
+            v-if="item"
+            :item="item"
+            :configItem="config"
+            :processing="processing"
+            :trigger-save="triggerSaveEvent"
+          />
+        </div>
+        <v-divider></v-divider>
+        <div class="content-bottom">
+          <div v-if="item?.fileType !== 'text'">
+            <div class="actions-wrapper">
+              <template v-if="item?.emoji?.length">
+                <v-btn
+                  rounded
+                  color="primary"
+                  class="pa-0 mb-1"
+                  height="26"
+                  min-width="45"
+                  style=""
+                  v-for="(emoji, i) in item.emoji"
+                  :key="i"
+                  @click="removeEmoji(emoji)"
+                >
+                  <span class="emoji-icon">{{ emoji.data }}</span>
+                  <v-icon x-small>mdi-close</v-icon>
+                </v-btn>
+              </template>
+              <v-menu
+                v-model="emojiMenu"
+                :close-on-content-click="false"
+                right
+                bottom
+                nudge-bottom="4"
+                offset-y
+              >
+                <template v-slot:activator="{ on: emojiMenu }">
+                  <v-tooltip bottom>
+                    <template v-slot:activator="{ on: tooltip }">
+                      <v-btn
+                        rounded
+                        class="pa-0 mb-1"
+                        height="26"
+                        min-width="35"
+                        v-on="{
+                          ...emojiMenu,
+                          ...tooltip,
+                        }"
+                      >
+                        <img
+                          :src="require('../../assets/icon/add-emoticon.svg')"
+                          width="24"
+                          height="24"
+                        />
+                      </v-btn>
+                    </template>
+                    <span>{{ $tc("caption.add_reaction", 1) }}</span>
+                  </v-tooltip>
+                </template>
+                <v-card class="emoji-lookup">
+                  <VEmojiPicker
+                    labelSearch="Search"
+                    lang="en-US"
+                    @select="selectEmoji"
+                  />
+                </v-card>
+              </v-menu>
+            </div>
+            <div
+              class="check-box"
+              v-shortkey="followUpHotkey"
+              @shortkey="toggleFollowUp()"
+            >
+              <label
+                ><input
+                  type="checkbox"
+                  name="follow_up"
+                  class="item-select"
+                  v-model="item.followUp"
+                  @change="handleFollowUp($event)"
+                />{{ $tc("caption.required_follow_up", 1) }}
+              </label>
+            </div>
+          </div>
+          <div
+            v-shortkey="nameHotkey"
+            @shortkey="$hotkeyHelpers.focusField($refs, 'nameTextField')"
+          >
+            <v-text-field
+              name="name"
+              color="secondary"
+              :label="$tc('caption.filename', 1)"
+              v-model="name"
+              :suffix="fileSuffix"
+              :disabled="processing"
+              ref="nameTextField"
+              @input="handleName"
+            />
+          </div>
+          <v-card v-if="commentLoading" class="loading-wrapper" outlined flat>
+            <v-progress-circular
+              :color="currentTheme.primary"
+              size="70"
+              absolute
+              indeterminate
+            ></v-progress-circular>
+          </v-card>
+          <div
+            v-else
+            v-shortkey="commentHotkey"
+            @shortkey="$hotkeyHelpers.focusField($refs, 'comment')"
+          >
+            <v-tiptap
+              v-if="Object.keys(item).length"
+              v-model="item.comment.content"
+              :placeholder="$t('message.insert_comment')"
+              ref="comment"
+              :toolbar="[
+                'headings',
+                '|',
+                'bold',
+                'italic',
+                'underline',
+                '|',
+                'color',
+                '|',
+                'bulletList',
+                'orderedList',
+                '|',
+                'link',
+                'emoji',
+                'blockquote',
+                '|',
+                '#aiAssist',
+              ]"
+              @input="updateComment"
+            >
+              <template #aiAssist="">
+                <v-btn
+                  v-if="aiAssistEnabled"
+                  icon
+                  small
+                  :title="$tc('caption.ai_assist', 1)"
+                  @click="handleAISuggestion('comment', $event)"
+                >
+                  <v-icon>{{
+                    previousComment?.content
+                      ? "mdi-robot-off-outline"
+                      : "mdi-robot-outline"
+                  }}</v-icon>
+                </v-btn>
+              </template>
+            </v-tiptap>
+          </div>
+          <div class="actions-wrapper" v-if="item.fileType === 'text'">
+            <template v-if="item.emoji.length">
+              <v-btn
+                rounded
+                color="primary"
+                class="pa-0 mb-1"
+                height="26"
+                min-width="45"
+                style=""
+                v-for="(emoji, i) in item.emoji"
+                :key="i"
+                @click="removeEmoji(emoji)"
+              >
+                <span class="emoji-icon">{{ emoji.data }}</span>
+                <v-icon x-small>mdi-close</v-icon>
+              </v-btn>
+            </template>
+
+            <v-menu
+              v-model="emojiMenu"
+              :close-on-content-click="false"
+              right
+              bottom
+              nudge-bottom="4"
+              offset-y
+            >
+              <template v-slot:activator="{ on: emojiMenu }">
+                <v-tooltip bottom>
+                  <template v-slot:activator="{ on: tooltip }">
+                    <v-btn
+                      rounded
+                      class="pa-0 mb-1"
+                      height="26"
+                      min-width="35"
+                      v-on="{
+                        ...emojiMenu,
+                        ...tooltip,
+                      }"
+                    >
+                      <img
+                        :src="require('../../assets/icon/add-emoticon.svg')"
+                        width="24"
+                        height="24"
+                      />
+                    </v-btn>
+                  </template>
+                  <span>{{ $tc("caption.add_reaction", 1) }}</span>
+                </v-tooltip>
+              </template>
+              <v-card class="emoji-lookup">
+                <VEmojiPicker
+                  labelSearch="Search"
+                  lang="en-US"
+                  @select="selectEmoji"
+                />
+              </v-card>
+            </v-menu>
+          </div>
+          <div
+            v-shortkey="tagsHotkey"
+            @shortkey="$hotkeyHelpers.focusField($refs, 'tags')"
+          >
+            <vue-tags-input
+              ref="tags"
+              class="input-box"
+              v-model="tag"
+              :tags="item.tags"
+              :max-tags="10"
+              :maxlength="20"
+              @tags-changed="handleTags"
+              :placeholder="$t('message.insert_tag')"
+            />
+          </div>
+          <div class="comment-type">
+            <div
+              :style="{ color: currentTheme.secondary }"
+              v-shortkey="typeHotkey"
+              @shortkey="openCommentType()"
+            >
+              {{ $tc("caption.comment_type", 1) }}
+            </div>
+            <v-select
+              ref="commentType"
+              :items="commentTypes"
+              v-model="item.comment.type"
+              :placeholder="$tc('caption.comment_type', 1)"
+              solo
+              dense
+              hide-details="true"
+            ></v-select>
+          </div>
+        </div>
+      </div>
+      <div class="footer">
+        <v-btn
+          class="text-capitalize"
+          fill
+          small
+          color="white"
+          :style="{ color: currentTheme.black }"
+          @click="handleClear"
+        >
+          {{ $tc("caption.clear", 1) }}
+        </v-btn>
+        <div class="d-flex">
+          <v-btn
+            class="mr-2 text-capitalize"
+            fill
+            small
+            color="white"
+            :disabled="processing"
+            :style="{ color: currentTheme.black }"
+            v-shortkey="cancelHotkey"
+            @shortkey="handleDiscard()"
+            @click="handleDiscard"
+          >
+            {{ $tc("caption.discard", 1) }}
+          </v-btn>
+          <v-btn
+            class="text-capitalize"
+            fill
+            small
+            color="primary"
+            :disabled="processing"
+            v-shortkey="saveHotkey"
+            @shortkey="handleSave()"
+            @click="handleSave"
+          >
+            {{ $tc("caption.save", 1) }}
+          </v-btn>
+        </div>
+      </div>
+    </v-sheet>
+  </v-dialog>
+</template>
+
+<script>
+import ReviewWrapper from "@/components/ReviewWrapper.vue";
+import VueTagsInput from "@johmun/vue-tags-input";
+import { VEmojiPicker } from "v-emoji-picker";
+
+import { TEXT_TYPES, AI_ENABLED_FIELDS } from "@/modules/constants";
+
+import openAIIntegrationHelper from "../../integrations/OpenAIIntegrationHelpers";
+import { mapGetters } from "vuex";
+
+export default {
+  name: "EditEvidenceDialog",
+  components: {
+    ReviewWrapper,
+    VueTagsInput,
+    VEmojiPicker,
+  },
+  props: {
+    itemData: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data() {
+    return {
+      item: {},
+      items: [],
+      previousComment: {
+        type: "",
+        content: "",
+        text: "",
+      },
+      commentLoading: false,
+      name: "",
+      tag: "",
+      emojiMenu: false,
+      commentTypes: Object.keys(TEXT_TYPES).filter(
+        (item) => item !== "Summary"
+      ),
+      processing: false,
+      triggerSaveEvent: false,
+    };
+  },
+  created() {
+    this.fetchItems();
+    this.getConfig();
+    this.getCredentials();
+  },
+  computed: {
+    ...mapGetters({
+      hotkeys: "config/hotkeys",
+      config: "config/fullConfig",
+      credentials: "auth/credentials",
+    }),
+    nameHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.name", this.hotkeys);
+    },
+    followUpHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.followUp", this.hotkeys);
+    },
+    commentHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.comment", this.hotkeys);
+    },
+    tagsHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.tags", this.hotkeys);
+    },
+    typeHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.type", this.hotkeys);
+    },
+    saveHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.save", this.hotkeys);
+    },
+    cancelHotkey() {
+      return this.$hotkeyHelpers.findBinding("evidence.cancel", this.hotkeys);
+    },
+    aiAssistEnabled() {
+      return this?.config?.ai?.enabled || false;
+    },
+    fileSuffix() {
+      let splitName = [];
+      if (this.item?.fileName) {
+        splitName = this.item?.fileName.split(".");
+      }
+      return splitName.length > 1 ? "." + splitName[splitName.length - 1] : "";
+    },
+    currentTheme() {
+      if (this.$vuetify.theme.dark) {
+        return this.$vuetify.theme.themes.dark;
+      } else {
+        return this.$vuetify.theme.themes.light;
+      }
+    },
+  },
+  mounted() {
+    if (this.$isElectron) {
+      this.activeSession();
+    }
+    this.$root.$on("update-session", this.updateSession);
+    this.$root.$on("update-processing", this.updateProcessing);
+    this.$root.$on("save-data", this.saveData);
+  },
+  watch: {
+    itemData: function () {
+      this.activeSession();
+    },
+  },
+  methods: {
+    activeSession() {
+      // set theme mode
+      const isDarkMode = this.config.apperance === "dark";
+      this.$vuetify.theme.dark = isDarkMode;
+      localStorage.setItem("isDarkMode", isDarkMode);
+
+      // set templates
+      this.item = { ...this.itemData };
+
+      const splitName = this.item?.fileName.split(".") || [""];
+      this.name = splitName.slice(0, -1).join(".");
+
+      this.processing = false;
+    },
+    toggleFollowUp() {
+      this.item.followUp = !this.item.followUp;
+    },
+    openCommentType() {
+      const input = this.$refs.commentType.$el.querySelector(
+        "input:not([type=hidden]),textarea:not([type=hidden])"
+      );
+      input.click();
+      input.focus();
+    },
+    async fetchItems() {
+      this.items = await this.$storageService.getItems();
+    },
+    updateSession(value) {
+      this.item = value;
+    },
+    updateProcessing(value) {
+      this.processing = value;
+    },
+    async getConfig() {
+      const config = await this.$storageService.getConfig();
+      this.$store.commit("config/setFullConfig", config);
+    },
+    async getCredentials() {
+      const credentials = await this.$storageService.getCredentials();
+      this.$store.commit("auth/setCredentials", credentials);
+    },
+    updateComment() {
+      const regex = /(<([^>]+)>)/gi;
+      this.item.comment.text = this.item.comment.content.replace(regex, "");
+    },
+    selectEmoji(emoji) {
+      this.emojiMenu = false;
+      if (this.item.emoji.filter((item) => item.data === emoji.data).length) {
+        this.item.emoji = this.item.emoji.filter(
+          (item) => item.data !== emoji.data
+        );
+      } else {
+        this.item.emoji.push(emoji);
+      }
+    },
+    removeEmoji(emoji) {
+      this.item.emoji = this.item.emoji.filter(
+        (item) => item.data !== emoji.data
+      );
+    },
+    handleClear() {
+      this.item.comment.type = "Comment";
+      this.item.comment.content = "";
+      this.item.comment.text = "";
+    },
+    handleDiscard() {
+      // if (this.$isElectron) {
+      //   this.$electronService.closeEditWindow();
+      // }
+      this.$emit("close");
+    },
+    async handleSave() {
+      if (this.item.sessionType !== "Note") {
+        this.triggerSaveEvent = true;
+      } else {
+        await this.saveData(this.item);
+      }
+    },
+    handleName() {
+      this.item.fileName = this.name + this.fileSuffix;
+    },
+    handleTags(newTags) {
+      this.item.tags = newTags;
+    },
+    handleFollowUp($event) {
+      this.item.followUp = $event.target.checked;
+    },
+    async saveData(data) {
+      if (data) {
+        this.item.fileName = data.fileName;
+        this.item.filePath = data.filePath;
+      }
+
+      this.items = this.items.map((item) => {
+        let temp = Object.assign({}, item);
+        if (temp.id === this.item.id) {
+          temp = this.item;
+        }
+        return temp;
+      });
+
+      await this.$storageService.updateItems(this.items);
+      this.$emit("close");
+      // if (this.$isElectron) {
+      //   await this.$electronService.closeEditWindow();
+      // }
+    },
+    async handleAISuggestion(field, event) {
+      if (
+        (this.item[field]?.trim && this.item[field]?.trim()) ||
+        this.item[field]?.content?.trim()
+      ) {
+        let button = event.srcElement;
+        let enable = true;
+        let previousField =
+          "previous" + field[0].toUpperCase() + field.substring(1);
+        if (button.classList.contains("mdi-robot-off-outline")) {
+          enable = false;
+        }
+
+        if (enable) {
+          if (AI_ENABLED_FIELDS[field].type === "textField") {
+            this[previousField] = this.item[field];
+          } else {
+            this[previousField] = Object.assign({}, this.item[field]);
+          }
+          this[field + "Loading"] = true;
+          let response = await openAIIntegrationHelper.enhanceText(
+            this.credentials,
+            this.config,
+            field,
+            this.item[field]
+          );
+          if (response.error) {
+            enable = false;
+            if (AI_ENABLED_FIELDS[field].type === "textField") {
+              this[previousField] = "";
+            } else {
+              this[previousField] = {
+                content: "",
+                text: "",
+              };
+            }
+            this.$root.$emit(
+              "set-snackbar",
+              `${this.$tc("message.please_try_again", 1)} ${this.$tc(
+                "message.error",
+                1
+              )}: ${response.error}`
+            );
+          } else {
+            if (AI_ENABLED_FIELDS[field].type === "textField") {
+              this.item[field] = response.content;
+            } else {
+              this.item[field].content = response.content;
+            }
+          }
+          this[AI_ENABLED_FIELDS[field].callback]();
+          this[field + "Loading"] = false;
+        } else {
+          this.item[field] = this[previousField];
+          this[previousField] = "";
+        }
+
+        if (enable) {
+          button.classList.remove("mdi-robot-outline");
+          button.classList.add("mdi-robot-off-outline");
+        } else {
+          button.classList.remove("mdi-robot-off-outline");
+          button.classList.add("mdi-robot-outline");
+        }
+      } else {
+        this.$root.$emit(
+          "set-snackbar",
+          this.$tc("message.ai_assist_not_empty", 1)
+        );
+      }
+    },
+  },
+};
+</script>
+<style scoped>
+.v-icon.mdi.theme--light.mdi-robot-off-outline {
+  color: rgba(255, 0, 0, 0.6) !important;
+}
+.v-icon.mdi.theme--dark.mdi-robot-off-outline {
+  color: rgba(255, 0, 0, 1) !important;
+}
+.loading-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 250px;
+}
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  width: 100%;
+  overflow-y: auto;
+  padding: 0;
+}
+.content {
+  flex-grow: 1;
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+}
+.content .content-top {
+  padding: 20px;
+  flex-grow: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.file-wrapper {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  row-gap: 15px;
+}
+.file-wrapper .file-icon {
+  padding: 30px;
+  border-radius: 50%;
+  border: 1px solid #d1d5db;
+  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);
+}
+.file-wrapper .file-icon .v-icon {
+  color: #6b7280;
+  font-size: 50px;
+}
+.file-wrapper p {
+  margin-bottom: 0;
+  font-style: normal;
+  font-weight: 700;
+  font-size: 16px;
+  line-height: 24px;
+  color: #374151;
+}
+.content .content-bottom {
+  padding: 20px;
+  padding-bottom: 0;
+  display: flex;
+  flex-direction: column;
+  row-gap: 10px;
+}
+.actions-wrapper {
+  display: flex;
+  column-gap: 3px;
+  flex-wrap: wrap;
+}
+.actions-wrapper .v-btn.theme--dark {
+  background-color: white;
+  margin-left: 2px;
+}
+.emoji-icon {
+  font-size: 18px;
+  line-height: 1;
+}
+.check-box {
+  display: flex;
+  align-items: center;
+}
+.check-box > label {
+  display: flex;
+  column-gap: 5px;
+  font-size: 13px;
+  align-items: center;
+  font-weight: 500;
+  line-height: 20px;
+  color: #6b7280;
+}
+.footer {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+}
+</style>

From 177494eda2d8299db3186ed1624ba6f45a66c93f Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 12 Jan 2024 11:43:31 +0200
Subject: [PATCH 37/41] both AddEvidence and EditEvidence are showing

---
 src/components/TimelineWrapper.vue            |  4 ++++
 src/components/dialogs/AddEvidenceDialog.vue  | 12 +++++++-----
 src/components/dialogs/EditEvidenceDialog.vue | 11 +++--------
 src/modules/CaptureUtility.js                 |  1 +
 src/views/MainView.vue                        |  1 +
 5 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/src/components/TimelineWrapper.vue b/src/components/TimelineWrapper.vue
index 77c6fdfb..7d1f5fba 100644
--- a/src/components/TimelineWrapper.vue
+++ b/src/components/TimelineWrapper.vue
@@ -1103,6 +1103,7 @@ export default {
       if (this.clicks === 1) {
         setTimeout(
           function () {
+            console.log("trigger from here");
             switch (this.clicks) {
               case 1:
                 if (this.eventName === "click") {
@@ -1132,7 +1133,10 @@ export default {
     },
     async handleActiveSession(id) {
       this.itemToEdit = await this.$storageService.getItemById(id);
+      console.log(this.itemToEdit);
+
       this.editEvidenceDialog = true;
+
       // this.activeSession = await this.$storageService.getItemById(id);
       // this.$emit("submit-session", this.activeSession);
     },
diff --git a/src/components/dialogs/AddEvidenceDialog.vue b/src/components/dialogs/AddEvidenceDialog.vue
index e6dcc5c5..d3cf0e75 100644
--- a/src/components/dialogs/AddEvidenceDialog.vue
+++ b/src/components/dialogs/AddEvidenceDialog.vue
@@ -449,6 +449,11 @@ export default {
     this.$root.$on("save-data", this.saveData);
   },
   watch: {
+    itemData: function (val) {
+      console.log("itemData changed");
+      console.log(val);
+      this.activeSession();
+    },
     createJiraTicket: async function (val) {
       if (val) {
         let response = await jiraIntegrationHelper.getAllProjects(
@@ -541,8 +546,9 @@ export default {
       if (this.$isElectron) {
         await this.$electronService.deleteFile(this.item.filePath);
         await this.$electronService.deleteFile(this.item.poster);
-        await this.$electronService.closeAddWindow();
+        // await this.$electronService.closeAddWindow();
       }
+      this.$emit("close");
     },
     async handleSave() {
       if (this.createJiraTicket) {
@@ -587,10 +593,6 @@ export default {
       this.items.push(newItem);
 
       await this.$storageService.updateItems(this.items);
-      // if (this.$isElectron) {
-      //   await this.$electronService.closeAddWindow();
-      // }
-      console.log("Inside Save Data");
       this.$emit("close");
     },
     handleClear() {
diff --git a/src/components/dialogs/EditEvidenceDialog.vue b/src/components/dialogs/EditEvidenceDialog.vue
index a286e344..e46040a9 100644
--- a/src/components/dialogs/EditEvidenceDialog.vue
+++ b/src/components/dialogs/EditEvidenceDialog.vue
@@ -1,5 +1,6 @@
 <template>
   <v-dialog
+    v-if="Object.keys(item).length"
     v-bind="$attrs"
     v-on="$listeners"
     persistent
@@ -292,7 +293,7 @@
             color="primary"
             :disabled="processing"
             v-shortkey="saveHotkey"
-            @shortkey="handleSave()"
+            @shortkey="handleSave"
             @click="handleSave"
           >
             {{ $tc("caption.save", 1) }}
@@ -476,14 +477,11 @@ export default {
       this.item.comment.text = "";
     },
     handleDiscard() {
-      // if (this.$isElectron) {
-      //   this.$electronService.closeEditWindow();
-      // }
       this.$emit("close");
     },
     async handleSave() {
       if (this.item.sessionType !== "Note") {
-        this.triggerSaveEvent = true;
+        this.triggerSaveEvent = !this.triggerSaveEvent;
       } else {
         await this.saveData(this.item);
       }
@@ -513,9 +511,6 @@ export default {
 
       await this.$storageService.updateItems(this.items);
       this.$emit("close");
-      // if (this.$isElectron) {
-      //   await this.$electronService.closeEditWindow();
-      // }
     },
     async handleAISuggestion(field, event) {
       if (
diff --git a/src/modules/CaptureUtility.js b/src/modules/CaptureUtility.js
index 74370da1..fdef0124 100644
--- a/src/modules/CaptureUtility.js
+++ b/src/modules/CaptureUtility.js
@@ -370,6 +370,7 @@ module.exports.uploadEvidence = async () => {
 
   // TODO - Handle multiple files uploaded
   const id = uuidv4();
+  console.log({ id });
   const fileName = path.basename(filePaths[0]);
   const filePath = path.join(
     configDir,
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 0a469866..63acc9b7 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -214,6 +214,7 @@ export default {
       );
     },
     async fetchItems() {
+      console.log("fetchItems from Main View");
       this.items = await this.$storageService.getItems();
     },
     addItem(newItem) {

From a575f5d79e2154234c3da1334b1199a2c51b5349 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 12 Jan 2024 12:42:45 +0200
Subject: [PATCH 38/41] debugging on why evidence is not loading after app
 restarted

---
 src/components/TimelineWrapper.vue            | 4 ++--
 src/components/dialogs/AddEvidenceDialog.vue  | 5 +++--
 src/components/dialogs/EditEvidenceDialog.vue | 9 ++++++---
 src/modules/DatabaseUtility.js                | 2 ++
 src/views/MainView.vue                        | 5 ++++-
 5 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/components/TimelineWrapper.vue b/src/components/TimelineWrapper.vue
index 7d1f5fba..70517aab 100644
--- a/src/components/TimelineWrapper.vue
+++ b/src/components/TimelineWrapper.vue
@@ -1132,9 +1132,9 @@ export default {
       this.saveData();
     },
     async handleActiveSession(id) {
+      console.log("handleActiveSession", { id });
       this.itemToEdit = await this.$storageService.getItemById(id);
-      console.log(this.itemToEdit);
-
+      console.log("item to edit", this.itemToEdit);
       this.editEvidenceDialog = true;
 
       // this.activeSession = await this.$storageService.getItemById(id);
diff --git a/src/components/dialogs/AddEvidenceDialog.vue b/src/components/dialogs/AddEvidenceDialog.vue
index d3cf0e75..079f01f3 100644
--- a/src/components/dialogs/AddEvidenceDialog.vue
+++ b/src/components/dialogs/AddEvidenceDialog.vue
@@ -315,8 +315,8 @@
             color="primary"
             :disabled="processing"
             v-shortkey="saveHotkey"
-            @shortkey="handleSave()"
-            @click="handleSave()"
+            @shortkey="handleSave"
+            @click="handleSave"
           >
             {{ $tc("caption.save", 1) }}
           </v-btn>
@@ -581,6 +581,7 @@ export default {
       this.emojis = this.emojis.filter((item) => item.data !== emoji.data);
     },
     async saveData() {
+      console.log("save data from AddEvidence");
       const newItem = {
         ...this.item,
         comment: this.comment,
diff --git a/src/components/dialogs/EditEvidenceDialog.vue b/src/components/dialogs/EditEvidenceDialog.vue
index e46040a9..f38ef3e8 100644
--- a/src/components/dialogs/EditEvidenceDialog.vue
+++ b/src/components/dialogs/EditEvidenceDialog.vue
@@ -351,6 +351,9 @@ export default {
     this.fetchItems();
     this.getConfig();
     this.getCredentials();
+    if (this.$isElectron) {
+      this.activeSession();
+    }
   },
   computed: {
     ...mapGetters({
@@ -398,9 +401,9 @@ export default {
     },
   },
   mounted() {
-    if (this.$isElectron) {
-      this.activeSession();
-    }
+    // if (this.$isElectron) {
+    //   this.activeSession();
+    // }
     this.$root.$on("update-session", this.updateSession);
     this.$root.$on("update-processing", this.updateProcessing);
     this.$root.$on("save-data", this.saveData);
diff --git a/src/modules/DatabaseUtility.js b/src/modules/DatabaseUtility.js
index 3a9cf930..338cca35 100644
--- a/src/modules/DatabaseUtility.js
+++ b/src/modules/DatabaseUtility.js
@@ -262,6 +262,7 @@ const removeItemById = (id) => {
 
 const getItemById = (id) => {
   const data = dataDb.get("items");
+  console.log({ dataDb });
   const item = data.find((item) => item.id === id);
 
   return item;
@@ -355,6 +356,7 @@ module.exports.addItem = (item) => {
 };
 
 module.exports.updateItems = (items) => {
+  console.log("update items in DB");
   try {
     dataDb.set("items", items);
     browserWindow = browserUtility.getBrowserWindow();
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 63acc9b7..dd775a21 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -145,10 +145,13 @@ export default {
       showMenu: false,
     };
   },
+  created() {
+    this.fetchItems();
+  },
   mounted() {
     this.setInitialPreSession();
     this.setInitialPostSession();
-    this.fetchItems();
+    // this.fetchItems();
     this.$root.$on("update-selected", this.updateSelected);
     this.$root.$on("save-session", this.saveSession);
     this.$root.$on("new-session", () => {

From 4a1710cb1bfb190337395df46cdd5b3e4a9c2535 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 12 Jan 2024 19:23:38 +0200
Subject: [PATCH 39/41] AddEvidence and EditEvidence working solution with
 vuetify dialogs

---
 src/components/ControlPanel.vue    | 20 +++++++++++---------
 src/components/TimelineWrapper.vue |  5 ++++-
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index e3cec37a..5c53cd0c 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -721,6 +721,8 @@ import JiraAddIssue from "./jira/JiraAddIssue";
 import {
   DEFAULT_MAP_CONNECTIONS,
   DEFAULT_MAP_NODES,
+  IPC_FUNCTIONS,
+  IPC_HANDLERS,
   SESSION_STATUSES,
   STATUSES,
   VIDEO_RESOLUTION,
@@ -1117,15 +1119,12 @@ export default {
         this.changeSessionStatus(SESSION_STATUSES.START);
       }
 
-      // creating new session ID here
-      let sessionId = null;
-      if (this.$store.state.id) {
-        sessionId = this.$store.state.id;
-      } else {
-        sessionId = uuidv4();
-        this.$store.commit("setSessionId", sessionId);
+      const sessionId = await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+        func: IPC_FUNCTIONS.GET_SESSION_ID,
+      });
+
+      if (sessionId === "") {
         const data = {
-          id: sessionId,
           title: this.$store.state.title,
           charter: this.$store.state.charter,
           preconditions: this.$store.state.preconditions,
@@ -1138,7 +1137,10 @@ export default {
           path: this.$route.path,
         };
 
-        await this.$storageService.createNewSession(data);
+        window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
+          func: IPC_FUNCTIONS.CREATE_NEW_SESSION,
+          data: data,
+        });
       }
 
       if (this.viewMode === "normal") {
diff --git a/src/components/TimelineWrapper.vue b/src/components/TimelineWrapper.vue
index 70517aab..7e79d8b2 100644
--- a/src/components/TimelineWrapper.vue
+++ b/src/components/TimelineWrapper.vue
@@ -942,7 +942,10 @@
       v-if="itemToEdit"
       v-model="editEvidenceDialog"
       :item-data="itemToEdit"
-      @close="editEvidenceDialog = false"
+      @close="
+        editEvidenceDialog = false;
+        itemToEdit = null;
+      "
     />
   </v-container>
 </template>

From 15a2c888b2aa452d77822bbb3ac3517eb5dacd55 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Fri, 12 Jan 2024 19:30:52 +0200
Subject: [PATCH 40/41] abstracting business logic

---
 src/components/ControlPanel.vue                    | 11 ++---------
 src/services/storage-options/localJsonDbService.js |  6 ++++++
 src/services/storageService.js                     |  4 ++++
 3 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 5c53cd0c..cd70c755 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -721,8 +721,6 @@ import JiraAddIssue from "./jira/JiraAddIssue";
 import {
   DEFAULT_MAP_CONNECTIONS,
   DEFAULT_MAP_NODES,
-  IPC_FUNCTIONS,
-  IPC_HANDLERS,
   SESSION_STATUSES,
   STATUSES,
   VIDEO_RESOLUTION,
@@ -1119,9 +1117,7 @@ export default {
         this.changeSessionStatus(SESSION_STATUSES.START);
       }
 
-      const sessionId = await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
-        func: IPC_FUNCTIONS.GET_SESSION_ID,
-      });
+      const sessionId = await this.$storageService.getSessionId();
 
       if (sessionId === "") {
         const data = {
@@ -1137,10 +1133,7 @@ export default {
           path: this.$route.path,
         };
 
-        window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
-          func: IPC_FUNCTIONS.CREATE_NEW_SESSION,
-          data: data,
-        });
+        await this.$storageService.createNewSession(data);
       }
 
       if (this.viewMode === "normal") {
diff --git a/src/services/storage-options/localJsonDbService.js b/src/services/storage-options/localJsonDbService.js
index 4b48b307..c146b54d 100644
--- a/src/services/storage-options/localJsonDbService.js
+++ b/src/services/storage-options/localJsonDbService.js
@@ -94,6 +94,12 @@ export default class LocalJsonDbService extends StorageInterface {
     });
   }
 
+  async getSessionId() {
+    return await window.ipc.invoke(IPC_HANDLERS.DATABASE, {
+      func: IPC_FUNCTIONS.GET_SESSION_ID,
+    });
+  }
+
   async saveSession(data) {
     return await window.ipc.invoke(IPC_HANDLERS.FILE_SYSTEM, {
       func: IPC_FUNCTIONS.SAVE_SESSION,
diff --git a/src/services/storageService.js b/src/services/storageService.js
index c59e05e3..138df02b 100644
--- a/src/services/storageService.js
+++ b/src/services/storageService.js
@@ -64,6 +64,10 @@ export default class StorageService {
     return this.storage.createNewSession(data);
   }
 
+  async getSessionId() {
+    return this.storage.getSessionId();
+  }
+
   async saveSession(data) {
     return await this.storage.saveSession(data);
   }

From 036818fc2ac0a3789c21f0a420306b7fa8def0d2 Mon Sep 17 00:00:00 2001
From: isntlazy <isntlazy@gmail.com>
Date: Tue, 16 Jan 2024 16:19:01 +0200
Subject: [PATCH 41/41] shareOauthDialog replacement with vuetify

---
 src/components/dialogs/ShareOAuthDialog.vue | 122 ++++++++++++++++++++
 src/components/settings/GeneralTab.vue      |  29 +++--
 2 files changed, 144 insertions(+), 7 deletions(-)
 create mode 100644 src/components/dialogs/ShareOAuthDialog.vue

diff --git a/src/components/dialogs/ShareOAuthDialog.vue b/src/components/dialogs/ShareOAuthDialog.vue
new file mode 100644
index 00000000..0dd7dbe7
--- /dev/null
+++ b/src/components/dialogs/ShareOAuthDialog.vue
@@ -0,0 +1,122 @@
+<template>
+  <v-dialog
+    v-bind="$attrs"
+    v-on="$listeners"
+    persistent
+    width="100%"
+    max-width="400px"
+    eager
+  >
+    <v-sheet outlined rounded>
+      <v-container>
+        <v-card>
+          <v-card-title class="body-1">
+            {{ $tc("caption.custom_oauth_connections", 1) }}
+          </v-card-title>
+          <v-divider></v-divider>
+          <v-container class="oauth-credentials-wrapper">
+            <v-row>
+              <v-col cols="12">
+                <div v-if="serverOAuthCredentials.length > 0">
+                  <div
+                    v-for="(credential, i) in serverOAuthCredentials"
+                    :key="i"
+                  >
+                    <v-card>
+                      <div class="caption label-text">
+                        <strong>{{ $tc("caption.instance_url", 1) }}</strong>
+                        : {{ credential.url }}
+                      </div>
+                      <div class="caption label-text">
+                        <strong>{{ $tc("caption.client_id", 1) }}</strong>
+                        : {{ credential.clientId }}
+                      </div>
+                      <div class="caption label-text">
+                        <strong>{{ $tc("caption.client_secret", 1) }}</strong>
+                        : {{ credential.clientSecret }}
+                      </div>
+                    </v-card>
+                  </div>
+                </div>
+                <div v-else>
+                  <v-card>
+                    <div class="caption label-text">
+                      <strong>
+                        {{ $tc("caption.no_server_oauth_creds", 1) }}
+                      </strong>
+                    </div>
+                  </v-card>
+                </div>
+              </v-col>
+            </v-row>
+          </v-container>
+          <v-divider></v-divider>
+          <v-card-actions>
+            <v-row class="action-wrapper">
+              <v-col cols="6 pr-1">
+                <v-btn
+                  class="btn"
+                  small
+                  block
+                  color="white"
+                  @click="handleDone"
+                >
+                  {{ $tc("caption.done", 1) }}
+                </v-btn>
+              </v-col>
+            </v-row>
+          </v-card-actions>
+        </v-card>
+      </v-container>
+    </v-sheet>
+  </v-dialog>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  name: "ShareOAuthDialog",
+  components: {},
+  props: {
+    serverOAuthCredentials: {
+      type: Array,
+    },
+  },
+  computed: {
+    ...mapGetters({
+      credentials: "auth/credentials",
+    }),
+  },
+  methods: {
+    async handleDone() {
+      this.$emit("close");
+    },
+  },
+};
+</script>
+<style scoped>
+.body-1 {
+  font-style: normal !important;
+  font-weight: 500 !important;
+  font-size: 12px !important;
+  line-height: 16px !important;
+  letter-spacing: 0.05em !important;
+  text-transform: uppercase !important;
+  color: #6b7280 !important;
+}
+.subtitle-1 {
+  font-style: normal !important;
+  font-weight: 500 !important;
+  font-size: 14px !important;
+  line-height: 20px !important;
+  color: #111827 !important;
+}
+.caption {
+  font-style: normal !important;
+  font-weight: 500 !important;
+  font-size: 13px !important;
+  line-height: 16px !important;
+  color: #6b7280;
+}
+</style>
diff --git a/src/components/settings/GeneralTab.vue b/src/components/settings/GeneralTab.vue
index 0cd8d99e..90cd3a65 100644
--- a/src/components/settings/GeneralTab.vue
+++ b/src/components/settings/GeneralTab.vue
@@ -34,7 +34,7 @@
         <span class="subtitle-1 ml-2 mt-2 mb-0">
           {{ meta.credentialsPath }}
         </span>
-        <p class="note-caption mt-3 mb-0">
+        <p v-if="serverOAuthCredentials.length" class="note-caption mt-3 mb-0">
           {{ $tc("caption.split_credentials", 1) }}
           <a
             href="#"
@@ -195,14 +195,22 @@
         ></v-select>
       </v-col>
     </v-row>
+    <ShareOAuthDialog
+      v-if="serverOAuthCredentials.length"
+      :server-o-auth-credentials="serverOAuthCredentials"
+      @close="shareOauthDialog = false"
+      v-model="shareOauthDialog"
+    />
   </v-container>
 </template>
 
 <script>
-import { TEXT_TYPES, STATUSES } from "../../modules/constants";
+import { TEXT_TYPES, STATUSES } from "@/modules/constants";
+import ShareOAuthDialog from "@/components/dialogs/ShareOAuthDialog.vue";
+import { mapGetters } from "vuex";
 export default {
   name: "GeneralTab",
-  components: {},
+  components: { ShareOAuthDialog },
   props: {
     metadata: {
       type: Object,
@@ -228,6 +236,15 @@ export default {
     },
   },
   computed: {
+    ...mapGetters({
+      credentials: "auth/credentials",
+    }),
+    serverOAuthCredentials() {
+      let flattened = Object.values(this.credentials).flatMap((c) => c);
+      return flattened.filter(
+        (c) => c.type === "oauth" && c.clientId && c.clientSecret && c.url
+      );
+    },
     showColor() {
       return this.config.defaultColor ? this.config.defaultColor : "#000000";
     },
@@ -254,6 +271,7 @@ export default {
   },
   data() {
     return {
+      shareOauthDialog: false,
       meta: this.metadata,
       config: this.configItem,
       comment: {
@@ -289,10 +307,7 @@ export default {
       }
     },
     async showOAuthDialog() {
-      const credentials = await this.$storageService.getCredentials();
-      if (this.$isElectron) {
-        await this.$electronService.openShareOauthWindow(credentials);
-      }
+      this.shareOauthDialog = true;
     },
   },
 };