From 51635c1dc0219b98ea17a364ef5737e35dee5b39 Mon Sep 17 00:00:00 2001
From: admin <fakc445@gmail.com>
Date: Mon, 2 Sep 2024 15:13:19 +0300
Subject: [PATCH] feat: image

---
 .../ProductSelect/ProductSelect.tsx           | 22 +++++++++++++++----
 .../MarketplaceAuthDataInput.tsx              |  2 --
 2 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/components/ProductSelect/ProductSelect.tsx b/src/components/ProductSelect/ProductSelect.tsx
index 2c98756..9836c73 100644
--- a/src/components/ProductSelect/ProductSelect.tsx
+++ b/src/components/ProductSelect/ProductSelect.tsx
@@ -3,7 +3,7 @@ import {FC} from "react";
 import useProductsList from "../../pages/ProductsPage/hooks/useProductsList.tsx";
 import {omit} from "lodash";
 import ObjectSelect, {ObjectSelectProps} from "../ObjectSelect/ObjectSelect.tsx";
-import {ComboboxItem, OptionsFilter, SelectProps, Text, Tooltip} from "@mantine/core";
+import {ComboboxItem, OptionsFilter, SelectProps, Text, Tooltip, Image, rem} from "@mantine/core";
 import {getProductFields} from "../../types/utils.ts";
 
 type RestProps = {
@@ -20,14 +20,28 @@ const ProductSelect: FC<Props> = (props: Props) => {
         const product = products.find(product => product.id == parseInt(item.option.value));
         if (!product) return item.option.label;
         const productFields = getProductFields(product);
+        const imageUrl = product.images && product.images[0] ? product.images[0].imageUrl : undefined;
+
         return (
             <Tooltip
                 style={{whiteSpace: "pre-line"}}
                 multiline
                 disabled={productFields.length === 0}
-                label={productFields.map(([key, value]) => {
-                    return `${key.toString()}: ${value.toString()}`;
-                }).join('\n')}>
+                label={
+                    <>
+                        {productFields.map(([key, value]) => {
+                            return `${key.toString()}: ${value.toString()}`;
+                        }).join('\n')}
+                        {imageUrl && <Image
+                            src={imageUrl}
+                            alt={product.name}
+                            maw={rem(250)}
+                        />}
+
+                    </>
+
+
+                }>
                 <div>
                     {product.name}<br/>
                     {product.barcodes && <Text size={"xs"}>{product.barcodes[0]}</Text>}
diff --git a/src/pages/MarketplacesPage/modals/MarketplaceFormModal/MarketplaceAuthDataInput.tsx b/src/pages/MarketplacesPage/modals/MarketplaceFormModal/MarketplaceAuthDataInput.tsx
index 371ea4c..c5ae4dd 100644
--- a/src/pages/MarketplacesPage/modals/MarketplaceFormModal/MarketplaceAuthDataInput.tsx
+++ b/src/pages/MarketplacesPage/modals/MarketplaceFormModal/MarketplaceAuthDataInput.tsx
@@ -23,8 +23,6 @@ const MarketplaceAuthDataInput: FC<Props> = (props: Props) => {
 
     }
     const getOzonInputs = () => {
-        // return input that sets record "Client-Id" and "Api-Key" to value
-
         return (
             <>
                 <TextInput