Final gist integration + clean up

components/collections/import-export-collections.vue

@@ -18,16 +18,21 @@
                     </button>
                   </div>
                   <div
-                    v-tooltip="{
-                      content:
-                        this.$store.state.postwoman.providerInfo.providerId !== 'github.com'
-                          ? $t('login_with_github_to') + $t('create_secret_gist')
-                          : null,
+                    v-tooltip.bottom="{
+                      content: !fb.currentUser
+                        ? $t('login_with_github_to') + $t('create_secret_gist')
+                        : fb.currentUser.provider !== 'github.com'
+                        ? $t('login_with_github_to') + $t('create_secret_gist')
+                        : null,
                     }"
                   >
                     <button
                       :disabled="
-                        this.$store.state.postwoman.providerInfo.providerId !== 'github.com'
+                        !fb.currentUser
+                          ? true
+                          : fb.currentUser.provider !== 'github.com'
+                          ? true
+                          : false
                       "
                       class="icon"
                       @click="createCollectionGist"
@@ -139,7 +144,7 @@ export default {
           },
           {
             headers: {
-              Authorization: `token ${this.$store.state.postwoman.providerInfo.accessToken}`,
+              Authorization: `token ${fb.currentUser.accessToken}`,
               Accept: "application/vnd.github.v3+json",
             },
           }

components/environments/import-export-environment.vue

@@ -18,16 +18,21 @@
                     </button>
                   </div>
                   <div
-                    v-tooltip="{
-                      content:
-                        this.$store.state.postwoman.providerInfo.providerId !== 'github.com'
-                          ? $t('login_with_github_to') + $t('create_secret_gist')
-                          : null,
+                    v-tooltip.bottom="{
+                      content: !fb.currentUser
+                        ? $t('login_with_github_to') + $t('create_secret_gist')
+                        : fb.currentUser.provider !== 'github.com'
+                        ? $t('login_with_github_to') + $t('create_secret_gist')
+                        : null,
                     }"
                   >
                     <button
                       :disabled="
-                        this.$store.state.postwoman.providerInfo.providerId !== 'github.com'
+                        !fb.currentUser
+                          ? true
+                          : fb.currentUser.provider !== 'github.com'
+                          ? true
+                          : false
                       "
                       class="icon"
                       @click="createEnvironmentGist"
@@ -139,7 +144,7 @@ export default {
           },
           {
             headers: {
-              Authorization: `token ${this.$store.state.postwoman.providerInfo.accessToken}`,
+              Authorization: `token ${fb.currentUser.accessToken}`,
               Accept: "application/vnd.github.v3+json",
             },
           }

components/firebase/login.vue

@@ -62,6 +62,7 @@ export default {
 
         this.showLoginSuccess()
       } catch (err) {
+        console.log(err)
         // An error happened.
         if (err.code === "auth/account-exists-with-different-credential") {
           // Step 2.
@@ -80,22 +81,23 @@ export default {
             // Asks the user their password.
             // In real scenario, you should handle this asynchronously.
             const password = promptUserForPassword() // TODO: implement promptUserForPassword.
-            const user = await fb.signInWithEmailAndPassword(email, password)
 
+            const user = await fb.signInWithEmailAndPassword(email, password)
             await user.linkWithCredential(pendingCred)
+
             this.showLoginSuccess()
 
             return
           }
 
-          this.$toast.info(`${this.$t("login_with")}`, {
+          this.$toast.info(`${this.$t("account_exists")}`, {
             icon: "vpn_key",
             duration: null,
             closeOnSwipe: false,
             action: {
               text: this.$t("yes"),
               onClick: async (e, toastObject) => {
-                const user = await fb.signInWithGithub()
+                const { user } = await fb.signInWithGithub()
                 await user.linkAndRetrieveDataWithCredential(pendingCred)
 
                 this.showLoginSuccess()
@@ -111,10 +113,7 @@ export default {
       try {
         const { credential, additionalUserInfo } = await fb.signInUserWithGithub()
 
-        this.$store.commit("postwoman/setProviderInfo", {
-          providerId: "github.com",
-          accessToken: credential.accessToken,
-        })
+        fb.setProviderInfo(credential.providerId, credential.accessToken)
 
         if (additionalUserInfo.isNewUser) {
           this.$toast.info(`${this.$t("turn_on")} ${this.$t("sync")}`, {
@@ -136,6 +135,7 @@ export default {
 
         this.showLoginSuccess()
       } catch (err) {
+        console.log(err)
         // An error happened.
         if (err.code === "auth/account-exists-with-different-credential") {
           // Step 2.
@@ -163,7 +163,7 @@ export default {
             return
           }
 
-          this.$toast.info(`${this.$t("login_with")}`, {
+          this.$toast.info(`${this.$t("account_exists")}`, {
             icon: "vpn_key",
             duration: null,
             closeOnSwipe: false,

helpers/fb.js

@@ -36,6 +36,7 @@ export class FirebaseInstance {
     this.app.auth().onAuthStateChanged((user) => {
       if (user) {
         this.currentUser = user
+
         this.currentUser.providerData.forEach((profile) => {
           let us = {
             updatedOn: new Date(),
@@ -47,10 +48,15 @@ export class FirebaseInstance {
           }
           this.usersCollection
             .doc(this.currentUser.uid)
-            .set(us)
+            .set(us, { merge: true })
             .catch((e) => console.error("error updating", us, e))
         })
 
+        this.usersCollection.doc(this.currentUser.uid).onSnapshot((doc) => {
+          this.currentUser.provider = doc.data().provider
+          this.currentUser.accessToken = doc.data().accessToken
+        })
+
         this.usersCollection
           .doc(this.currentUser.uid)
           .collection("feeds")
@@ -288,6 +294,24 @@ export class FirebaseInstance {
       throw e
     }
   }
+
+  async setProviderInfo(id, token) {
+    const us = {
+      updatedOn: new Date(),
+      provider: id,
+      accessToken: token,
+    }
+    try {
+      await this.usersCollection
+        .doc(this.currentUser.uid)
+        .update(us)
+        .catch((e) => console.error("error updating", us, e))
+    } catch (e) {
+      console.error("error updating", ev, e)
+
+      throw e
+    }
+  }
 }
 
 export const fb = new FirebaseInstance(firebase.initializeApp(firebaseConfig), authProviders)

lang/en-US.json

@@ -299,5 +299,6 @@
   "create_secret_gist": "Create secret Gist",
   "gist_created": "Gist created",
   "import_from_gist": "Import from Gist",
-  "enter_gist_url": "Enter Gist URL"
+  "enter_gist_url": "Enter Gist URL",
+  "account_exists": "Account exists with different credential - Login to link both accounts"
 }

store/postwoman.js

@@ -64,7 +64,6 @@ export const state = () => ({
   editingEnvironment: {},
   selectedRequest: {},
   editingRequest: {},
-  providerInfo: {},
 })
 
 export const mutations = {
@@ -336,10 +335,6 @@ export const mutations = {
       }
     }
   },
-
-  setProviderInfo(state, value) {
-    state.providerInfo = value
-  },
 }
 
 function testValue(myValue) {