diff --git a/src/components/page/channel/TextChannel.tsx b/src/components/page/channel/TextChannel.tsx index af8c0c4..55ccff4 100644 --- a/src/components/page/channel/TextChannel.tsx +++ b/src/components/page/channel/TextChannel.tsx @@ -3,11 +3,17 @@ import { ChannelPageProps } from "@/components/page/PageView"; import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; -import { ClientMeta, StoredMessage } from "@/lib/types"; +import { Channel, StoredMessage } from "@/lib/types"; import { base58 } from "@scure/base"; import { useEffect, useRef, useState } from "react"; import * as ed from "@noble/ed25519"; -import { CircleXIcon } from "lucide-react"; +import { CircleXIcon, PencilIcon, Trash2Icon } from "lucide-react"; +import { + ContextMenu, + ContextMenuContent, + ContextMenuItem, + ContextMenuTrigger, +} from "@/components/ui/context-menu"; export default function TextChannel({ appRef, @@ -20,6 +26,13 @@ export default function TextChannel({ const intersectionRef = useRef(null); const chunkRef = useRef(0); + const account = appRef.current?.getAccount(); + + const userPubKey = + (account && + base58.encode(ed.getPublicKey(base58.decode(account.privateKey)))) || + null; + useEffect(() => { if (!intersectionRef.current) return; @@ -69,7 +82,13 @@ export default function TextChannel({ Object.entries(messages) .sort((a, b) => b[1].timestamp - a[1].timestamp) .map(([_, message]) => ( - + ))}
@@ -97,28 +116,28 @@ export default function TextChannel({ export function TextMessage({ appRef, message, + + channel, + userPubKey, }: { appRef: React.RefObject | null>; message: StoredMessage; + channel: Channel; + userPubKey: string | null; }) { const time = new Date(message.timestamp).toLocaleTimeString([], { hour: "numeric", minute: "2-digit", }); - const author = appRef.current?.server?.users[message.author]; - const [verified, setVerified] = useState(true); useEffect(() => { const serverPubKey = appRef.current?.server?.serverPublicKey && base58.encode(appRef.current?.server?.serverPublicKey); - if (!serverPubKey) return; - const authorPubKey = base58.decode(message.author); - setVerified( ed.verify( base58.decode(message.signature), @@ -130,17 +149,25 @@ export function TextMessage({ ); }, []); - return ( + const isOwnMessage = message.author === userPubKey; + + function handleDelete() { + appRef.current?.server?.websocket?.send({ + method: "DeleteMessage", + message_id: message.id, + channel_id: channel.id, + }); + } + + const content = (
- {author?.displayName.slice(0, 1).toUpperCase() || message.author.slice(0, 2).toUpperCase()} -
@@ -150,6 +177,9 @@ export function TextMessage({ {author?.displayName || message.author.slice(0, 8)} {time} + {message.is_edited && ( + (edited) + )}

{message.content} @@ -157,4 +187,24 @@ export function TextMessage({

); + + if (!isOwnMessage) { + return content; + } + + return ( + + {content} + + {}}> + + Edit + + + + Delete + + + + ); } diff --git a/src/lib/types.ts b/src/lib/types.ts index 1c77ea6..647e08e 100644 --- a/src/lib/types.ts +++ b/src/lib/types.ts @@ -18,6 +18,7 @@ export interface MessageData { export interface StoredMessage extends MessageData { id: string; author: string; + is_edited: boolean; } export type Channel = { id: string; name: string } & ChannelKind;