Refactor userList behaviour to not use methods in root Vue instance

This commit is contained in:
Tim Miller-Williams 2019-11-07 23:50:51 +00:00 committed by Pavel Djundik
parent dd9efad23c
commit 6a15fd95f0
4 changed files with 13 additions and 10 deletions

View File

@ -47,7 +47,7 @@
<button <button
class="rt" class="rt"
aria-label="Toggle user list" aria-label="Toggle user list"
@click="$root.toggleUserlist" @click="$store.commit('toggleUserlist')"
/> />
</span> </span>
</div> </div>

View File

@ -38,7 +38,7 @@ socket.on("init", function(data) {
isUserlistOpen = "true"; isUserlistOpen = "true";
} }
vueApp.setUserlist(isUserlistOpen === "true"); store.commit("userlistOpen", isUserlistOpen === "true");
document.body.classList.remove("signed-out"); document.body.classList.remove("signed-out");

View File

@ -96,6 +96,9 @@ const store = new Vuex.Store({
toggleSidebar(state) { toggleSidebar(state) {
state.sidebarOpen = !state.sidebarOpen; state.sidebarOpen = !state.sidebarOpen;
}, },
toggleUserlist(state) {
state.userlistOpen = !state.userlistOpen;
},
userlistOpen(state, payload) { userlistOpen(state, payload) {
state.userlistOpen = payload; state.userlistOpen = payload;
}, },

View File

@ -36,14 +36,6 @@ const vueApp = new Vue({
}, 1); }, 1);
}, },
methods: { methods: {
setUserlist(state) {
storage.set("thelounge.state.userlist", state);
this.$store.commit("userlistOpen", state);
this.$emit("resize");
},
toggleUserlist() {
this.setUserlist(!this.$store.state.userlistOpen);
},
switchToChannel(channel) { switchToChannel(channel) {
if ( if (
this.$store.state.activeChannel && this.$store.state.activeChannel &&
@ -136,6 +128,14 @@ store.watch(
} }
); );
store.watch(
(state) => state.userlistOpen,
(userlistOpen) => {
storage.set("thelounge.state.userlist", userlistOpen);
vueApp.$emit("resize");
}
);
Vue.config.errorHandler = function(e) { Vue.config.errorHandler = function(e) {
store.commit("currentUserVisibleError", `Vue error: ${e.message}`); store.commit("currentUserVisibleError", `Vue error: ${e.message}`);
console.error(e); // eslint-disable-line console.error(e); // eslint-disable-line