butter/keanu-weblite
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Improved logout/login and change password support

Browse source
This commit is contained in:
N-Pex 2021-03-29 21:55:43 +02:00
parent 31535f0f3c
commit 1f4970368a
7 changed files with 109 additions and 99 deletions
Download patch file Download diff file Expand all files Collapse all files

46
src/App.vue
View file

@ -9,17 +9,17 @@
<script>
export default {
name: "App",
methods: {
loggedIn() {
return this.$store.state.auth.status.loggedIn;
},
logOut() {
this.openDrawer = false;
this.$store.dispatch("auth/logout");
this.$nextTick(() => {
this.$navigation.push({path: "/login"}, -1);
})
},
mounted() {
if (this.currentUser) {
this.$matrix
.login(this.currentUser)
.then(() => {
console.log("Matrix client ready");
})
.catch((error) => {
console.log("Error creating client", error);
});
}
},
computed: {
currentUser() {
@ -35,33 +35,21 @@ export default {
}
if (this.$route.meta.includeRoom) {
if (this.$matrix.currentRoom) {
title += " - " + (this.$matrix.currentRoom.summary.info.title || this.$matrix.currentRoom.roomId);
title +=
" - " +
(this.$matrix.currentRoom.summary.info.title ||
this.$matrix.currentRoom.roomId);
} else if (this.$matrix.currentRoomId) {
title += " - " + (this.$matrix.currentRoomId);
title += " - " + this.$matrix.currentRoomId;
}
}
return title;
}
},
},
watch: {
title(title) {
document.title = title;
},
currentUser: {
immediate: true,
handler(ignorednewVal, ignoredoldVal) {
if (this.currentUser) {
this.$matrix
.login(this.currentUser)
.then(() => {
console.log("Matrix client ready");
})
.catch((error) => {
console.log("Error creating client", error);
});
}
},
},
},
};
</script>

2
src/assets/css/chat.scss
View file

@ -608,7 +608,9 @@ $admin-fg: white;
.action {
padding: 4px 20px;
cursor: pointer;
&::after {
/* divider */
content: ' ';
display: block;
margin: 10px 0px;

2
src/components/Home.vue
View file

@ -1,7 +1,7 @@
<template>
<div>
<RoomList />
<v-btn block class="outlined-button" @click.stop="logout">Logout</v-btn>
<v-btn block depressed class="outlined-button" @click.stop="logout">Logout</v-btn>
</div>
</template>

7
src/components/Join.vue
View file

@ -283,7 +283,10 @@ export default {
* a random account.
*/
getLoginPromise() {
return this.$store.dispatch("auth/login", this.currentUser || this.guestUser);
if (this.$matrix.ready) {
return Promise.resolve(this.$matrix.currentUser);
}
return this.$store.dispatch("auth/login", this.currentUser || this.guestUser);
},
getRoomInfo() {
@ -326,7 +329,7 @@ export default {
},
handleLogin() {
this.$navigation.push({ name: "Login" }, 1);
this.$navigation.push({path: "/login"}, 1);
},
handleOpenApp() {

60
src/components/Profile.vue
View file

@ -31,7 +31,7 @@
<div v-if="$matrix.currentUser.is_guest">
This identity is temporary. Set a password to use it again.
</div>
<v-btn block class="outlined-button" @click.stop="logout">Logout</v-btn>
<v-btn depressed block class="outlined-button" @click.stop="logout">Logout</v-btn>
</v-col>
</v-row>
</v-container>
@ -41,21 +41,24 @@
<!-- edit password dialog -->
<v-dialog v-model="showEditPasswordDialog" class="ma-0 pa-0" width="50%">
<v-card>
<v-card :disabled="settingPassword">
<v-card-title>Change password</v-card-title>
<v-card-text>
Not yet implemented.
<!-- <v-text-field v-model="password" /> -->
<v-text-field v-if="!$matrix.currentUser.is_guest" v-model="password" label="Old password" type="password" />
<v-text-field v-model="newPassword1" label="New password" type="password" />
<v-text-field v-model="newPassword2" label="Repeat new password" type="password" />
<div class="red--text" v-if="passwordErrorMessage">{{ passwordErrorMessage }}</div>
</v-card-text>
<v-divider></v-divider>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn text @click="showEditPasswordDialog = false">Cancel</v-btn>
<v-btn text @click="closeEditPasswordDialog">Cancel</v-btn>
<v-btn
:disabled="!passwordsMatch"
color="primary"
text
@click="
showEditPasswordDialog = false;
setPassword($matrix.currentUser.is_guest ? $matrix.currentUser.password : password, newPassword1);
"
>Ok</v-btn
>
@ -97,6 +100,11 @@ export default {
showEditPasswordDialog: false,
showEditDisplaynameDialog: false,
editValue: null,
password: null,
newPassword1: null,
newPassword2: null,
settingPassword: false,
passwordErrorMessage: null
};
},
@ -127,6 +135,10 @@ export default {
return null;
}
return (this.user.displayName || this.user.userId.substring(1)).substring(0, 1).toUpperCase();
},
passwordsMatch() {
return this.newPassword1 && this.newPassword2 && this.newPassword1 == this.newPassword2;
}
},
@ -143,21 +155,29 @@ export default {
this.$matrix.matrixClient.setDisplayName(name);
},
upgradeAccount() {
this.$matrix
.upgradeGuestAccount()
.then(user => {
// Done, login with the "new" account to get a real token instead of our guest token.
this.user = user;
return this.$store.dispatch("auth/login", this.user);
})
.then(() => {
console.log("Upgrade done!");
})
.catch((err) => {
console.log("ERROR", err);
});
setPassword(oldPassword, newPassword) {
this.settingPassword = true;
this.passwordErrorMessage = null;
this.$matrix.setPassword(oldPassword, newPassword)
.then(success => {
console.log(success ? "Password changed" : "Failed to change password");
this.closeEditPasswordDialog();
})
.catch(error => {
this.passwordErrorMessage = error.message;
})
.finally(() => {
this.settingPassword = false;
});
},
closeEditPasswordDialog() {
this.passwordErrorMessage = null;
this.password = null;
this.newPassword1 = null;
this.newPassword2 = null;
this.showEditPasswordDialog = false;
}
},
};
</script>

16
src/components/RoomInfo.vue
View file

@ -306,22 +306,6 @@ export default {
this.$navigation.push({ name: "Profile" }, 1);
},
upgradeAccount() {
this.$matrix
.upgradeGuestAccount()
.then((user) => {
// Done, login with the "new" account to get a real token instead of our guest token.
this.user = user;
return this.$store.dispatch("auth/login", this.user);
})
.then(() => {
console.log("Upgrade done!");
})
.catch((err) => {
console.log("ERROR", err);
});
},
copyRoomLink() {
this.$copyText(this.roomLink).then(
function (e) {

75
src/services/matrix.service.js
View file

@ -77,7 +77,10 @@ export default {
const tempMatrixClient = sdk.createClient(User.homeServerUrl(user.home_server));
var promiseLogin;
if (user.is_guest && !user.access_token) {
if (user.access_token) {
// Logged in on "real" account
promiseLogin = Promise.resolve(user);
} else if (user.is_guest && !user.user_id) {
// Generate random username and password. We don't user REAL matrix
// guest accounts because 1. They are not allowed to post media, 2. They
// can not use avatars and 3. They can not seamlessly be upgraded to real accounts.
@ -96,9 +99,6 @@ export default {
localStorage.setItem('user', JSON.stringify(response));
return response;
})
} else if (!user.is_guest && user.access_token) {
// Logged in on "real" account
promiseLogin = Promise.resolve(user);
} else {
var data = { user: User.localPart(user.user_id), password: user.password, type: "m.login.password" };
if (user.device_id) {
@ -155,29 +155,6 @@ export default {
this.$store.commit("setCurrentRoomId", null);
},
/**
* Upgrade a guest account into a "normal" account. For now, use random user and pass...
*/
upgradeGuestAccount() {
if (!this.matrixClient || !this.currentUser || !this.currentUser.is_guest) {
return Promise.reject("Invalid params");
}
const randomPassword = util.randomPass();
const self = this;
return this.matrixClient.register(this.matrixClient.getUserIdLocalpart(), randomPassword, null, {
type: "m.login.dummy",
}, undefined, this.currentUser.access_token)
.then((response) => {
console.log("Response", response);
response.is_guest = false;
response.password = randomPassword;
self.currentUser = response;
localStorage.setItem('user', JSON.stringify(response)); // Update local storage as well.
self.logout();
return self.currentUser;
});
},
initClient() {
this.reloadRooms();
this.matrixClientReady = true;
@ -322,15 +299,23 @@ export default {
this.matrixClient = null;
this.matrixClientReady = false;
}
this.$store.commit("setCurrentRoomId", null);
// For "real" accounts we totally wipe the user object, but for "guest"
// accounts (i.e. created from random data and with password never changed)
// we need to hang on to the generated password and use that to login to a new
// session, so only wipe the token in s that case.
// Clear the access token
var user = JSON.parse(localStorage.getItem('user'));
if (user) {
if (user.is_guest) {
delete user.access_token;
localStorage.setItem('user', JSON.stringify(user));
// Login again
this.login(user);
} else {
localStorage.removeItem('user');
this.$store.commit("setCurrentRoomId", null);
this.$navigation.push({path: "/login"}, -1);
}
localStorage.setItem('user', JSON.stringify(user));
this.$navigation.push({ name: "Login" }, -1);
},
reloadRooms() {
@ -398,6 +383,34 @@ export default {
}
},
setPassword(oldPassword, newPassword) {
if (this.matrixClient && this.currentUser) {
const authDict = {
type: 'm.login.password',
identifier: {
type: 'm.id.user',
user: this.currentUser.user_id,
},
// TODO: Remove `user` once servers support proper UIA
// See https://github.com/matrix-org/synapse/issues/5665
user: this.currentUser.user_id,
password: oldPassword,
};
const self = this;
return this.matrixClient.setPassword(authDict, newPassword)
.then(() => {
// Forget password and remove the 'is_guest' flag, we are now a "real" user!
self.currentUser.password = undefined;
self.currentUser.is_guest = false;
localStorage.setItem('user', JSON.stringify(self.currentUser));
})
.then(() => {
return true;
})
}
return Promise.resolve(false);
},
uploadFile(file, opts) {
return this.matrixClient.uploadContent(file, opts);
},