diff options
Diffstat (limited to 'packages/demobank-ui/src/components/fields/ImageInput.tsx')
-rw-r--r-- | packages/demobank-ui/src/components/fields/ImageInput.tsx | 21 |
1 files changed, 9 insertions, 12 deletions
diff --git a/packages/demobank-ui/src/components/fields/ImageInput.tsx b/packages/demobank-ui/src/components/fields/ImageInput.tsx index 98457af21..c190de9a9 100644 --- a/packages/demobank-ui/src/components/fields/ImageInput.tsx +++ b/packages/demobank-ui/src/components/fields/ImageInput.tsx @@ -18,19 +18,17 @@ * * @author Sebastian Javier Marchano (sebasjm) */ -import { h, VNode } from 'preact'; -import { useLayoutEffect, useRef, useState } from 'preact/hooks'; -import emptyImage from '../../assets/empty.png'; -import { TextInputProps } from './TextInput'; +import { h, VNode } from "preact"; +import { useLayoutEffect, useRef, useState } from "preact/hooks"; +import emptyImage from "../../assets/empty.png"; +import { TextInputProps } from "./TextInput"; const MAX_IMAGE_UPLOAD_SIZE = 1024 * 1024; export function ImageInput(props: TextInputProps): VNode { const inputRef = useRef<HTMLInputElement>(null); useLayoutEffect(() => { - if (props.grabFocus) - inputRef.current?.focus(); - + if (props.grabFocus) inputRef.current?.focus(); }, [props.grabFocus]); const value = props.bind[0]; @@ -59,14 +57,13 @@ export function ImageInput(props: TextInputProps): VNode { /> <input ref={image} - style={{ display: 'none' }} + style={{ display: "none" }} type="file" name={String(name)} onChange={(e) => { const f: FileList | null = e.currentTarget.files; - if (!f || f.length != 1) - return onChange(emptyImage); - + if (!f || f.length != 1) return onChange(emptyImage); + if (f[0].size > MAX_IMAGE_UPLOAD_SIZE) { setSizeError(true); return onChange(emptyImage); @@ -76,7 +73,7 @@ export function ImageInput(props: TextInputProps): VNode { const b64 = btoa( new Uint8Array(b).reduce( (data, byte) => data + String.fromCharCode(byte), - '', + "", ), ); return onChange(`data:${f[0].type};base64,${b64}` as any); |