Fill uploaded image name

pkirilin · Oct 26, 2024 · 84e88dc · 84e88dc
1 parent 76b41db
commit 84e88dc
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 7 deletions.
diff --git a/src/frontend/src/features/addNote/model/types.ts b/src/frontend/src/features/addNote/model/types.ts
@@ -1,3 +1,4 @@
 export interface Image {
+  name: string;
   base64: string;
 }
diff --git a/src/frontend/src/features/addNote/ui/ImagePreview.tsx b/src/frontend/src/features/addNote/ui/ImagePreview.tsx
@@ -27,10 +27,8 @@ export const ImagePreview: FC<Props> = ({ image, onRemove }) => (
           objectFit: 'cover',
         }}
       />
-      {/* TODO: add title */}
       <ImageListItemBar
-        title="Some image"
-        subtitle="Some info"
+        title={image.name}
         position="below"
         actionIcon={
           <Tooltip title="Remove uploaded image">

diff --git a/src/frontend/src/features/addNote/ui/SearchProductsOnImage.tsx b/src/frontend/src/features/addNote/ui/SearchProductsOnImage.tsx
@@ -27,10 +27,9 @@ export const SearchProductsOnImage: FC<Props> = ({ image }) => {
 
   const sendRecognizeRequest = useCallback(async (): Promise<void> => {
     const formData = new FormData();
-    // TODO: add file name and content type
-    formData.append('files', new File([image.base64], 'TEST.jpeg'));
+    formData.append('files', new File([image.base64], image.name));
     await recognize(formData);
-  }, [image.base64, recognize]);
+  }, [image.base64, image.name, recognize]);
 
   useEffect(() => {
     sendRecognizeRequest();

diff --git a/src/frontend/src/features/addNote/ui/UploadImageButton.tsx b/src/frontend/src/features/addNote/ui/UploadImageButton.tsx
@@ -10,6 +10,7 @@ export const UploadImageButton: FC = () => {
   const dispatch = useAppDispatch();
 
   const handleFileChange: ChangeEventHandler<HTMLInputElement> = event => {
+    // TODO: compress
     const file = event.target?.files?.item(0);
 
     if (file) {
@@ -20,7 +21,13 @@ export const UploadImageButton: FC = () => {
             'Image upload failed: expected a string, but received: ' + typeof reader.result,
           );
         }
-        dispatch(actions.imageUploaded({ base64: reader.result }));
+
+        dispatch(
+          actions.imageUploaded({
+            name: file.name,
+            base64: reader.result,
+          }),
+        );
       };
       reader.readAsDataURL(file);
     }