Add message deletion

src/app/components/ChannelMessageMenuButton.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import {type Instance} from "tippy.js"
+  import {between} from "@welshman/lib"
+  import Icon from "@lib/components/Icon.svelte"
+  import Button from "@lib/components/Button.svelte"
+  import Tippy from "@lib/components/Tippy.svelte"
+  import ChannelMessageMenu from "@app/components/ChannelMessageMenu.svelte"
+  import {tagRoom} from "@app/state"
+  import {publishReaction} from "@app/commands"
+
+  export let url, room, event
+
+  const open = () => popover.show()
+
+  const onClick = () => popover.hide()
+
+  const onMouseMove = ({clientX, clientY}: any) => {
+    const {x, y, width, height} = popover.popper.getBoundingClientRect()
+
+    if (!between([x, x + width], clientX) || !between([y, y + height + 30], clientY)) {
+      popover.hide()
+    }
+  }
+
+  let popover: Instance
+</script>
+
+<svelte:document on:mousemove={onMouseMove} />
+
+<div class="flex">
+  <Button class="btn join-item btn-xs" on:click={open}>
+    <Icon icon="menu-dots" size={4} />
+  </Button>
+  <Tippy
+    bind:popover
+    component={ChannelMessageMenu}
+    props={{url, room, event, onClick}}
+    params={{trigger: "manual", interactive: true}} />
+</div>