new features

client/src/pages/homepage/index.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import Button from "../../components/button";
 import bgImage from "../../assets/leaf-bg.png";
 

client/src/pages/upload/index.tsx

@@ -1,6 +1,6 @@
 import React, { useCallback, useState } from "react";
 import axios from "axios";
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, UseMutationResult } from "@tanstack/react-query";
 import Button from "../../components/button";
 import bgImage from "../../assets/leaf-bg.png";
 import { LeafResponse } from "../../typings";
@@ -9,26 +9,21 @@ const uploadImage = async (file: File): Promise<LeafResponse> => {
   const formData = new FormData();
   formData.append("image", file);
 
-  const response = await axios.post(
-    `/api/images/upload`,
-    formData,
-    {
-      headers: {
-        "Content-Type": "multipart/form-data",
-      },
-    }
-  );
+  const response = await axios.post(`/api/images/upload`, formData, {
+    headers: {
+      "Content-Type": "multipart/form-data",
+    },
+  });
 
   return response.data;
 };
 
 const ImageUpload: React.FC = () => {
   const [selectedFile, setSelectedFile] = useState<File | null>(null);
   const [modalVisible, setModalVisible] = useState(false);
-  const [classificationResult, setClassificationResult] =
-    useState<LeafResponse | null>(null);
+  const [classificationResult, setClassificationResult] = useState<LeafResponse | null>(null);
 
-  const mutation = useMutation<LeafResponse, Error, File>({
+  const mutation: UseMutationResult<LeafResponse, Error, File> = useMutation({
     mutationFn: uploadImage,
     onSuccess: (data) => {
       console.log("Upload success:", data);
@@ -137,10 +132,6 @@ const ImageUpload: React.FC = () => {
               Leaf Classification Result
             </h2>
 
-            {/* <p className="mb-2">
-              <strong>Species:</strong> {classificationResult.leaf.species}
-            </p> */}
-
             <img
               src={`${classificationResult.leaf.imageUrl}`}
               alt="Leaf"
@@ -169,4 +160,4 @@ const ImageUpload: React.FC = () => {
   );
 };
 
-export default ImageUpload;
+export default ImageUpload;

client/tsconfig.json

@@ -1,4 +1,5 @@
 {
+
   "files": [],
   "references": [
     { "path": "./tsconfig.app.json" },