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

Add confirmation for ban/make admin etc

Browse source 
Also, fix Firefox problem with dialog jumping around.
This commit is contained in:
N-Pex 2025-06-10 16:23:35 +02:00
parent 724ad4caaa
commit a28ef2e6d8
13 changed files with 108 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/assets/translations/en.json
View file

@ -383,7 +383,11 @@
"message_history_warning": "warning: Full message history will be visible to new participants",
"report": "Report",
"report_info": "Report this room to service administrators for illegal, abusive or otherwise harmful content",
"report_reason": "Reason"
"report_reason": "Reason",
"confirm_make_admin": "Do you want to make this user an administrator?",
"confirm_make_moderator": "Do you want to make this user a moderator?",
"confirm_revoke_moderator": "Do you want to remove moderator rights from this user?",
"confirm_ban": "Do you want to kick this user from the room?"
},
"room_info_sheet": {
"this_room": "This room",

37
src/components/ConfirmationDialog.vue Normal file
View file

@ -0,0 +1,37 @@
<template>
<v-dialog
v-bind="{ ...$props }"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
@click:outside="$emit('update:modelValue', false)"
>
<v-card>
<v-card-text class="pa-4 black--text">{{ message }}</v-card-text>
<v-card-actions class="pt-3">
<v-spacer></v-spacer>
<v-btn variant="flat" class="text-button" @click.stop="$emit('update:modelValue', false)">{{ $t("menu.cancel") }}</v-btn>
<v-btn variant="flat" class="text-button" @click.stop="onOkButton">{{ $t("menu.ok") }}</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
<script>
export default {
name: "ConfirmationDialog",
props: ["modelValue"],
emits: ["update:modelValue", "ok"],
props: {
message: {
type: String,
default: "?",
},
},
methods: {
onOkButton() {
this.$emit("ok");
this.$emit("update:modelValue", false);
},
},
};
</script>

1
src/components/LeaveRoomDialog.vue
View file

@ -3,6 +3,7 @@
v-model="showDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
>
<div class="dialog-content text-center">
<template v-if="roomJoinRule == 'public'">

1
src/components/LogoutRoomDialog.vue
View file

@ -1,5 +1,6 @@
<template>
<v-dialog :modelValue="showLogoutPopup" class="ma-0 pa-0" :width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
@click:outside="$emit('onOutsideLogoutPopupClicked')">
<div class="dialog-content text-center">
<h2 class="dialog-title">{{ $t("logout.confirm_text") }}</h2>

4
src/components/MessageRetentionDialog.vue
View file

@ -2,7 +2,9 @@
<v-dialog
v-model="showDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'">
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
>
<div class="dialog-content text-center">
<h2 class="dialog-title">{{ $t("room_info.message_retention") }}</h2>
<v-container fluid>

2
src/components/Profile.vue
View file

@ -112,6 +112,7 @@
v-model="showEditPasswordDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '940px' : '80%'"
scroll-strategy="none"
>
<v-card :disabled="settingPassword" class="dialog-content">
<h2 class="dialog-title">{{ $matrix.currentUser.is_guest ? $t("profile.set_password") : $t("profile.change_password") }}</h2>
@ -219,6 +220,7 @@
persistent
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
>
<div class="dialog-content text-center">
<v-icon size="30">notifications_active</v-icon>

2
src/components/ProfileInfoPopup.vue
View file

@ -1,5 +1,5 @@
<template>
<v-dialog v-model="showDialog" content-class="profile-info-popup" class="ma-0 pa-0">
<v-dialog v-model="showDialog" content-class="profile-info-popup" class="ma-0 pa-0" scroll-strategy="none">
<v-card variant="flat">
<v-card-text>
<div class="you-are">{{ $t("profile_info_popup.you_are") }}</div>

1
src/components/PurgeRoomDialog.vue
View file

@ -4,6 +4,7 @@
v-model="showDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
>
<div v-if="timeout == -1" class="dialog-content text-center">
<template>

1
src/components/QRCodePopup.vue
View file

@ -3,6 +3,7 @@
v-model="showDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '940px' : '95%'"
scroll-strategy="none"
>
<div class="dialog-content text-center" ref="qrContainer">
<div class="d-flex justify-center">

1
src/components/ReportRoomDialog.vue
View file

@ -3,6 +3,7 @@
v-model="showDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
>
<div class="dialog-content text-center">
<h2 class="dialog-title">{{ $t("room_info.report") }}</h2>

2
src/components/RoundedDialog.vue
View file

@ -1,5 +1,5 @@
<template>
<v-dialog v-bind="{ ...$props, ...$attrs }" content-class="v-dialog-rounded">
<v-dialog v-bind="{ ...$props, ...$attrs }" content-class="v-dialog-rounded" scroll-strategy="none">
<slot></slot>
</v-dialog>
</template>

1
src/components/UnsupportedBrowserAlert.vue
View file

@ -4,6 +4,7 @@
v-model="isUnSupportedBrowser"
persistent
:width="$vuetify.display.smAndUp ? '50%' : '90%'"
scroll-strategy="none"
>
<div class="dialog-content text-center">
<h2 class="dialog-title">{{ $t("global.different_browser_title") }}</h2>

70
src/components/UserProfileDialog.vue
View file

@ -3,6 +3,7 @@
v-model="showDialog"
class="ma-0 pa-0"
:width="$vuetify.display.smAndUp ? '688px' : '95%'"
scroll-strategy="none"
>
<div class="dialog-content text-center member-action-dialog">
<div class="pt-4">
@ -35,6 +36,7 @@
<p class="font-weight-light">{{ sharedRooms.slice(0, 3).join(", ") }}</p>
</template>
</div>
{{ message }}
<DeviceList :member="activeMember" />
<div class="py-3" v-if="activeMember.userId != $matrix.currentUserId">
<div v-if="activeMember.membership == 'knock'">
@ -44,23 +46,28 @@
<v-icon start>$vuetify.icons.direct_chat</v-icon> {{ $t("menu.direct_chat") }}
</v-btn>
<div v-if="canBanUserComp">
<v-btn variant="text" x-large block v-if="activeMember.userId != $matrix.currentUserId && canBanUserComp" class="start-private-chat clickable d-block text-none justify-start" @click="banUser(activeMember)">
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && canBanUserComp" class="start-private-chat clickable d-block text-none justify-start" @click="banUser">
<v-icon start>$vuetify.icons.kickout</v-icon> {{ $t("menu.user_kick_and_ban") }}
</v-btn>
</div>
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !isAdminComp && canMakeAdminComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeAdmin(activeMember)">
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !isAdminComp && canMakeAdminComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeAdmin">
<v-icon start>$vuetify.icons.make_admin</v-icon> {{ $t("menu.user_make_admin") }}
</v-btn>
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !isModeratorComp && !isAdminComp && canMakeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeModerator(activeMember)">
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && !isModeratorComp && !isAdminComp && canMakeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="makeModerator">
<v-icon start>$vuetify.icons.make_moderator</v-icon> {{ $t("menu.user_make_moderator") }}
</v-btn>
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && isModeratorComp && canRevokeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="revokeModerator(activeMember)">
<v-btn variant="text" size="x-large" block v-if="activeMember.userId != $matrix.currentUserId && isModeratorComp && canRevokeModeratorComp" class="start-private-chat clickable d-block text-none justify-start" @click="revokeModerator">
<v-icon start>$vuetify.icons.revoke</v-icon> {{ $t("menu.user_revoke_moderator") }}
</v-btn>
</div>
</div>
</div>
</v-dialog>
<ConfirmationDialog :message="$t('room_info.confirm_make_admin')" v-model="showConfirmMakeAdmin" v-on:ok="doMakeAdmin" />
<ConfirmationDialog :message="$t('room_info.confirm_make_moderator')" v-model="showConfirmMakeModerator" v-on:ok="doMakeModerator" />
<ConfirmationDialog :message="$t('room_info.confirm_revoke_moderator')" v-model="showConfirmRevokeModerator" v-on:ok="doRevokeModerator" />
<ConfirmationDialog :message="$t('room_info.confirm_ban')" v-model="showConfirmBan" v-on:ok="doBanUser" />
</template>
<script>
import roomInfoMixin from "./roomInfoMixin";
@ -68,13 +75,15 @@ import DeviceList from "../components/DeviceList";
import AuthedImage from "./AuthedImage.vue";
import util from "../plugins/utils";
import RoomDialogBase from "./RoomDialogBase.vue";
import ConfirmationDialog from "./ConfirmationDialog.vue";
export default {
name: "UserProfileDialog",
extends: RoomDialogBase,
components: {
DeviceList,
AuthedImage
AuthedImage,
ConfirmationDialog
},
props: {
activeMember: {
@ -86,6 +95,10 @@ export default {
},
data() {
return {
showConfirmMakeAdmin: false,
showConfirmMakeModerator: false,
showConfirmRevokeModerator: false,
showConfirmBan: false
};
},
computed: {
@ -210,30 +223,53 @@ export default {
}
return false;
},
makeAdmin(member) {
if (this.room) {
this.$matrix.makeAdmin(this.room.roomId, member.userId)
makeAdmin() {
if (this.room && this.activeMember) {
this.showConfirmMakeAdmin = true;
this.showDialog = false;
}
},
makeModerator(member) {
if (this.room) {
this.$matrix.makeModerator(this.room.roomId, member.userId)
doMakeAdmin() {
if (this.room && this.activeMember) {
this.$matrix.makeAdmin(this.room.roomId, this.activeMember.userId)
this.showDialog = false;
}
},
revokeModerator(member) {
if (this.room) {
this.$matrix.revokeModerator(this.room.roomId, member.userId)
makeModerator() {
if (this.room && this.activeMember) {
this.showConfirmMakeModerator = true;
this.showDialog = false;
}
},
banUser(member) {
if (this.room) {
this.$matrix.banUser(this.room.roomId, member.userId)
doMakeModerator() {
if (this.room && this.activeMember) {
this.$matrix.makeModerator(this.room.roomId, this.activeMember.userId)
this.showDialog = false;
}
},
revokeModerator() {
if (this.room && this.activeMember) {
this.showConfirmRevokeModerator = true;
this.showDialog = false;
}
},
doRevokeModerator() {
if (this.room && this.activeMember) {
this.$matrix.revokeModerator(this.room.roomId, this.activeMember.userId)
this.showDialog = false;
}
},
banUser() {
if (this.room && this.activeMember) {
this.showConfirmBan = true;
this.showDialog = false;
}
},
doBanUser() {
if (this.room && this.activeMember) {
this.$matrix.banUser(this.room.roomId, this.activeMember.userId)
}
}
},
};
</script>