add ability to delete channel message history

This commit is contained in:
liamcottle
2025-02-14 00:27:09 +13:00
parent 4666f89a25
commit f0a96b04ee
3 changed files with 72 additions and 1 deletions

View File

@@ -0,0 +1,54 @@
<template>
<DropDownMenu>
<template v-slot:button>
<IconButton v-if="channel" class="bg-transparent text-gray-500">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5ZM12 12.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5ZM12 18.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5Z" />
</svg>
</IconButton>
</template>
<template v-slot:items>
<!-- delete message history button -->
<DropDownMenuItem @click="onDeleteMessageHistory">
<svg class="size-5 text-red-500" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M8.75 1A2.75 2.75 0 0 0 6 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 1 0 .23 1.482l.149-.022.841 10.518A2.75 2.75 0 0 0 7.596 19h4.807a2.75 2.75 0 0 0 2.742-2.53l.841-10.52.149.023a.75.75 0 0 0 .23-1.482A41.03 41.03 0 0 0 14 4.193V3.75A2.75 2.75 0 0 0 11.25 1h-2.5ZM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 10 4ZM8.58 7.72a.75.75 0 0 0-1.5.06l.3 7.5a.75.75 0 1 0 1.5-.06l-.3-7.5Zm4.34.06a.75.75 0 1 0-1.5-.06l-.3 7.5a.75.75 0 1 0 1.5.06l.3-7.5Z" clip-rule="evenodd" />
</svg>
<span class="text-red-500">Delete Message History</span>
</DropDownMenuItem>
</template>
</DropDownMenu>
</template>
<script>
import IconButton from "../IconButton.vue";
import DropDownMenu from "../DropDownMenu.vue";
import DropDownMenuItem from "../DropDownMenuItem.vue";
import Database from "../../js/Database.js";
export default {
name: 'ChannelDropDownMenu',
components: {
DropDownMenuItem,
DropDownMenu,
IconButton,
},
props: {
channel: Object,
},
methods: {
async onDeleteMessageHistory() {
// confirm user wants to delete message history
if(!confirm("Are you sure you want to delete all message history for this channel?")){
return;
}
// delete message history
await Database.ChannelMessage.deleteChannelMessages(this.channel.idx);
},
},
}
</script>

View File

@@ -7,12 +7,21 @@
<div class="text-sm text-gray-500">{{ channel.description }}</div>
</div>
<!-- channel dropdown menu -->
<div class="my-auto">
<ChannelDropDownMenu :channel="channel"/>
</div>
</div>
</template>
<script>
import ContactDropDownMenu from "../contacts/ContactDropDownMenu.vue";
import ChannelDropDownMenu from "./ChannelDropDownMenu.vue";
export default {
name: 'ChannelListItem',
components: {ChannelDropDownMenu, ContactDropDownMenu},
props: {
channel: Object,
},

View File

@@ -2,7 +2,13 @@
<Page>
<!-- app bar -->
<AppBar title="Channel Messages" :subtitle="subtitle"/>
<AppBar title="Channel Messages" :subtitle="subtitle">
<template v-slot:trailing>
<ChannelDropDownMenu
v-if="channel"
:channel="channel"/>
</template>
</AppBar>
<!-- list -->
<div class="flex h-full w-full overflow-hidden">
@@ -17,10 +23,12 @@ import Page from "./Page.vue";
import AppBar from "../AppBar.vue";
import MessageViewer from "../messages/MessageViewer.vue";
import GlobalState from "../../js/GlobalState.js";
import ChannelDropDownMenu from "../channels/ChannelDropDownMenu.vue";
export default {
name: 'ChannelMessagesPage',
components: {
ChannelDropDownMenu,
MessageViewer,
AppBar,
Page,