Store image data and remove url from schema

Backend/backend.py

@@ -10,7 +10,7 @@
 import requests
 from flask_cors import CORS, cross_origin
 
-from mongoengine import connect, Document, StringField, DoesNotExist
+from mongoengine import connect, Document, StringField, BinaryField, DoesNotExist
 from werkzeug.security import generate_password_hash, check_password_hash
 import secrets  # For generating a session key
 
@@ -20,6 +20,8 @@
 from db_access import Image
 from db_access import check_user, create_user, db_connect, get_image, create_image
 
+import base64
+
 
 app = Flask(__name__)
 cors = CORS(app)
@@ -91,11 +93,13 @@ def store_image():
         if field not in data:
             return jsonify({"error": f"Missing field: {field}"}), 400
 
+    image_res = requests.get(data["url"])
+
     # Prepare the data for creating an image
     image_data = {
         "creator": current_user,  # Assuming the creator is the logged-in user
         "prompt": data["prompt"],
-        "url": data["url"]
+        "data": image_res.content
     }
 
     # Call the create_image function from db_access
@@ -118,15 +122,15 @@ def fetch_portfolio():
         user = get_jwt_identity()
 
         # Fetch all images created by this user
-        user_images = Image.objects(creator=user)
+        portfolio_images = User.objects.get(pk=user).portfolio
 
         # Format the response with the list of images
         portfolio = [{
             "image_id": str(image.id),
             "prompt": image.prompt,
-            "url": image.url,
-            "creator": user
-        } for image in user_images]
+            "creator": user,
+            "data": base64.b64encode(image.data).decode("ascii")
+        } for image in portfolio_images]
 
         return jsonify(portfolio), 200
 

Backend/db_access.py

@@ -4,6 +4,7 @@
     connect,
     Document,
     StringField,
+    BinaryField,
     IntField,
     ListField,
     ReferenceField,
@@ -47,8 +48,8 @@ class User(Document):
 
 class Image(Document):
     creator = ReferenceField(User, required=True)
-    url = StringField(required=True)
     prompt = StringField(required=True)
+    data = BinaryField(required=True)
 
     meta = {"collection": "images"}
 
@@ -60,7 +61,6 @@ def create_user(data):
         encrypted_password=data["password"],
         email=data["email"],
         portfolio=[]  # Initialize an empty portfolio
-
     )
     try:
         user.save()
@@ -95,12 +95,14 @@ def create_image(data):
         image = Image(
             creator=data["creator"],
             prompt=data["prompt"],
-            url=data["url"]
+            data=data["data"]
         )
         image.save()
+
+        creator = User.objects.get(pk=data["creator"])
 
         # Optionally, you can also append this image to the user's portfolio here
-        #creator.update(push__portfolio=image)
+        creator.update(push__portfolio=image)
 
         return Response("Image created successfully!", 201)
     except DoesNotExist:

Frontend/src/pages/portfolio.js

@@ -16,7 +16,6 @@ export default function Portfolio() {
             "Authorization": `Bearer ${Cookie.get("token")}`
           }
         }).then(response => {
-          console.log(response.data);
           setPortfolio(response.data);
         }).catch((error) => console.error("Error: ", error));
     }
@@ -28,11 +27,10 @@ export default function Portfolio() {
       <h1 className="text-2xl mb-4">Portfolio</h1>
       <div className="grid grid-cols-3 gap-4">
         {portfolio && portfolio.map((image) =>
-            <Image
-                loader={() => image.url}
-                src={image.url}
-                width={500}
-                height={500}
+            <Image src={"data:image/png;base64, " + image.data}
+               loader={() => image.url}
+               height={500}
+               width={500}
             />)}
       </div>
     </div>