wip

evandor · Feb 14, 2024 · f2d9f25 · f2d9f25
1 parent fca2851
commit f2d9f25
Show file tree

Hide file tree

Showing 14 changed files with 158 additions and 102 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -50,7 +50,12 @@ onAuthStateChanged(auth, async (user) => {
     })
     // --- end of statement
 
-    await AppService.init($q, router, true, user, account)
+    try {
+      await AppService.init($q, router, true, user, account)
+    } catch (err) {
+      console.log("%ccould not initialize appService due to " + err, "background-color:orangered")
+      return Promise.resolve()
+    }
 
   } else {
     // User is signed out

diff --git a/src/components/SidePanelFooter.vue b/src/components/SidePanelFooter.vue
@@ -1,9 +1,12 @@
 <template>
 
   <q-footer
-    class="q-pa-xs q-mt-sm darkInDarkMode brightInBrightMode" style="border-top: 1px solid lightgrey" :style="offsetBottom()">
+    class="q-pa-xs q-mt-sm darkInDarkMode brightInBrightMode" style="border-top: 1px solid lightgrey"
+    :style="offsetBottom()">
     <div class="row fit q-mb-sm" v-if="showLogin">
-      <SidePanelLoginWidget @hide-login="showLogin = false"/>
+      <keep-alive>
+        <SidePanelLoginWidget @hide-login="showLogin = false"/>
+      </keep-alive>
     </div>
 
     <div class="row fit q-mb-sm" v-if="showWindowTable">
@@ -35,7 +38,7 @@
         <template v-if="!checkToasts() && useUiStore().progress">
           <q-linear-progress size="25px" :value="progressValue">
             <div class="absolute-full flex flex-center">
-              <q-badge :label="progressLabel" />
+              <q-badge :label="progressLabel"/>
             </div>
           </q-linear-progress>
         </template>
@@ -269,7 +272,7 @@ watchEffect(() => {
   if (uiProgrss) {
     progressValue.value = uiProgrss['val' as keyof object] || 0.0
     progressLabel.value = uiProgrss['label' as keyof object] || 'no msg'
-    console.log("we are here", progressValue.value)
+    //console.log("we are here", progressValue.value)
   }
 })
 

diff --git a/src/components/helper/SidePanelLoginWidget.vue b/src/components/helper/SidePanelLoginWidget.vue
@@ -1,43 +1,45 @@
 <template>
   <div class="col-12 text-right">
     <template v-if="!mailSent">
-      <div class="row q-ma-xs">
-        <div class="col-7">
-          <q-input outlined type="email" v-model="email" label="Your email address" dense/>
+      <form>
+        <div class="row q-ma-xs">
+          <div class="col-7">
+            <q-input id="username" outlined type="email" v-model="email" label="Your email address" dense/>
+          </div>
+          <div class="col-5">
+            <!--          <q-btn :label="(!email || email.length === 0) ? 'Sign in' : (password.length > 0 ? 'Sign in':'Send Link')"-->
+            <q-btn label="Sign in"
+                   style="width:110px"
+                   :loading="password.length === 0 && loading"
+                   :disable="mailSent"
+                   @click="signin(false)"/>
+          </div>
         </div>
-        <div class="col-5">
-<!--          <q-btn :label="(!email || email.length === 0) ? 'Sign in' : (password.length > 0 ? 'Sign in':'Send Link')"-->
-          <q-btn label="Sign in"
-                 style="width:110px"
-                 :loading="password.length === 0 && loading"
-                 :disable="mailSent"
-                 @click="signin(false)"/>
+        <div class="row q-ma-xs">
+          <div class="col-7">
+            <q-input id="password" outlined type="password" v-model="password" label="Password" dense/>
+          </div>
+          <div class="col-5">
+            <q-btn label="Sign Up"
+                   style="width:110px"
+                   :loading="password.length > 0 && loading"
+                   :disable="mailSent || password.length === 0"
+                   @click="signin(true)"/>
+          </div>
         </div>
-      </div>
-      <div class="row q-ma-xs">
-        <div class="col-7">
-          <q-input outlined type="password" v-model="password" label="Password" dense/>
-        </div>
-        <div class="col-5">
-          <q-btn label="Sign Up"
-                 style="width:110px"
-                 :loading="password.length > 0 && loading"
-                 :disable="mailSent || password.length === 0"
-                 @click="signin(true)"/>
-        </div>
-      </div>
-      <div class="row q-ma-xs q-ml-none">
-        <div class="col-7 q-ml-xs text-body2 text-grey-7 text-left" style="font-size:smaller">
+        <div class="row q-ma-xs q-ml-none">
+          <div class="col-7 q-ml-xs text-body2 text-grey-7 text-left" style="font-size:smaller">
           <span
             v-if="(!email || email.trim().length === 0) && password.length === 0">Or keep using tabsets w/o account</span>
-          <span v-else-if="password.length === 0">We'll send a link to sign in/up</span>
-          <span v-else></span>
-        </div>
-        <div class="col" style="font-size:smaller">
+            <span v-else-if="password.length === 0">We'll send a link to sign in/up</span>
+            <span v-else></span>
+          </div>
+          <div class="col" style="font-size:smaller">
           <span class="q-mr-md cursor-pointer text-blue-5"
                 @click="NavigationService.openSingleTab('https://tabsets.web.app/#/pricing')">What's that?</span>
+          </div>
         </div>
-      </div>
+      </form>
     </template>
     <Transition name="bounceInLeft" appear v-else>
       <div class="text-caption text-left">
@@ -108,6 +110,7 @@ const signin = async (newUser: boolean) => {
     }
   } else {
 
+    // KEEP for now; this is for login with email link
     // console.log("actionCodeSettings", actionCodeSettings)
     // sendSignInLinkToEmail(auth, email.value, actionCodeSettings)
     //   .then(() => {

diff --git a/src/pages/SidePanelPage.vue b/src/pages/SidePanelPage.vue
@@ -601,11 +601,11 @@ if ($q.platform.is.chrome) {
     // seems we need to define these listeners here to get the matching messages reliably
     // these messages are created by triggering events in the mainpanel
     chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
+      console.log(" <<< received message", message)
       if (inIgnoredMessages(message)) {
         return true
       }
       if (message.name === 'current-tabset-id-change') {
-        console.log(" >>> got message", message)
         if (message.ignore) {
           return true
         }
@@ -701,7 +701,6 @@ if ($q.platform.is.chrome) {
         console.log("got message 'mqtt-url-changed'", message)
         MqttService.reset().then(() => MqttService.init(message.data.mqttUrl))
       } else if (message.name === 'reload-application') {
-        console.log("got message 'reload-application'")
         AppService.restart("restarted=true")
       } else {
         console.log("got unmatched message", message)

diff --git a/src/pages/helper/AccountSettings.vue b/src/pages/helper/AccountSettings.vue
@@ -22,24 +22,24 @@
 
     </div>
 
-    <hr>
+<!--    <hr>-->
 
-    <q-banner rounded style="border:1px solid orange">
-      Danger Zone
-    </q-banner>
-
-    <div class="row items-baseline q-ma-md q-gutter-lg">
+<!--    <q-banner rounded style="border:1px solid red">-->
+<!--      Danger Zone-->
+<!--    </q-banner>-->
 
-      <template >
-        <div class="col-12 text-bold">
-          Delete local Data
-        </div>
+<!--    <div class="row items-baseline q-ma-md q-mt-xl q-gutter-lg">-->
 
-        <InfoLine label="Tabsets">test</InfoLine>
+<!--        <div class="col-12 text-bold">-->
+<!--          Delete local Data-->
+<!--        </div>-->
 
-      </template>
+<!--        <InfoLine label="Indexed DB"><q-checkbox v-model="deleteIndexedDb" /></InfoLine>-->
+<!--        <InfoLine label="Synced Data"><q-checkbox v-model="deleteFS" /></InfoLine>-->
+<!--        <InfoLine label="Local Storage"><q-checkbox v-model="deleteLS" /></InfoLine>-->
 
-    </div>
+<!--        <InfoLine label=""><q-btn label="delete" :disable="!deleteIndexedDb && !deleteFS && !deleteLS" @click="deleteData()" /></InfoLine>-->
+<!--    </div>-->
   </div>
 
 </template>
@@ -49,16 +49,28 @@
 import {Account} from "src/models/Account";
 import {onMounted, ref} from "vue";
 import {useAuthStore} from "stores/authStore";
-import {date, LocalStorage} from "quasar";
+import {date, LocalStorage, useQuasar} from "quasar";
 import {CURRENT_USER_EMAIL} from "boot/constants";
 import {getAuth, User} from "firebase/auth";
 import InfoLine from "pages/helper/InfoLine.vue";
+import IndexedDbPersistenceService from "src/services/IndexedDbPersistenceService";
+import {useSuggestionsStore} from "stores/suggestionsStore";
+import {StaticSuggestionIdent, Suggestion} from "src/models/Suggestion";
+import {useUtils} from "src/services/Utils";
+
+const {sendMsg} = useUtils()
+
+const localStorage = useQuasar().localStorage
 
 const account = ref<Account | undefined>(undefined)
 const email = ref<string | undefined>(undefined)
 const products = ref<Set<string>>(new Set())
 const user = ref<User | null>(null)
 
+const deleteIndexedDb = ref(false)
+const deleteFS = ref(false)
+const deleteLS = ref(false)
+
 onMounted(() => {
   account.value = useAuthStore().getAccount()
   email.value = LocalStorage.getItem(CURRENT_USER_EMAIL) as string
@@ -85,4 +97,26 @@ onMounted(() => {
   }
 })
 
+const deleteData = async () => {
+  if (deleteIndexedDb.value) {
+    console.log("deleting deleteIndexedDb")
+    await IndexedDbPersistenceService.deleteDatabase("db")
+    console.log("deleting deleteIndexedDb done")
+    //await IndexedDbPersistenceService.init("db")
+  }
+  if (deleteFS.value) {
+    console.log("deleting IndexedDB Filesystem")
+    await IndexedDbPersistenceService.deleteDatabase("fs")
+    console.log("deleting IndexedDB Filesystem done")
+  }
+  if (deleteLS.value) {
+    console.log("deleting LocalStorage")
+    localStorage.clear()
+    console.log("deleting LocalStorage done")
+    await useSuggestionsStore().addSuggestion(Suggestion.getStaticSuggestion(StaticSuggestionIdent.RESTART_SUGGESTED))
+  }
+  sendMsg('reload-application')
+
+}
+
 </script>
diff --git a/src/services/AppService.ts b/src/services/AppService.ts
@@ -84,7 +84,7 @@ class AppService {
     await IndexedDbPersistenceService.init("db")
 
     // init services
-    useAuthStore().initialize(useDB(undefined).db)
+    await useAuthStore().initialize(useDB(undefined).db)
     await useAuthStore().setUser(user)
     useAuthStore().upsertAccount(account)
 
@@ -95,6 +95,7 @@ class AppService {
     tabsetService.setLocalStorage(localStorage)
 
     if (useAuthStore().isAuthenticated()) {
+      console.log("useAuthStore().getAccount()", useAuthStore().getAccount())
       // sync features
       const syncType = useAuthStore().getAccount()?.userData?.sync?.type || SyncType.NONE
       const syncUrl = useAuthStore().getAccount()?.userData?.sync?.url
@@ -109,7 +110,7 @@ class AppService {
         failedGitLogin = true
       }
 
-      console.debug("%cchecking sync config:", "font-weight:bold", syncType, syncUrl, dbOrGitDb)
+      console.debug(`%cchecking sync config: type=${syncType}, url=${syncUrl}, dbOrGitDb=${dbOrGitDb}`, "font-weight:bold")
 
       if (syncUrl) {
         uiStore.appLoading = "syncing tabsets..."
@@ -122,21 +123,21 @@ class AppService {
       await this.initCoreSerivces(quasar, useDB(undefined).db, this.router)
     }
 
-
     useNotificationsStore().bookmarksExpanded = quasar.localStorage.getItem("bookmarks.expanded") || []
 
   }
 
 
   restart(ar: string) {
-    console.log("%c>>> restarting tabsets", "font-weight:bold", window.location.href, ar)
+    console.log("%crestarting tabsets", "font-weight:bold", window.location.href, ar)
     const baseLocation = window.location.href.split("?")[0]
-    console.log("%c>>> baseLocation", "font-weight:bold", baseLocation)
+    console.log("%cbaseLocation", "font-weight:bold", baseLocation)
+    console.log("%cwindow.location.href", "font-weight:bold", window.location.href)
     if (window.location.href.indexOf("?") < 0) {
       const tsIframe = window.parent.frames[0]
       //log("iframe", tsIframe)
       if (tsIframe) {
-        console.debug("%c>>> new window.location.href", "font-weight:bold", baseLocation + "?" + ar)
+        console.debug("%cnew window.location.href", "font-weight:bold", baseLocation + "?" + ar)
         tsIframe.location.href = baseLocation + "?" + ar
         //tsIframe.location.href = "https://www.skysail.io"
         tsIframe.location.reload()

diff --git a/src/services/ChromeListeners.ts b/src/services/ChromeListeners.ts
@@ -527,7 +527,7 @@ class ChromeListeners {
     if (inIgnoredMessages(request)) {
       return true
     }
-    //console.log("%conMessage","color:red", request)
+    console.debug(" <<< got message", request)
     if (request.msg === 'captureThumbnail') {
       const screenShotWindow = useWindowsStore().screenshotWindow
       this.handleCapture(sender, screenShotWindow, sendResponse)

diff --git a/src/services/ErrorHandler.ts b/src/services/ErrorHandler.ts
@@ -12,15 +12,9 @@ export enum NotificationType {
 export function useNotificationHandler() {
 
     const handleError = (error: any, type: NotificationType = NotificationType.TOAST) => {
-        console.log("got error: ", error ? error.toString() : 'unknown error')
+        console.log("showing error message: ", error ? error.toString() : 'unknown error')
         console.trace()
 
-      // Logz.error({
-      //   message: "handling error in NotificationHandler",
-      //   error: error ? error.toString() : 'unknown error',
-      //   stack: error.stack
-      // }).catch((logzError: any) => console.warn("could not send error message to logz"))
-
       logtail.error(error ? error.toString() : 'unknown error', error)
 
       switch (type) {

diff --git a/src/services/IndexedDbPersistenceService.ts b/src/services/IndexedDbPersistenceService.ts
@@ -1,4 +1,4 @@
-import {IDBPDatabase, openDB} from "idb";
+import {IDBPDatabase, openDB, deleteDB} from "idb";
 import {useTabsStore} from "src/stores/tabsStore";
 import _ from "lodash";
 import {EXPIRE_DATA_PERIOD_IN_MINUTES, INDEX_DB_VERSION} from "boot/constants";
@@ -38,6 +38,19 @@ class IndexedDbPersistenceService implements PersistenceService {
     useUiStore().dbReady = true
   }
 
+  async deleteDatabase(dbName: string) {
+    useUiStore().dbReady = false
+    console.warn(" ...deleting indexeddb database", dbName)
+    if (this.db) {
+      await this.db.close()
+    }
+    console.log("db closed, deleting now")
+    deleteDB(dbName, (cb) => {
+      console.log("deleting cb", cb)
+    })
+
+  }
+
   async loadTabsets(): Promise<any> {
     console.log(" loading tabsets indexeddb")
     const tabsStore = useTabsStore()

diff --git a/src/services/Utils.ts b/src/services/Utils.ts
@@ -49,7 +49,7 @@ export function useUtils() {
 
   const sendMsg = (msgName: string, data: object = {}) => {
     if (inBexMode() && chrome) {
-      console.log("sending message", {name: msgName, data})
+      console.debug(" >>> sending message", {name: msgName, data})
       chrome.runtime.sendMessage({
         name: msgName, data: data
       }, (callback: any) => {