diff options
Diffstat (limited to 'web/source/settings/lib/form/file.tsx')
| -rw-r--r-- | web/source/settings/lib/form/file.tsx | 37 |
1 files changed, 20 insertions, 17 deletions
diff --git a/web/source/settings/lib/form/file.tsx b/web/source/settings/lib/form/file.tsx index 944d77ae1..cf9407827 100644 --- a/web/source/settings/lib/form/file.tsx +++ b/web/source/settings/lib/form/file.tsx @@ -27,6 +27,7 @@ import type { HookOpts, FileFormInputHook, } from "./types"; +import { Error as ErrorC } from "../../components/error"; const _default = undefined; export default function useFileInput( @@ -41,6 +42,15 @@ export default function useFileInput( const [imageURL, setImageURL] = useState<string>(); const [info, setInfo] = useState<React.JSX.Element>(); + function reset() { + if (imageURL) { + URL.revokeObjectURL(imageURL); + } + setImageURL(undefined); + setFile(undefined); + setInfo(undefined); + } + function onChange(e: React.ChangeEvent<HTMLInputElement>) { const files = e.target.files; if (!files) { @@ -59,25 +69,18 @@ export default function useFileInput( setImageURL(URL.createObjectURL(file)); } - let size = prettierBytes(file.size); + const sizePrettier = prettierBytes(file.size); if (maxSize && file.size > maxSize) { - size = <span className="error-text">{size}</span>; + const maxSizePrettier = prettierBytes(maxSize); + setInfo( + <ErrorC + error={new Error(`file size ${sizePrettier} is larger than max size ${maxSizePrettier}`)} + reset={(reset)} + /> + ); + } else { + setInfo(<>{file.name} ({sizePrettier})</>); } - - setInfo( - <> - {file.name} ({size}) - </> - ); - } - - function reset() { - if (imageURL) { - URL.revokeObjectURL(imageURL); - } - setImageURL(undefined); - setFile(undefined); - setInfo(undefined); } const infoComponent = ( |