diff --git a/src/widgets/base/Image.tsx b/src/widgets/base/Image.tsx
index cc16602a..8270e8da 100644
--- a/src/widgets/base/Image.tsx
+++ b/src/widgets/base/Image.tsx
@@ -1,4 +1,4 @@
-import React, { useContext, useRef } from "react";
+import React, { useRef, useMemo } from "react";
import { Row, Space } from "antd";
import Field from "@/common/Field";
import { Image as ImageOoui } from "@gisce/ooui";
@@ -12,20 +12,39 @@ import {
import { toBase64, getMimeType } from "@/helpers/filesHelper";
import iconMapper from "@/helpers/iconMapper";
import { useLocale } from "@gisce/react-formiga-components";
-import isBase64 from "validator/lib/isBase64";
type Props = {
ooui: ImageOoui;
};
+export const ImageRender = ({
+ ooui,
+ value,
+}: {
+ ooui: ImageOoui;
+ value?: string;
+}) => {
+ if (value) {
+ const Icon: React.ElementType = iconMapper(value) as any;
+ if (Icon) {
+ return ;
+ } else {
+ return (
+
+ );
+ }
+ }
+};
+
export const Image = (props: Props) => {
const { ooui } = props;
const { required, id } = ooui;
- const Icon: React.ElementType = iconMapper(id) as any;
-
- if (Icon) {
- return ;
+ if (iconMapper(id)) {
+ return ;
}
return (
@@ -47,13 +66,6 @@ export const ImageInput = (props: ImageInputProps) => {
const inputFile = useRef(null);
const { t } = useLocale();
- if (value) {
- const Icon: React.ElementType = iconMapper(value) as any;
- if (Icon) {
- return ;
- }
- }
-
const triggerChange = (changedValue?: string) => {
onChange?.(changedValue);
};
@@ -83,11 +95,11 @@ export const ImageInput = (props: ImageInputProps) => {
return (
<>
- {value && isBase64(value) && (
-
+ {useMemo(
+ () => (
+
+ ),
+ [value, ooui],
)}
{
};
export const ImageComponent = ({ value }: { value: string }): ReactElement => {
- return useMemo(
- () => (
-
- ),
- [value],
- );
+ return useMemo(() => , [value]);
};
export const TagComponent = ({