Image Editor: upload image improved

app/ipc/upload_image.ts

@@ -2,13 +2,13 @@ import { ipcMain } from "electron";
 import path from "path";
 import fs from "fs";
 import crypto from "crypto";
-import { baseDir } from "../utils/constants";
+import { userDataDir } from "../utils/constants";
 
 export function setupUploadImage() {
   ipcMain.handle("upload-image", async (_, file: Buffer) => {
     try {
       // Create uploads directory if it doesn't exist
-      const uploadsDir = path.join(baseDir, "uploads");
+      const uploadsDir = path.join(userDataDir, "uploads");
       fs.mkdirSync(uploadsDir, { recursive: true });
 
       // Generate unique filename
@@ -19,7 +19,7 @@ export function setupUploadImage() {
       await fs.writeFileSync(filePath, file);
 
       // Return the relative path that can be used in the frontend
-      return `/uploads/${filename}`;
+      return filePath;
     } catch (error) {
       console.error("Error saving image:", error);
       throw error;

app/utils/constants.ts

@@ -4,7 +4,7 @@ import path from "path"
 export const localhost = "http://0.0.0.0"
 
 
-export const isDev = false;
+export const isDev = true;
 export const baseDir = app.getAppPath();
 export const fastapiDir = isDev ? path.join(baseDir, "servers/fastapi") : path.join(baseDir, "resources/fastapi");
 export const nextjsDir = isDev ? path.join(baseDir, "servers/nextjs") : path.join(baseDir, "resources/nextjs");

servers/nextjs/app/(presentation-generator)/components/ImageEditor.tsx

@@ -496,7 +496,7 @@ const ImageEditor = ({
 
           <div className="mt-6">
             <Tabs defaultValue="generate" className="w-full">
-              <TabsList className="grid bg-blue-100 border border-blue-300 w-full grid-cols-3">
+              <TabsList className="grid bg-blue-100 border border-blue-300 w-full grid-cols-2 mx-auto ">
                 <TabsTrigger className="font-medium" value="generate">
                   AI Generate
                 </TabsTrigger>
@@ -553,9 +553,7 @@ const ImageEditor = ({
                           <img
                             src={
                               image
-                                ? image.startsWith("user")
-                                  ? `${BASE_URL}${image}`
-                                  : image
+                                ? `file://${image}`
                                 : ""
                             }
                             alt={`Preview ${index + 1}`}
@@ -636,7 +634,7 @@ const ImageEditor = ({
                               className="cursor-pointer group w-full h-full"
                             >
                               <img
-                                src={uploadedImageUrl}
+                                src={`file://${uploadedImageUrl}`}
                                 alt="Uploaded preview"
                                 className="w-full h-full object-cover group-hover:scale-105 transition-transform"
                               />