done

ef-ui/dist/index.html

@@ -45,7 +45,7 @@
 
 
 
-   <script type="module" crossorigin src="/assets/index-CJacNAWv.js"></script>
+   <script type="module" crossorigin src="/assets/index-7mv97drX.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-iEl-il0E.css">
  </head>
 

ef-ui/src/components/Addproperty.jsx

@@ -28,7 +28,7 @@ const Addproperty = () => {
     propertyTaxInfo: [
       { propertytaxowned: "0", ownedyear: "0", taxassessed: "0", taxyear: "0" },
     ],
-    images: [{ title: "", file: "" }], // Array to hold image objects
+    images: [{ title: "", file: "" }], 
     googleMapLink: "", // Field for Google Maps link
     renovationRisk: null,
     purchaseCost: "0",
@@ -129,6 +129,7 @@ const Addproperty = () => {
   const [submitted, setSubmitted] = useState(false);
 
   const handleImageChange = (file, index) => {
+    console.log("File received:", file); // Debugging log to check the file object
     const updatedImages = [...formData.images];
     updatedImages[index].file = file.base64; // store base64 format of image
     setFormData({ ...formData, images: updatedImages });
@@ -1784,54 +1785,60 @@ const Addproperty = () => {
                 Upload Images{" "}
               </h3>
               <form>
-                {formData.images.map((image, index) => (
-                  <div key={index} className="row gy-3 align-items-center">
-                    <div className="col-md-4">
-                      <input
-                        type="text"
-                        className="form-control"
-                        value={image.title}
-                        placeholder="Image Title"
-                        onChange={(e) => handleImageTitleChange(index, e)}
-                      />
-                    </div>
-                    <div className="col-md-4 d-flex align-items-center">
-                      <FileBase64
-                        multiple={false}
-                        onDone={(file) => handleImageChange(file, index)}
-                      />
-                      <button
-                        type="button"
-                        className="btn btn-danger"
-                        onClick={() => handleDeleteImage(index)}
-                        style={{
-                          marginLeft: "5px", // Adjust this to minimize space between the buttons
-                        }}
-                      >
-                        Delete
-                      </button>
-                    </div>
+              {formData.images.map((image, index) => (
+        <div key={index} className="row gy-3 align-items-center">
+          <div className="col-md-4">
+            <input
+              type="text"
+              className="form-control"
+              value={image.title}
+              placeholder="Image Title"
+              onChange={(e) => handleImageTitleChange(index, e)}
+            />
+          </div>
+          <div className="col-md-4 d-flex align-items-center">
+            <FileBase64
+              multiple={false}
+              onDone={(file) => handleImageChange(file, index)}
+            />
+            <button
+              type="button"
+              className="btn btn-danger"
+              onClick={() => handleDeleteImage(index)}
+              style={{
+                marginLeft: "5px", 
+              }}
+            >
+              Delete
+            </button>
+          </div>
 
-                    {image.file && (
-                      <div className="col-md-12">
-                        <img
-                          src={image.file}
-                          alt="uploaded"
-                          style={{ width: "150px", height: "150px" }}
-                        />
-                      </div>
-                    )}
-                  </div>
-                ))}
+          {/* Check if image.file contains valid base64 data */}
+          {image.file && (
+            <>
+              <p>Base64 Data:</p> {/* Debugging base64 data */}
+              <pre>{image.file.slice(0, 100)}...</pre> {/* Display first 100 characters for debugging */}
 
-                <button
-                  type="button"
-                  className="btn btn-primary"
-                  onClick={handleAddImage}
-                  style={{ backgroundColor: "#fda417", border: "#fda417" }}
-                >
-                  + Add Image
-                </button>
+              <div className="col-md-12">
+                <img
+                  src={image.file}
+                  alt="uploaded"
+                  style={{ width: "150px", height: "150px", objectFit: "cover" }}
+                />
+              </div>
+            </>
+          )}
+        </div>
+      ))}
+
+      <button
+        type="button"
+        className="btn btn-primary"
+        onClick={handleAddImage}
+        style={{ backgroundColor: "#fda417", border: "#fda417" }}
+      >
+        + Add Image
+      </button>
 
                 <hr
                   style={{

ef-ui/src/components/UserProperties.jsx

@@ -34,7 +34,7 @@ const UserProperties = () => {
                     <div className="row p-2 bg-white border rounded mt-2">
                       <div className="col-md-3 mt-1">
                         <img
-                          src={propertydummy}
+                          src={property.images[0].file || propertydummy}
                           className="w-70"
                           alt="Img"
                           style={{