Account setting on setting page

This commit is contained in:
Liyas Thomas
2020-01-21 22:27:52 +05:30
parent 1fdde89d49
commit 211dfa24fa
6 changed files with 158 additions and 77 deletions

View File

@@ -42,14 +42,39 @@
<script>
import firebase from "firebase/app";
import { fb } from "../../functions/fb";
export default {
data() {
return {
fb
};
},
methods: {
signInWithGoogle() {
const provider = new firebase.auth.GoogleAuthProvider();
firebase
.auth()
.signInWithPopup(provider)
.then(res => {
if (res.additionalUserInfo.isNewUser) {
this.$toast.info($t("turn_on") + " " + $t("sync"), {
icon: "sync",
duration: null,
closeOnSwipe: false,
action: {
text: this.$t("yes"),
onClick: (e, toastObject) => {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
this.$router.push({ path: "/settings" });
toastObject.remove();
}
}
});
}
})
.catch(err => {
this.$toast.show(err.message || err, {
icon: "error"
@@ -61,6 +86,24 @@ export default {
firebase
.auth()
.signInWithPopup(provider)
.then(res => {
if (res.additionalUserInfo.isNewUser) {
this.$toast.info($t("turn_on") + " " + $t("sync"), {
icon: "sync",
duration: null,
closeOnSwipe: false,
action: {
text: this.$t("yes"),
onClick: (e, toastObject) => {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
this.$router.push({ path: "/settings" });
toastObject.remove();
}
}
});
}
})
.catch(err => {
this.$toast.show(err.message || err, {
icon: "error"

View File

@@ -44,19 +44,19 @@ export const fb = {
.doc(id)
.delete()
.catch(e => console.error("error deleting", dt, e)),
writeSettings: async (settings, value) => {
writeSettings: async (setting, value) => {
const st = {
updatedOn: new Date(),
author: fb.currentUser.uid,
author_name: fb.currentUser.displayName,
author_image: fb.currentUser.photoURL,
settings,
name: setting,
value
};
try {
return settingsCollection.doc(settings).set(st);
return settingsCollection.doc(setting).set(st);
} catch (e) {
return console.error("error updating", dt, e);
return console.error("error updating", st, e);
}
}
};
@@ -79,8 +79,8 @@ feedsCollection
});
settingsCollection
.orderBy("createdOn", "desc")
.limit(2)
// .orderBy("updatedOn", "desc")
// .limit(2)
.onSnapshot(settingsRef => {
const settings = [];
settingsRef.forEach(doc => {

View File

@@ -254,5 +254,8 @@ export default {
logged_out: "Logged out",
logout: "Logout",
account: "Account",
sync: "Sync"
sync: "Sync",
syncHistory: "History",
syncCollections: "Collections",
turn_on: "Turn on"
};

View File

@@ -237,6 +237,11 @@
<div v-else-if="$route.path === '/settings'">
<nav class="secondary-nav">
<ul>
<li>
<a href="#account" v-tooltip.right="$t('account')">
<i class="material-icons">perm_identity</i>
</a>
</li>
<li>
<a href="#theme" v-tooltip.right="$t('theme')">
<i class="material-icons">brush</i>
@@ -294,9 +299,11 @@
<button
class="icon"
v-tooltip="
(fb.currentUser.displayName || '<label><i>Name not found</i></label>') +
(fb.currentUser.displayName ||
'<label><i>Name not found</i></label>') +
'<br>' +
(fb.currentUser.email || '<label><i>Email not found</i></label>')
(fb.currentUser.email ||
'<label><i>Email not found</i></label>')
"
>
<img
@@ -830,7 +837,7 @@ export default {
watch: {
$route() {
this.$toast.clear();
// this.$toast.clear();
}
},

View File

@@ -846,8 +846,8 @@
<collections />
</pw-section>
</div>
<input id="auth-tab" type="radio" name="side" />
<label for="auth-tab">Auth</label>
<input id="sync-tab" type="radio" name="side" />
<label for="sync-tab">{{ $t("sync") }}</label>
<div class="tab" v-if="fb.currentUser">
<pw-section class="pink" label="Auth" ref="auth">
<inputform />
@@ -2150,7 +2150,7 @@ export default {
icon: "help",
duration: 8000,
action: {
text: "Settings",
text: this.$t("yes"),
onClick: (e, toastObject) => {
this.$router.push({ path: "/settings" });
}

View File

@@ -5,7 +5,7 @@
<li>
<div v-if="!fb.currentUser">
<label>{{ $t("login_with") }}</label>
<br />
<p>
<button class="icon" @click="signInWithGoogle" v-close-popover>
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -35,6 +35,7 @@
</svg>
<span>GitHub</span>
</button>
</p>
</div>
<div v-if="fb.currentUser">
<button class="icon">
@@ -61,22 +62,22 @@
<span>{{ $t("logout") }}</span>
</button>
<br />
<br />
<p v-for="setting in fb.currentSettings">
<pw-toggle
:on="sync.history"
@change="toggleSettings('syncHistory')"
:key="setting.name"
:on="setting.value"
@change="toggleSettings(setting.name, setting.value)"
>
{{ $t("sync") + " " + $t("history") }}
{{ sync.history ? $t("enabled") : $t("disabled") }}
</pw-toggle>
<br />
<pw-toggle
:on="sync.collections"
@change="toggleSettings('syncCollections')"
>
{{ $t("sync") + " " + $t("collection") }}
{{ sync.collections ? $t("enabled") : $t("disabled") }}
{{ $t(setting.name) + " " + $t("sync") }}
{{ setting.value ? $t("enabled") : $t("disabled") }}
</pw-toggle>
</p>
<p v-if="fb.currentSettings.length == 0">
<button class="" @click="initSettings">
<i class="material-icons">sync</i>
<span>{{ $t("turn_on") + " " + $t("sync") }}</span>
</button>
</p>
</div>
</li>
</ul>
@@ -226,8 +227,7 @@ export default {
components: {
"pw-section": () => import("../components/section"),
"pw-toggle": () => import("../components/toggle"),
swatch: () => import("../components/settings/swatch"),
login: () => import("../components/firebase/login")
swatch: () => import("../components/settings/swatch")
},
data() {
@@ -326,11 +326,7 @@ export default {
PROXY_KEY: this.$store.state.postwoman.settings.PROXY_KEY || ""
},
fb,
sync: {
history: fb.currentSettings[0].value,
collections: fb.currentSettings[1].value
}
fb
};
},
@@ -400,6 +396,24 @@ export default {
firebase
.auth()
.signInWithPopup(provider)
.then(res => {
if (res.additionalUserInfo.isNewUser) {
this.$toast.info($t("turn_on") + " " + $t("sync"), {
icon: "sync",
duration: null,
closeOnSwipe: false,
action: {
text: this.$t("yes"),
onClick: (e, toastObject) => {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
this.$router.push({ path: "/settings" });
toastObject.remove();
}
}
});
}
})
.catch(err => {
this.$toast.show(err.message || err, {
icon: "error"
@@ -411,25 +425,39 @@ export default {
firebase
.auth()
.signInWithPopup(provider)
.then(res => {
if (res.additionalUserInfo.isNewUser) {
this.$toast.info($t("turn_on") + " " + $t("sync"), {
icon: "sync",
duration: null,
closeOnSwipe: false,
action: {
text: this.$t("yes"),
onClick: (e, toastObject) => {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
this.$router.push({ path: "/settings" });
toastObject.remove();
}
}
});
}
})
.catch(err => {
this.$toast.show(err.message || err, {
icon: "error"
});
});
},
toggleSettings(s) {
switch (s) {
case "syncHistory":
this.sync.history = !this.sync.history;
fb.writeSettings("syncHistory", this.sync.history);
break;
case "syncCollections":
this.sync.collections = !this.sync.collections;
fb.writeSettings("syncCollections", this.sync.collections);
break;
}
toggleSettings(s, v) {
fb.writeSettings(s, !v);
},
initSettings() {
fb.writeSettings("syncHistory", false);
fb.writeSettings("syncCollections", true);
}
},
beforeMount() {
this.settings.THEME_COLOR = this.getActiveColor();
},