diff --git a/src/components/common/messaging/bars/MessageOverlayBar.tsx b/src/components/common/messaging/bars/MessageOverlayBar.tsx index 4eec2bd2..d47ac6d6 100644 --- a/src/components/common/messaging/bars/MessageOverlayBar.tsx +++ b/src/components/common/messaging/bars/MessageOverlayBar.tsx @@ -12,8 +12,11 @@ import { Message as MessageObject } from "revolt.js/dist/maps/Messages"; import styled from "styled-components"; import { openContextMenu } from "preact-context-menu"; +import { useEffect, useState } from "preact/hooks"; import { internalEmit } from "../../../../lib/eventEmitter"; +import { shiftKeyPressed } from "../../../../lib/modifiers"; +import { getRenderer } from "../../../../lib/renderer/Singleton"; import { QueuedMessage } from "../../../../mobx/stores/MessageQueue"; @@ -89,9 +92,24 @@ const Divider = styled.div` export const MessageOverlayBar = observer(({ message, queued }: Props) => { const client = useClient(); - const { openScreen } = useIntermediate(); + const { openScreen, writeClipboard } = useIntermediate(); const isAuthor = message.author_id === client.user!._id; + const [copied, setCopied] = useState<"link" | "id">(null!); + const [extraActions, setExtra] = useState(shiftKeyPressed); + + useEffect(() => { + const handler = (ev: KeyboardEvent) => setExtra(ev.shiftKey); + + document.addEventListener("keyup", handler); + document.addEventListener("keydown", handler); + + return () => { + document.removeEventListener("keyup", handler); + document.removeEventListener("keydown", handler); + }; + }); + return ( @@ -120,12 +138,14 @@ export const MessageOverlayBar = observer(({ message, queued }: Props) => { ChannelPermission.ManageMessages) ? ( - openScreen({ - id: "special_prompt", - type: "delete_message", - target: message, - } as unknown as Screen) + onClick={(e) => + e.shiftKey + ? message.delete() + : openScreen({ + id: "special_prompt", + type: "delete_message", + target: message, + } as unknown as Screen) }> @@ -143,43 +163,54 @@ export const MessageOverlayBar = observer(({ message, queued }: Props) => { - - - - openContextMenu("Menu", { - message, - contextualChannel: message.channel_id, - queued, - }) - }> - - - - - - openContextMenu("Menu", { - message, - contextualChannel: message.channel_id, - queued, - }) - }> - - - - - - openContextMenu("Menu", { - message, - contextualChannel: message.channel_id, - queued, - }) - }> - - - + {extraActions && ( + <> + + + { + const messages = getRenderer( + message.channel!, + ).messages; + const index = messages.findIndex( + (x) => x._id === message._id, + ); + + let unread_id = message._id; + if (index > 0) { + unread_id = messages[index - 1]._id; + } + + internalEmit("NewMessages", "mark", unread_id); + message.channel?.ack(unread_id, true); + }}> + + + + + { + setCopied("link"); + writeClipboard(message.url); + }}> + + + + + { + setCopied("id"); + writeClipboard(message._id); + }}> + + + + + )} ); }); diff --git a/src/lib/modifiers.ts b/src/lib/modifiers.ts new file mode 100644 index 00000000..105f81c0 --- /dev/null +++ b/src/lib/modifiers.ts @@ -0,0 +1,18 @@ +/** + * Utility file for detecting whether the + * shift key is currently pressed or not. + */ + +export let shiftKeyPressed = false; + +if (typeof window !== "undefined") { + document.addEventListener("keydown", (ev) => { + if (ev.shiftKey) shiftKeyPressed = true; + else shiftKeyPressed = false; + }); + + document.addEventListener("keyup", (ev) => { + if (ev.shiftKey) shiftKeyPressed = true; + else shiftKeyPressed = false; + }); +}