bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ChatTextarea: add gaps between uploads, put pending upload at end of list

Browse source
This commit is contained in:
Alex Gleason 2023-02-08 12:50:35 -06:00
parent 072e058764
commit 64f17ef013
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
1 changed files with 16 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
app/soapbox/features/chats/components/chat-textarea.tsx
View file

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { Textarea } from 'soapbox/components/ui'; import { HStack, Textarea } from 'soapbox/components/ui';
import { Attachment } from 'soapbox/types/entities'; import { Attachment } from 'soapbox/types/entities';
import ChatPendingUpload from './chat-pending-upload'; import ChatPendingUpload from './chat-pending-upload';
@ -35,19 +35,23 @@ const ChatTextarea: React.FC<IChatTextarea> = ({
`} `}
> >
{(!!attachments?.length || isUploading) && ( {(!!attachments?.length || isUploading) && (
<div className='flex p-3 pb-0'> <HStack className='-ml-2 -mt-2 p-3 pb-0' wrap>
{isUploading && (
<ChatPendingUpload progress={uploadProgress} />
)}
{attachments?.map(attachment => ( {attachments?.map(attachment => (
<ChatUpload <div className='ml-2 mt-2 flex'>
key={attachment.id} <ChatUpload
attachment={attachment} key={attachment.id}
onDelete={onDeleteAttachment} attachment={attachment}
/> onDelete={onDeleteAttachment}
/>
</div>
))} ))}
</div>
{isUploading && (
<div className='ml-2 mt-2 flex'>
<ChatPendingUpload progress={uploadProgress} />
</div>
)}
</HStack>
)} )}
<Textarea theme='transparent' {...rest} /> <Textarea theme='transparent' {...rest} />