commit a08d5dd17c26fab089ba42823afc148113e32658
parent 11233f014128799c06f8e4d611a129963466f36d
Author: Sebastian <sebasjm@gmail.com>
Date: Mon, 16 Sep 2024 12:25:08 -0300
fix #8987
Diffstat:
2 files changed, 18 insertions(+), 1 deletion(-)
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx b/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx
@@ -77,7 +77,9 @@ export function InputImage<T>({
readonly={readonly}
onChange={(e) => {
const f: FileList | null = e.currentTarget.files;
+ console.log("on change", e, f)
if (!f || f.length != 1) {
+
return onChange(undefined!);
}
if (f[0].size > MAX_IMAGE_UPLOAD_SIZE) {
@@ -111,7 +113,12 @@ export function InputImage<T>({
</button>
)}
{value && (
- <button class="button" onClick={() => onChange(undefined!)}>
+ <button class="button" onClick={() => {
+ if (image.current) {
+ image.current.value = ""
+ }
+ onChange(undefined!);
+ }}>
<i18n.Translate>Remove</i18n.Translate>
</button>
)}
diff --git a/packages/merchant-backoffice-ui/src/components/product/ProductForm.tsx b/packages/merchant-backoffice-ui/src/components/product/ProductForm.tsx
@@ -173,6 +173,16 @@ export function ProductForm({ onSubscribe, initial, alreadyExist }: Props) {
object={value}
valueHandler={valueHandler}
>
+ {/**
+ * If the user press enter on any text field it will the browser will trigger
+ * the first button that it found.
+ *
+ * In this form the InputImage will be triggered and this is unwanted.
+ *
+ * As a workaround we have this non-action button which will prevent loading/unloading
+ * the image when the enter key is pressed accidentally.
+ */}
+ <button />
{alreadyExist ? undefined : (
<InputWithAddon<Entity>
name="product_id"