Remove UploadArea component

This commit is contained in:
Alex Gleason 2023-04-21 17:33:20 -05:00
parent 0904b6a2a0
commit 01b99d875b
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
2 changed files with 0 additions and 75 deletions

View File

@ -1,71 +0,0 @@
import clsx from 'clsx';
import React from 'react';
import { FormattedMessage } from 'react-intl';
import { spring } from 'react-motion';
import { Icon, Stack, Text } from 'soapbox/components/ui';
import Motion from '../util/optional-motion';
interface IUploadArea {
/** Whether the upload area is active. */
active: boolean
/** Callback when the upload area is closed. */
onClose: () => void
}
/** Component to display when a file is dragged over the UI. */
const UploadArea: React.FC<IUploadArea> = ({ active, onClose }) => {
const handleKeyUp = (e: KeyboardEvent) => {
if (active) {
switch (e.key) {
case 'Escape':
e.preventDefault();
e.stopPropagation();
onClose();
break;
}
}
};
React.useEffect(() => {
window.addEventListener('keyup', handleKeyUp, false);
return () => window.removeEventListener('keyup', handleKeyUp);
}, []);
return (
<Motion
defaultStyle={{ backgroundOpacity: 0, backgroundScale: 0.95 }}
style={{ backgroundOpacity: spring(active ? 1 : 0, { stiffness: 150, damping: 15 }), backgroundScale: spring(active ? 1 : 0.95, { stiffness: 200, damping: 3 }) }}
>
{({ backgroundOpacity, backgroundScale }) => (
<div
className={clsx({
'flex items-center justify-center bg-gray-700/90 h-full w-full absolute left-0 top-0 z-1000 pointer-events-none': true,
'visible': active,
'invisible': !active,
})}
style={{ opacity: backgroundOpacity }}
>
<div className='relative flex h-40 w-80 p-2'>
<div className='absolute inset-0' style={{ transform: `scale(${backgroundScale})` }} />
<Stack space={3} justifyContent='center' alignItems='center'>
<Icon
src={require('@tabler/icons/cloud-upload.svg')}
className='h-12 w-12 text-white/90'
/>
<Text size='xl' theme='white'>
<FormattedMessage id='upload_area.title' defaultMessage='Drag & drop to upload' />
</Text>
</Stack>
</div>
</div>
)}
</Motion>
);
};
export default UploadArea;

View File

@ -374,10 +374,6 @@ export function SidebarMenu() {
return import(/* webpackChunkName: "features/ui" */'../../../components/sidebar-menu');
}
export function UploadArea() {
return import(/* webpackChunkName: "features/compose" */'../components/upload-area');
}
export function ModalContainer() {
return import(/* webpackChunkName: "features/ui" */'../containers/modal-container');
}