Merge pull request #20 from sotopia-lab/moving_server

Moving server

.gitignore

@@ -1,9 +1,10 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies
-/node_modules
+node_modules/
 /.pnp
 .pnp.js
+.yarn/install-state.gz
 
 # testing
 /coverage
@@ -41,4 +42,36 @@ yarn-error.log*
 .vercel
 
 #used files
-_*
+_*
+*.pem
+*.tsbuildinfo
+next-env.d.ts
+__pycache__/
+*.py[cod]
+*$py.class
+*.so
+.Python
+.env
+.venv
+env/
+venv/
+ENV/
+.python-version
+.ruff_cache/
+.mypy_cache/
+
+# IDE
+.idea/
+.vscode/
+*.swp
+*.swo
+
+# Logs
+logs/
+*.log
+
+# Lock files
+package-lock.json
+yarn.lock
+bun.lockb
+uv.lock

backend/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "cotomata-backend",
+  "version": "1.0.0",
+  "description": "Backend server for Cotomata",
+  "main": "src/server.js",
+  "type": "module",
+  "scripts": {
+    "start": "bun src/server.js",
+    "dev": "bun --watch src/server.js"
+  },
+  "dependencies": {
+    "cors": "^2.8.5",
+    "express": "^4.18.2",
+    "redis": "^4.6.12",
+    "socket.io": "^4.8.1"
+  }
+} 

frontend/server.js → backend/src/server.js

@@ -1,11 +1,6 @@
-import { createServer } from 'http';
 import { Server } from 'socket.io';
 import { createClient } from 'redis';
-import next from 'next';
-
-const dev = process.env.NODE_ENV !== 'production';
-const app = next({ dev });
-const handle = app.getRequestHandler();
+import { createServer } from 'http';
 
 // Redis client configuration
 const redisClient = createClient({
@@ -15,19 +10,28 @@ const redisClient = createClient({
 // Allowed channels for Redis pub/sub 
 const allowedChannels = ['Scene:Jack', 'Scene:Jane', 'Human:Jack', 'Jack:Human', 'Agent:Runtime', 'Runtime:Agent'];
 
-app.prepare().then(async () => {
-  // Connect Redis client
-  redisClient.on('error', (err) => {
-    console.error('Redis error:', err);
-  });
+// Connect Redis client
+redisClient.on('error', (err) => {
+  console.error('Redis error:', err);
+});
+
+const init = async () => {
   await redisClient.connect();
 
   // Create HTTP server
-  const server = createServer((req, res) => {
-    handle(req, res);
+  const httpServer = createServer((req, res) => {
+    res.setHeader('Access-Control-Allow-Origin', '*');
+    res.writeHead(200);
+    res.end('Socket.IO server running');
+  });
+
+  // Initialize Socket.IO server with CORS
+  const io = new Server(httpServer, {
+    cors: {
+      origin: "http://localhost:3000",
+      methods: ["GET", "POST"]
+    }
   });
-  // Initialize Socket.IO server
-  const io = new Server(server);
 
   // Redis subscriber setup
   const subscriber = redisClient.duplicate();
@@ -107,6 +111,7 @@ app.prepare().then(async () => {
 
     // Handle process initialization
     socket.on('init_process', async () => {
+      console.log('Received init_process request');
       try {
         const initParams = {
           node_name: "openhands_node",
@@ -149,11 +154,10 @@ app.prepare().then(async () => {
   });
 
   // Start the server
-  const port = process.env.PORT || 3000;
-  server.listen(port, (err) => {
-    if (err) throw err;
-    console.log(`> Ready on http://localhost:3000`);
+  const port = process.env.PORT || 8000;
+  httpServer.listen(port, () => {
+    console.log(`> Backend server ready on http://localhost:${port}`);
   });
-});
+};
 
-export default app;
+init().catch(console.error); 

frontend/components/sidebar.tsx

@@ -15,30 +15,8 @@
 //  */
 
 import React from 'react';
-import { Cog, FolderOpen } from 'lucide-react'; // Import the file icon
-
-// Define the props for the Sidebar component
-interface SidebarProps {
-    onSelect: (option: 'fileSystem' | 'sceneContext') => void; // Callback for selecting a panel
-}
-
-// // Main Sidebar component definition
-// export const Sidebar: React.FC<SidebarProps> = ({ onSelect }) => {
-//   return (
-//     <div className="sidebar">
-//       {/* Button to select the file system panel */}
-//       <button className="sidebar-button" onClick={() => onSelect('fileSystem')}>
-//         <FolderOpen size={24} /> {/* Icon for file system */}
-//       </button>
-//       {/* Button to select the scene context panel */}
-//       <button className="sidebar-button" onClick={() => onSelect('sceneContext')}>
-//         <Cog size={24} /> {/* Icon for scene context */}
-//       </button>
-//       {/* Add more icons as needed */}
-//     </div>
-//   );
-// };
-
+import { Cog, FolderOpen, Home, RefreshCcw } from 'lucide-react';
+import Link from 'next/link';
 
 import {
   Sidebar,
@@ -65,11 +43,10 @@ const items = [
   },
 ]
 
-
 export function AppSidebar() {
   return (
     <Sidebar>
-      <SidebarContent>
+      <SidebarContent className="flex flex-col h-full">
         <SidebarGroup>
           <SidebarGroupContent>
             <SidebarMenu>
@@ -86,6 +63,19 @@ export function AppSidebar() {
             </SidebarMenu>
           </SidebarGroupContent>
         </SidebarGroup>
+
+        {/* Refresh button at the bottom */}
+        <div className="mt-auto mb-4">
+          <SidebarMenu>
+            <SidebarMenuItem>
+              <SidebarMenuButton asChild>
+                <Link href="/" className="flex items-center justify-center gap-2">
+                  <RefreshCcw />
+                </Link>
+              </SidebarMenuButton>
+            </SidebarMenuItem>
+          </SidebarMenu>
+        </div>
       </SidebarContent>
     </Sidebar>
   )

frontend/context/loading-provider.tsx

@@ -28,7 +28,7 @@ export function LoadingProvider({ children }: { children: React.ReactNode }) {
     const initialize = async () => {
       try {
         console.log('Creating socket instance...');
-        socketInstance = io('http://localhost:3000', {
+        socketInstance = io('http://localhost:8000', {
           transports: ['websocket'],
           reconnection: true,
           autoConnect: true

frontend/package.json

@@ -3,9 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "bun server.js",
+    "dev": "next dev",
     "build": "next build",
-    "start": "BUN_ENV=production bun server.js",
+    "start": "next start",
     "lint": "next lint"
   },
   "dependencies": {

package.json

@@ -0,0 +1,12 @@
+{
+  "name": "cotomata-root",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "concurrently \"cd backend && bun run dev\" \"cd frontend && bun run dev\"",
+    "install:all": "cd backend && bun install && cd ../frontend && bun install"
+  },
+  "devDependencies": {
+    "concurrently": "^8.2.2"
+  }
+}