taler-typescript-core

commit 3a791aa11e3cea3f45db37282e1c2754779942a6
parent fe382d8fda8fda332c774080492065429d2b272b
Author: Sebastian <sebasjm@taler-systems.com>
Date:   Thu, 16 Apr 2026 15:28:59 -0300

fix #10601

Diffstat:
M
packages/merchant-backoffice-ui/src/components/form/InputImage.tsx
 | 
24
++++++++++++++----------

1 file changed, 14 insertions(+), 10 deletions(-)
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx b/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx
@@ -24,6 +24,7 @@ import { useRef, useState } from "preact/hooks";
 import { MAX_IMAGE_SIZE as MAX_IMAGE_UPLOAD_SIZE } from "../../utils/constants.js";
 import { InputProps, useField } from "./useField.js";
 import { Tooltip } from "../Tooltip.js";
+import { TranslatedString } from "@gnu-taler/taler-util";
 
 const TALER_SCREEN_ID = 9;
 
@@ -47,7 +48,7 @@ export function InputImage<T>({
 
   const image = useRef<HTMLInputElement>(null);
   const { i18n } = useTranslationContext();
-  const [sizeError, setSizeError] = useState(false);
+  const [sizeError, setSizeError] = useState<TranslatedString>();
 
   return (
     <div class="field is-horizontal">
@@ -83,14 +84,19 @@ export function InputImage<T>({
                 if (!fileList || fileList.length != 1) {
                   return onChange(undefined!);
                 }
-                if (fileList[0].size > MAX_IMAGE_UPLOAD_SIZE) {
-                  setSizeError(true);
-                  normalizeImagesize(fileList[0], onChange as any);
+                const theFile = fileList[0];
+                if (!theFile.type.startsWith("image/")) {
+                  setSizeError(i18n.str`The file is not an image`);
+                  return;
+                }
+                if (theFile.size > MAX_IMAGE_UPLOAD_SIZE) {
+                  setSizeError(i18n.str`The image was normalized to be smaller than 1 MB`);
+                  normalizeImagesize(theFile, onChange as any);
                   // return onChange(undefined!);
                   return;
                 }
-                setSizeError(false);
-                toDataSrc(fileList[0]).then(r => {
+                setSizeError(undefined);
+                toDataSrc(theFile).then(r => {
                   onChange(r as T[keyof T]);
                 })
               }}
@@ -104,10 +110,8 @@ export function InputImage<T>({
             </p>
           )}
           {sizeError && (
-            <p class="help" style={{ fontSize: 16 }}>
-              <i18n.Translate>
-                The image was normalized to be smaller than 1 MB
-              </i18n.Translate>
+            <p class="help is-danger" style={{ fontSize: 16 }}>
+              {sizeError}
             </p>
           )}
           {!value && (