interface: add the ability to delete chat messages

pkg/interface/src/views/apps/chat/ChatResource.tsx

@@ -134,6 +134,11 @@ function ChatResource(props: ChatResourceProps) {
     api.graph.addPost(ship, name, createPost(window.ship, contents))
   }, [resource]);
 
+  const onDelete = useCallback((msg: Post) => {
+    const { ship, name } = resourceFromPath(resource);
+    api.graph.removePosts(ship, name, [msg.index]);
+  }, [resource]);
+
   const dismissUnread = useCallback(() => {
     api.hark.markCountAsRead(association, '/', 'message');
   }, [association]);
@@ -156,6 +161,7 @@ function ChatResource(props: ChatResourceProps) {
       api={api}
       canWrite={canWrite}
       onReply={onReply}
+      onDelete={onDelete}
       fetchMessages={fetchMessages}
       dismissUnread={dismissUnread}
       getPermalink={getPermalink}

pkg/interface/src/views/apps/chat/components/ChatMessage.tsx

@@ -141,7 +141,7 @@ const MessageActionItem = (props) => {
   );
 };
 
-const MessageActions = ({ api, onReply, association, msg, isAdmin, permalink }) => {
+const MessageActions = ({ api, onReply, onDelete, association, msg, isAdmin, permalink }) => {
   const isOwn = () => msg.author === window.ship;
   const { doCopy, copyDisplay } = useCopy(permalink, 'Copy Message Link');
 
@@ -188,8 +188,8 @@ const MessageActions = ({ api, onReply, association, msg, isAdmin, permalink })
               <MessageActionItem onClick={doCopy}>
                 {copyDisplay}
               </MessageActionItem>
-              {false && (isAdmin() || isOwn()) ? (
-                <MessageActionItem onClick={(e) => console.log(e)} color='red'>
+              {(isAdmin || isOwn()) ? (
+                <MessageActionItem onClick={(e) => onDelete(msg)} color='red'>
                   Delete Message
                 </MessageActionItem>
               ) : null}
@@ -272,6 +272,7 @@ function ChatMessage(props: ChatMessageProps) {
   } = props;
 
   let onReply = props?.onReply ?? (() => {});
+  let onDelete = props?.onDelete ?? (() => {});
   const transcluded = props?.transcluded ?? 0;
   const renderSigil = props.renderSigil ?? (Boolean(nextMsg && msg.author !== nextMsg.author) ||
         !nextMsg ||
@@ -289,7 +290,7 @@ function ChatMessage(props: ChatMessageProps) {
     }
 
   const date = useMemo(() => daToUnix(bigInt(msg.index.split('/')[1])), [msg.index]);
-  const nextDate = useMemo(() => nextMsg ? (
+  const nextDate = useMemo(() => nextMsg && typeof nextMsg !== 'string' ? (
     daToUnix(bigInt(nextMsg.index.split('/')[1]))
   ) : null,
     [nextMsg]
@@ -320,7 +321,8 @@ function ChatMessage(props: ChatMessageProps) {
     fontSize,
     hideHover,
     transcluded,
-    onReply
+    onReply,
+    onDelete
   };
 
   const message = useMemo(() => (

pkg/interface/src/views/apps/chat/components/ChatPane.tsx

@@ -43,6 +43,7 @@ interface ChatPaneProps {
    * Get contents of reply message
    */
   onReply: (msg: Post) => string;
+  onDelete: (msg: Post) => void;
   /**
    * Fetch more messages
    *
@@ -84,6 +85,7 @@ export function ChatPane(props: ChatPaneProps) {
     isAdmin,
     dismissUnread,
     onSubmit,
+    onDelete,
     promptShare = [],
     fetchMessages
   } = props;
@@ -159,6 +161,7 @@ export function ChatPane(props: ChatPaneProps) {
         showOurContact={promptShare.length === 0 && !showBanner}
         pendingSize={Object.keys(graphTimesentMap[id] || {}).length}
         onReply={onReply}
+        onDelete={onDelete}
         dismissUnread={dismissUnread}
         fetchMessages={fetchMessages}
         isAdmin={isAdmin}

pkg/interface/src/views/apps/chat/components/ChatWindow.tsx

@@ -42,6 +42,7 @@ type ChatWindowProps = {
   api: GlobalApi;
   scrollTo?: BigInteger;
   onReply: (msg: Post) => void;
+  onDelete: (msg: Post) => void;
   dismissUnread: () => void;
   pendingSize?: number;
   showOurContact: boolean;
@@ -203,6 +204,7 @@ class ChatWindow extends Component<
       showOurContact,
       graph,
       onReply,
+      onDelete,
       getPermalink,
       dismissUnread,
       isAdmin,
@@ -212,13 +214,14 @@ class ChatWindow extends Component<
       showOurContact,
       api,
       onReply,
+      onDelete,
       permalink,
       dismissUnread,
       isAdmin
     };
 
     const msg = graph.get(index)?.post;
-    if (!msg) return null;
+    if (!msg || typeof msg === 'string') return null;
     if (!this.state.initialized) {
       return (
         <MessagePlaceholder