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

ChatUpload: add blurhash

Browse source
This commit is contained in:
Alex Gleason 2023-02-02 13:06:27 -06:00
parent 382bc6732d
commit ea8561ca19
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
1 changed files with 5 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
app/soapbox/features/chats/components/chat-upload.tsx
View file

@ -1,5 +1,6 @@
import React from 'react'; import React from 'react';
import Blurhash from 'soapbox/components/blurhash';
import { Icon } from 'soapbox/components/ui'; import { Icon } from 'soapbox/components/ui';
import type { Attachment } from 'soapbox/types/entities'; import type { Attachment } from 'soapbox/types/entities';
@ -12,13 +13,15 @@ interface IChatUpload {
/** An attachment uploaded to the chat composer, before sending. */ /** An attachment uploaded to the chat composer, before sending. */
const ChatUpload: React.FC<IChatUpload> = ({ attachment, onDelete }) => { const ChatUpload: React.FC<IChatUpload> = ({ attachment, onDelete }) => {
return ( return (
<div className='relative inline-block'> <div className='relative inline-block rounded-lg overflow-hidden isolate'>
<Blurhash hash={attachment.blurhash} className='absolute inset-0 w-full h-full -z-10' />
<div className='absolute right-[6px] top-[6px]'> <div className='absolute right-[6px] top-[6px]'>
<RemoveButton onClick={onDelete} /> <RemoveButton onClick={onDelete} />
</div> </div>
<img <img
className='w-24 h-24 rounded-lg' className='w-24 h-24'
key={attachment.id} key={attachment.id}
src={attachment.url} src={attachment.url}
alt='' alt=''