sforkowany z mirror/soapbox
CHats: fix deleting a specific attachment
rodzic
64f17ef013
commit
6eadaf2942
|
@ -43,7 +43,7 @@ interface IChatComposer extends Pick<React.TextareaHTMLAttributes<HTMLTextAreaEl
|
||||||
onSelectFile: (files: FileList, intl: IntlShape) => void
|
onSelectFile: (files: FileList, intl: IntlShape) => void
|
||||||
resetFileKey: number | null
|
resetFileKey: number | null
|
||||||
attachments?: Attachment[]
|
attachments?: Attachment[]
|
||||||
onDeleteAttachment?: () => void
|
onDeleteAttachment?: (i: number) => void
|
||||||
isUploading?: boolean
|
isUploading?: boolean
|
||||||
uploadProgress?: number
|
uploadProgress?: number
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,7 +8,7 @@ import ChatUpload from './chat-upload';
|
||||||
|
|
||||||
interface IChatTextarea extends React.ComponentProps<typeof Textarea> {
|
interface IChatTextarea extends React.ComponentProps<typeof Textarea> {
|
||||||
attachments?: Attachment[]
|
attachments?: Attachment[]
|
||||||
onDeleteAttachment?: () => void
|
onDeleteAttachment?: (i: number) => void
|
||||||
isUploading?: boolean
|
isUploading?: boolean
|
||||||
uploadProgress?: number
|
uploadProgress?: number
|
||||||
}
|
}
|
||||||
|
@ -21,6 +21,14 @@ const ChatTextarea: React.FC<IChatTextarea> = ({
|
||||||
uploadProgress = 0,
|
uploadProgress = 0,
|
||||||
...rest
|
...rest
|
||||||
}) => {
|
}) => {
|
||||||
|
const handleDeleteAttachment = (i: number) => {
|
||||||
|
return () => {
|
||||||
|
if (onDeleteAttachment) {
|
||||||
|
onDeleteAttachment(i);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`
|
<div className={`
|
||||||
block
|
block
|
||||||
|
@ -36,12 +44,12 @@ const ChatTextarea: React.FC<IChatTextarea> = ({
|
||||||
>
|
>
|
||||||
{(!!attachments?.length || isUploading) && (
|
{(!!attachments?.length || isUploading) && (
|
||||||
<HStack className='-ml-2 -mt-2 p-3 pb-0' wrap>
|
<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'>
|
<div className='ml-2 mt-2 flex'>
|
||||||
<ChatUpload
|
<ChatUpload
|
||||||
key={attachment.id}
|
key={attachment.id}
|
||||||
attachment={attachment}
|
attachment={attachment}
|
||||||
onDelete={onDeleteAttachment}
|
onDelete={handleDeleteAttachment(i)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
|
|
@ -131,8 +131,10 @@ const Chat: React.FC<ChatInterface> = ({ chat, inputRef, className }) => {
|
||||||
|
|
||||||
const handleMouseOver = () => markRead();
|
const handleMouseOver = () => markRead();
|
||||||
|
|
||||||
const handleRemoveFile = () => {
|
const handleRemoveFile = (i: number) => {
|
||||||
setAttachments([]);
|
const newAttachments = [...attachments];
|
||||||
|
newAttachments.splice(i, 1);
|
||||||
|
setAttachments(newAttachments);
|
||||||
setResetFileKey(fileKeyGen());
|
setResetFileKey(fileKeyGen());
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Ładowanie…
Reference in New Issue