chore: remove unnecessary code

backend/server/src/SecureGitClient.ts

@@ -22,13 +22,13 @@ export class SecureGitClient {
 
     try {
       // Create a temporary directory
-      tempDir = fs.mkdtempSync(path.join(os.tmpdir(), 'git-push-'));
+      tempDir = fs.mkdtempSync(path.posix.join(os.tmpdir(), 'git-push-'));
       console.log(`Temporary directory created: ${tempDir}`);
 
       // Write files to the temporary directory
       console.log(`Writing ${fileData.length} files.`);
       for (const { id, data } of fileData) {
-        const filePath = path.join(tempDir, id);
+        const filePath = path.posix.join(tempDir, id);
         const dirPath = path.dirname(filePath);
       
         if (!fs.existsSync(dirPath)) {

backend/server/src/Terminal.ts

@@ -35,7 +35,6 @@ export class Terminal {
   async sendData(data: string) {
     if (this.pty) {
       await this.sandbox.pty.sendInput(this.pty.pid, new TextEncoder().encode(data));
-      await this.pty.wait();
     } else {
       console.log("Cannot send data because pty is not initialized.");
     }

backend/server/src/index.ts

@@ -159,8 +159,9 @@ io.on("connection", async (socket) => {
 
     await lockManager.acquireLock(data.sandboxId, async () => {
       try {
-        if (!containers[data.sandboxId]) {
-          containers[data.sandboxId] = await Sandbox.create({ timeoutMs: 1200000 });
+        // Start a new container if the container doesn't exist or it timed out.
+        if (!containers[data.sandboxId] || !(await containers[data.sandboxId].isRunning())) {
+          containers[data.sandboxId] = await Sandbox.create({ timeoutMs: 1200_000 });
           console.log("Created container ", data.sandboxId);
         }
       } catch (e: any) {
@@ -172,7 +173,7 @@ io.on("connection", async (socket) => {
     // Change the owner of the project directory to user
     const fixPermissions = async () => {
       await containers[data.sandboxId].commands.run(
-        `sudo chown -R user "${path.join(dirName, "projects", data.sandboxId)}"`
+        `sudo chown -R user "${path.posix.join(dirName, "projects", data.sandboxId)}"`
       );
     };
 
@@ -181,7 +182,7 @@ io.on("connection", async (socket) => {
     const containerFiles = containers[data.sandboxId].files;
     const promises = sandboxFiles.fileData.map(async (file) => {
       try {
-        const filePath = path.join(dirName, file.id);
+        const filePath = path.posix.join(dirName, file.id);
         const parentDirectory = path.dirname(filePath);
         if (!containerFiles.exists(parentDirectory)) {
           await containerFiles.makeDir(parentDirectory);
@@ -245,7 +246,7 @@ io.on("connection", async (socket) => {
         file.data = body;
 
         await containers[data.sandboxId].files.write(
-          path.join(dirName, file.id),
+          path.posix.join(dirName, file.id),
           body
         );
         fixPermissions();
@@ -267,8 +268,8 @@ io.on("connection", async (socket) => {
 
           await moveFile(
             containers[data.sandboxId].files,
-            path.join(dirName, fileId),
-            path.join(dirName, newFileId)
+            path.posix.join(dirName, fileId),
+            path.posix.join(dirName, newFileId)
           );
           fixPermissions();
 
@@ -360,7 +361,7 @@ io.on("connection", async (socket) => {
         const id = `projects/${data.sandboxId}/${name}`;
 
         await containers[data.sandboxId].files.write(
-          path.join(dirName, id),
+          path.posix.join(dirName, id),
           ""
         );
         fixPermissions();
@@ -397,7 +398,7 @@ io.on("connection", async (socket) => {
         const id = `projects/${data.sandboxId}/${name}`;
 
         await containers[data.sandboxId].files.makeDir(
-          path.join(dirName, id)
+          path.posix.join(dirName, id)
         );
 
         callback();
@@ -426,8 +427,8 @@ io.on("connection", async (socket) => {
 
         await moveFile(
           containers[data.sandboxId].files,
-          path.join(dirName, fileId),
-          path.join(dirName, newFileId)
+          path.posix.join(dirName, fileId),
+          path.posix.join(dirName, newFileId)
         );
         fixPermissions();
         await renameFile(fileId, newFileId, file.data);
@@ -449,7 +450,7 @@ io.on("connection", async (socket) => {
         if (!file) return;
 
         await containers[data.sandboxId].files.remove(
-          path.join(dirName, fileId)
+          path.posix.join(dirName, fileId)
         );
         sandboxFiles.fileData = sandboxFiles.fileData.filter(
           (f) => f.id !== fileId
@@ -476,7 +477,7 @@ io.on("connection", async (socket) => {
         await Promise.all(
           files.map(async (file) => {
             await containers[data.sandboxId].files.remove(
-              path.join(dirName, file)
+              path.posix.join(dirName, file)
             );
 
             sandboxFiles.fileData = sandboxFiles.fileData.filter(
@@ -531,9 +532,15 @@ io.on("connection", async (socket) => {
               rows: 20,
               //onExit: () => console.log("Terminal exited", id),
             });
-            await terminals[id].sendData(
-              `cd "${path.join(dirName, "projects", data.sandboxId)}"\rexport PS1='user> '\rclear\r`
-            );
+
+            const defaultDirectory = path.posix.join(dirName, "projects", data.sandboxId);
+            const defaultCommands = [
+              `cd "${defaultDirectory}"`,
+              "export PS1='user> '",
+              "clear"
+            ]
+            for (const command of defaultCommands) await terminals[id].sendData(command + "\r");
+
             console.log("Created terminal", id);
           } catch (e: any) {
             console.error(`Error creating terminal ${id}:`, e);
@@ -568,7 +575,7 @@ io.on("connection", async (socket) => {
           return;
         }
 
-        terminals[id].sendData(data);
+        await terminals[id].sendData(data);
       } catch (e: any) {
         console.error("Error writing to terminal:", e);
         io.emit("error", `Error: writing to terminal. ${e.message ?? e}`);

frontend/components/editor/index.tsx

@@ -70,6 +70,8 @@ export default function CodeEditor({
   const [activeFileId, setActiveFileId] = useState<string>("")
   const [activeFileContent, setActiveFileContent] = useState("")
   const [deletingFolderId, setDeletingFolderId] = useState("")
+  // Added this state to track the most recent content for each file
+  const [fileContents, setFileContents] = useState<Record<string, string>>({});
 
   // Editor state
   const [editorLanguage, setEditorLanguage] = useState("plaintext")
@@ -257,6 +259,7 @@ export default function CodeEditor({
       }
     })
   }, [editorRef])
+
   // Generate widget effect
   useEffect(() => {
     if (generate.show) {
@@ -335,6 +338,7 @@ export default function CodeEditor({
       })
     }
   }, [generate.show])
+  
   // Suggestion widget effect
   useEffect(() => {
     if (!suggestionRef.current || !editorRef) return
@@ -378,11 +382,20 @@ export default function CodeEditor({
     }
 
     const model = editorRef?.getModel()
-    const line = model?.getLineContent(cursorLine)
-
-    if (line === undefined || line.trim() !== "") {
-      decorations.instance?.clear()
-      return
+    // added this because it was giving client side exception - Illegal value for lineNumber when opening an empty file
+    if (model) {
+      const totalLines = model.getLineCount();
+      // Check if the cursorLine is a valid number, If cursorLine is out of bounds, we fall back to 1 (the first line) as a default safe value.
+      const lineNumber = cursorLine > 0 && cursorLine <= totalLines ? cursorLine : 1; // fallback to a valid line number
+      // If for some reason the content doesn't exist, we use an empty string as a fallback.
+      const line = model.getLineContent(lineNumber) ?? "";
+      // Check if the line is not empty or only whitespace (i.e., `.trim()` removes spaces).
+      // If the line has content, we clear any decorations using the instance of the `decorations` object.
+      // Decorations refer to editor highlights, underlines, or markers, so this clears those if conditions are met.
+      if (line.trim() !== "") {
+        decorations.instance?.clear();
+        return
+      }
     }
 
     if (decorations.instance) {
@@ -401,25 +414,33 @@ export default function CodeEditor({
   }, [decorations.options])
 
   // Save file keybinding logic effect
+  // Function to save the file content after a debounce period
   const debouncedSaveData = useCallback(
-    debounce((value: string | undefined, activeFileId: string | undefined) => {
-      setTabs((prev) =>
-        prev.map((tab) =>
-          tab.id === activeFileId ? { ...tab, saved: true } : tab
-        )
-      )
-      console.log(`Saving file...${activeFileId}`)
-      console.log(`Saving file...${value}`)
-      socket?.emit("saveFile", activeFileId, value)
-    }, Number(process.env.FILE_SAVE_DEBOUNCE_DELAY) || 1000),
-    [socket]
-  )
+    debounce((activeFileId: string | undefined) => {
+      if (activeFileId) {
+        // Get the current content of the file
+        const content = fileContents[activeFileId];
 
+        // Mark the file as saved in the tabs
+        setTabs((prev) =>
+          prev.map((tab) =>
+            tab.id === activeFileId ? { ...tab, saved: true } : tab
+          )
+        );
+        console.log(`Saving file...${activeFileId}`);
+        console.log(`Saving file...${content}`);
+        socket?.emit("saveFile", activeFileId, content);
+      }
+    }, Number(process.env.FILE_SAVE_DEBOUNCE_DELAY) || 1000),
+    [socket, fileContents]
+  );
+
+  // Keydown event listener to trigger file save on Ctrl+S or Cmd+S
   useEffect(() => {
     const down = (e: KeyboardEvent) => {
       if (e.key === "s" && (e.metaKey || e.ctrlKey)) {
         e.preventDefault()
-        debouncedSaveData(editorRef?.getValue(), activeFileId)
+        debouncedSaveData(activeFileId);
       }
     }
     document.addEventListener("keydown", down)
@@ -516,7 +537,7 @@ export default function CodeEditor({
 
   // Socket event listener effect
   useEffect(() => {
-    const onConnect = () => {}
+    const onConnect = () => { }
 
     const onDisconnect = () => {
       setTerminals([])
@@ -586,31 +607,46 @@ export default function CodeEditor({
   } // 300ms debounce delay, adjust as needed
 
   const selectFile = (tab: TTab) => {
-    if (tab.id === activeFileId) return
-
-    setGenerate((prev) => ({ ...prev, show: false }))
-
-    const exists = tabs.find((t) => t.id === tab.id)
+    if (tab.id === activeFileId) return;
+  
+    setGenerate((prev) => ({ ...prev, show: false }));
+  
+    // Check if the tab already exists in the list of open tabs
+    const exists = tabs.find((t) => t.id === tab.id);
     setTabs((prev) => {
       if (exists) {
-        setActiveFileId(exists.id)
-        return prev
+        // If the tab exists, make it the active tab
+        setActiveFileId(exists.id);
+        return prev;
       }
-      return [...prev, tab]
-    })
-
-    if (fileCache.current.has(tab.id)) {
-      setActiveFileContent(fileCache.current.get(tab.id))
+      // If the tab doesn't exist, add it to the list of tabs and make it active
+      return [...prev, tab];
+    });
+  
+    // If the file's content is already cached, set it as the active content
+    if (fileContents[tab.id]) {
+      setActiveFileContent(fileContents[tab.id]);
     } else {
-      debouncedGetFile(tab.id, (response: SetStateAction<string>) => {
-        fileCache.current.set(tab.id, response)
-        setActiveFileContent(response)
-      })
+      // Otherwise, fetch the content of the file and cache it
+      debouncedGetFile(tab.id, (response: string) => {
+        setFileContents(prev => ({ ...prev, [tab.id]: response }));
+        setActiveFileContent(response);
+      });
     }
+  
+    // Set the editor language based on the file type
+    setEditorLanguage(processFileType(tab.name));
+    // Set the active file ID to the new tab
+    setActiveFileId(tab.id);
+  };
 
-    setEditorLanguage(processFileType(tab.name))
-    setActiveFileId(tab.id)
-  }
+  // Added this effect to update fileContents when the editor content changes
+  useEffect(() => {
+    if (activeFileId) {
+      // Cache the current active file content using the file ID as the key
+      setFileContents(prev => ({ ...prev, [activeFileId]: activeFileContent }));
+    }
+  }, [activeFileContent, activeFileId]);
 
   // Close tab and remove from tabs
   const closeTab = (id: string) => {
@@ -626,8 +662,8 @@ export default function CodeEditor({
         ? numTabs === 1
           ? null
           : index < numTabs - 1
-          ? tabs[index + 1].id
-          : tabs[index - 1].id
+            ? tabs[index + 1].id
+            : tabs[index - 1].id
         : activeFileId
 
     setTabs((prev) => prev.filter((t) => t.id !== id))
@@ -720,7 +756,7 @@ export default function CodeEditor({
         <DisableAccessModal
           message={disableAccess.message}
           open={disableAccess.isDisabled}
-          setOpen={() => {}}
+          setOpen={() => { }}
         />
         <Loading />
       </>
@@ -759,8 +795,8 @@ export default function CodeEditor({
                 code:
                   (isSelected && editorRef?.getSelection()
                     ? editorRef
-                        ?.getModel()
-                        ?.getValueInRange(editorRef?.getSelection()!)
+                      ?.getModel()
+                      ?.getValueInRange(editorRef?.getSelection()!)
                     : editorRef?.getValue()) ?? "",
                 line: generate.line,
               }}
@@ -784,11 +820,11 @@ export default function CodeEditor({
                     const afterLineNumber = isAbove ? line - 1 : line
                     id = changeAccessor.addZone({
                       afterLineNumber,
-                      heightInLines: isAbove?11: 12,
+                      heightInLines: isAbove ? 11 : 12,
                       domNode: generateRef.current,
                     })
-                    const contentWidget= generate.widget
-                    if (contentWidget){
+                    const contentWidget = generate.widget
+                    if (contentWidget) {
                       editorRef?.layoutContentWidget(contentWidget)
                     }
                   } else {
@@ -885,58 +921,62 @@ export default function CodeEditor({
                   </div>
                 </>
               ) : // Note clerk.loaded is required here due to a bug: https://github.com/clerk/javascript/issues/1643
-              clerk.loaded ? (
-                <>
-                  {provider && userInfo ? (
-                    <Cursors yProvider={provider} userInfo={userInfo} />
-                  ) : null}
-                  <Editor
-                    height="100%"
-                    language={editorLanguage}
-                    beforeMount={handleEditorWillMount}
-                    onMount={handleEditorMount}
-                    onChange={(value) => {
-                      if (value === activeFileContent) {
-                        setTabs((prev) =>
-                          prev.map((tab) =>
-                            tab.id === activeFileId
-                              ? { ...tab, saved: true }
-                              : tab
+                clerk.loaded ? (
+                  <>
+                    {provider && userInfo ? (
+                      <Cursors yProvider={provider} userInfo={userInfo} />
+                    ) : null}
+                    <Editor
+                      height="100%"
+                      language={editorLanguage}
+                      beforeMount={handleEditorWillMount}
+                      onMount={handleEditorMount}
+                      onChange={(value) => {
+                        // If the new content is different from the cached content, update it
+                        if (value !== fileContents[activeFileId]) {
+                            setActiveFileContent(value ?? ""); // Update the active file content
+                          // Mark the file as unsaved by setting 'saved' to false
+                          setTabs((prev) =>
+                            prev.map((tab) =>
+                              tab.id === activeFileId
+                                ? { ...tab, saved: false }
+                                : tab
+                            )
                           )
-                        )
-                      } else {
-                        setTabs((prev) =>
-                          prev.map((tab) =>
-                            tab.id === activeFileId
-                              ? { ...tab, saved: false }
-                              : tab
+                        } else {
+                          // If the content matches the cached content, mark the file as saved
+                          setTabs((prev) =>
+                            prev.map((tab) =>
+                              tab.id === activeFileId
+                                ? { ...tab, saved: true }
+                                : tab
+                            )
                           )
-                        )
-                      }
-                    }}
-                    options={{
-                      tabSize: 2,
-                      minimap: {
-                        enabled: false,
-                      },
-                      padding: {
-                        bottom: 4,
-                        top: 4,
-                      },
-                      scrollBeyondLastLine: false,
-                      fixedOverflowWidgets: true,
-                      fontFamily: "var(--font-geist-mono)",
-                    }}
-                    theme="vs-dark"
-                    value={activeFileContent}
-                  />
-                </>
-              ) : (
-                <div className="w-full h-full flex items-center justify-center text-xl font-medium text-muted-foreground/50 select-none">
-                  <Loader2 className="animate-spin w-6 h-6 mr-3" />
-                  Waiting for Clerk to load...
-                </div>
-              )}
+                        }
+                      }}
+                      options={{
+                        tabSize: 2,
+                        minimap: {
+                          enabled: false,
+                        },
+                        padding: {
+                          bottom: 4,
+                          top: 4,
+                        },
+                        scrollBeyondLastLine: false,
+                        fixedOverflowWidgets: true,
+                        fontFamily: "var(--font-geist-mono)",
+                      }}
+                      theme="vs-dark"
+                      value={activeFileContent}
+                    />
+                  </>
+                ) : (
+                  <div className="w-full h-full flex items-center justify-center text-xl font-medium text-muted-foreground/50 select-none">
+                    <Loader2 className="animate-spin w-6 h-6 mr-3" />
+                    Waiting for Clerk to load...
+                  </div>
+                )}
             </div>
           </ResizablePanel>
           <ResizableHandle />

frontend/components/editor/navbar/run.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import React, { useEffect, useRef } from 'react';
 import { Play, StopCircle } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { useTerminal } from "@/context/TerminalContext";
@@ -16,53 +17,57 @@ export default function RunButtonModal({
   setIsRunning: (running: boolean) => void;
   sandboxData: Sandbox;
 }) {
-  const { createNewTerminal, terminals, closeTerminal } = useTerminal();
+  const { createNewTerminal, closeTerminal, terminals } = useTerminal();
   const { setIsPreviewCollapsed, previewPanelRef } = usePreview();
+  // Ref to keep track of the last created terminal's ID
+  const lastCreatedTerminalRef = useRef<string | null>(null);
 
-  const handleRun = () => {
-    if (isRunning) {
-      console.log('Stopping sandbox...');
-      console.log('Closing Preview Window');
-
-      terminals.forEach(term => {
-        if (term.terminal) {
-          closeTerminal(term.id);
-          console.log('Closing Terminal', term.id);
-        }
-      });
-
-      setIsPreviewCollapsed(true);
-      previewPanelRef.current?.collapse();
-    } else {
-      console.log('Running sandbox...');
-      console.log('Opening Terminal');
-      console.log('Opening Preview Window');
-
-      if (terminals.length < 4) {
-        if (sandboxData.type === "streamlit") {
-          createNewTerminal(
-            "pip install -r requirements.txt && streamlit run main.py --server.runOnSave true"
-          );
-        } else {
-          createNewTerminal("yarn install && yarn dev");
-        }
-      } else {
-        toast.error("You reached the maximum # of terminals.");
-        console.error("Maximum number of terminals reached.");
+  // Effect to update the lastCreatedTerminalRef when a new terminal is added
+  useEffect(() => {
+    if (terminals.length > 0 && !isRunning) {
+      const latestTerminal = terminals[terminals.length - 1];
+      if (latestTerminal && latestTerminal.id !== lastCreatedTerminalRef.current) {
+        lastCreatedTerminalRef.current = latestTerminal.id;
       }
-
-      setIsPreviewCollapsed(false);
-      previewPanelRef.current?.expand();
     }
+  }, [terminals, isRunning]);
+
+  const handleRun = async () => {
+    if (isRunning && lastCreatedTerminalRef.current) 
+      {
+        await closeTerminal(lastCreatedTerminalRef.current);
+        lastCreatedTerminalRef.current = null;
+        setIsPreviewCollapsed(true);
+        previewPanelRef.current?.collapse();
+      } 
+    else if (!isRunning && terminals.length < 4) 
+      {
+      const command = sandboxData.type === "streamlit"
+        ? "pip install -r requirements.txt && streamlit run main.py --server.runOnSave true"
+        : "yarn install && yarn dev";
+      
+      try {
+        // Create a new terminal with the appropriate command
+        await createNewTerminal(command);
+        setIsPreviewCollapsed(false);
+        previewPanelRef.current?.expand();
+      } catch (error) {
+        toast.error("Failed to create new terminal.");
+        console.error("Error creating new terminal:", error);
+        return;
+      }
+    } else if (!isRunning) {
+      toast.error("You've reached the maximum number of terminals.");
+      return;
+    }
+
     setIsRunning(!isRunning);
   };
 
   return (
-    <>
-      <Button variant="outline" onClick={handleRun}>
-        {isRunning ? <StopCircle className="w-4 h-4 mr-2" /> : <Play className="w-4 h-4 mr-2" />}
-        {isRunning ? 'Stop' : 'Run'}
-      </Button>
-    </>
+    <Button variant="outline" onClick={handleRun}>
+      {isRunning ? <StopCircle className="w-4 h-4 mr-2" /> : <Play className="w-4 h-4 mr-2" />}
+      {isRunning ? 'Stop' : 'Run'}
+    </Button>
   );
 }