mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-30 22:34:01 -05:00
Added accept parameter to FileUpload component
This commit is contained in:
parent
b6f94c5fdb
commit
eed8c04fdb
2 changed files with 4 additions and 2 deletions
|
@ -16,9 +16,10 @@ export interface FileUploadProps {
|
|||
style?: CSSProperties;
|
||||
unstyled?: boolean;
|
||||
inputRef?: React.RefObject<HTMLInputElement>;
|
||||
accept?: string;
|
||||
}
|
||||
|
||||
const FileUpload: React.FC<FileUploadProps> = ({id, onUpload, children, style, unstyled = false, inputRef, className, dragIndicatorClassName, ...props}) => {
|
||||
const FileUpload: React.FC<FileUploadProps> = ({id, onUpload, children, style, unstyled = false, inputRef, className, dragIndicatorClassName, accept, ...props}) => {
|
||||
const [fileKey, setFileKey] = useState<number>(Date.now());
|
||||
const [isDragging, setIsDragging] = useState(false);
|
||||
|
||||
|
@ -52,7 +53,7 @@ const FileUpload: React.FC<FileUploadProps> = ({id, onUpload, children, style, u
|
|||
return (
|
||||
<label className={clsx('relative', className)} htmlFor={id} style={style} onDragEnter={handleDragging} onDragLeave={handleStopDragging} onDragOver={handleDragging} onDrop={handleDrop} {...props}>
|
||||
<div className={clsx({'absolute inset-1 rounded': true, 'border-2 border-dashed border-grey-400/25': isDragging}, isDragging && [dragIndicatorClassName])} />
|
||||
<input key={fileKey} ref={inputRef || null} id={id} type="file" hidden onChange={handleFileChange} />
|
||||
<input key={fileKey} ref={inputRef || null} accept={accept} id={id} type="file" hidden onChange={handleFileChange} />
|
||||
{(typeof children === 'string') ?
|
||||
<div className={!unstyled ? `inline-flex h-[34px] cursor-pointer items-center justify-center rounded px-4 text-sm font-semibold hover:bg-grey-100 dark:text-white dark:hover:bg-grey-900` : ''}>
|
||||
{children}
|
||||
|
|
|
@ -20,6 +20,7 @@ const UniversalImportModal: React.FC = () => {
|
|||
>
|
||||
<div className='py-4 leading-9'>
|
||||
<FileUpload
|
||||
accept="application/json, application/zip"
|
||||
id="import-file"
|
||||
onUpload={async (file) => {
|
||||
setUploading(true);
|
||||
|
|
Loading…
Reference in a new issue