CHats: fix deleting a specific attachment

app/soapbox/features/chats/components/chat-composer.tsx

@@ -43,7 +43,7 @@ interface IChatComposer extends Pick<React.TextareaHTMLAttributes<HTMLTextAreaEl
   onSelectFile: (files: FileList, intl: IntlShape) => void
   resetFileKey: number | null
   attachments?: Attachment[]
-  onDeleteAttachment?: () => void
+  onDeleteAttachment?: (i: number) => void
   isUploading?: boolean
   uploadProgress?: number
 }

app/soapbox/features/chats/components/chat-textarea.tsx

@@ -8,7 +8,7 @@ import ChatUpload from './chat-upload';
 
 interface IChatTextarea extends React.ComponentProps<typeof Textarea> {
   attachments?: Attachment[]
-  onDeleteAttachment?: () => void
+  onDeleteAttachment?: (i: number) => void
   isUploading?: boolean
   uploadProgress?: number
 }
@@ -21,6 +21,14 @@ const ChatTextarea: React.FC<IChatTextarea> = ({
   uploadProgress = 0,
   ...rest
 }) => {
+  const handleDeleteAttachment = (i: number) => {
+    return () => {
+      if (onDeleteAttachment) {
+        onDeleteAttachment(i);
+      }
+    };
+  };
+
   return (
     <div className={`
       block
@@ -36,12 +44,12 @@ const ChatTextarea: React.FC<IChatTextarea> = ({
     >
       {(!!attachments?.length || isUploading) && (
         <HStack className='-ml-2 -mt-2 p-3 pb-0' wrap>
-          {attachments?.map(attachment => (
+          {attachments?.map((attachment, i) => (
             <div className='ml-2 mt-2 flex'>
               <ChatUpload
                 key={attachment.id}
                 attachment={attachment}
-                onDelete={onDeleteAttachment}
+                onDelete={handleDeleteAttachment(i)}
               />
             </div>
           ))}

app/soapbox/features/chats/components/chat.tsx

@@ -131,8 +131,10 @@ const Chat: React.FC<ChatInterface> = ({ chat, inputRef, className }) => {
 
   const handleMouseOver = () => markRead();
 
-  const handleRemoveFile = () => {
-    setAttachments([]);
+  const handleRemoveFile = (i: number) => {
+    const newAttachments = [...attachments];
+    newAttachments.splice(i, 1);
+    setAttachments(newAttachments);
     setResetFileKey(fileKeyGen());
   };