Merge branch 'chatroom' into dbfunctions

http_server.js

@@ -0,0 +1,68 @@
+import express from 'express'
+import ViteExpress from 'vite-express'
+import { createServer } from 'http'
+import { Server } from 'socket.io'
+
+let messagesLog = [];
+
+const app = express();
+const httpServer = createServer(app);
+const io = new Server(httpServer, {
+  cors: {
+    origin: "http://localhost:3000",
+    methods: ["GET", "POST"]
+  }
+});
+
+
+app.use(express.static('dist'));
+
+
+io.on('connection', (socket) => {
+  console.log('a user connected');
+
+  // Handle joining a chatroom
+  socket.on('join-room', (room) => {
+    socket.join(room);
+  });
+
+  // Handle sending a message
+  socket.on('send-message', ({ room, message }) => {
+    const timestamp = new Date().toISOString();
+    console.log(`${room} (${timestamp}): ${message}`);
+
+    // Store the message details
+    const newMessage = {
+      message,
+      room,
+      timestamp
+    };
+    messagesLog.push(newMessage);
+
+    // Emit the new message to everyone in the room
+    io.to(room).emit('receive-message', newMessage);
+  });
+
+  // Handle the request for historical messages
+  socket.on('request-historical-messages', (room) => {
+    console.log("request-historical-messages");
+    const roomMessages = messagesLog.filter(msg => msg.room === room);
+    socket.emit('historical-messages', roomMessages);
+  });
+
+
+
+  socket.on('leave-room', (room) => {
+    socket.leave(room);
+  });
+
+  socket.on('disconnect', () => {
+    console.log('user disconnected');
+  });
+});
+
+httpServer.listen(3001, () => {
+  console.log('http server started');
+});
+
+ViteExpress.listen(app, 3000)

package.json

@@ -8,12 +8,14 @@
     "build": "vite build",
     "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
-    "start": "node server.js"
+    "start": "node http_server.js"
   },
   "dependencies": {
     "express": "^4.18.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "socket.io": "^4.7.2",
+    "socket.io-client": "^4.7.2",
     "vite-express": "^0.10.0"
   },
   "devDependencies": {

src/App.jsx

@@ -1,20 +1,28 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
+import { useState } from 'react';
+import Chat from './Chat';
 import './App.css'
 import LoginComponent from './LoginComponent';
 
 
 function App() {
-  const [count, setCount] = useState(0)
+  const [count, setCount] = useState(0);
+  const [selectedRoom, setSelectedRoom] = useState(null);
 
 return (
     <>
       <LoginComponent />
-      {/* ... other components ... */}
+      <div className="card">
+        <p>Select a chatroom:</p>
+        <select value={selectedRoom} onChange={(e) => setSelectedRoom(e.target.value)}>
+          <option value="">-- Select a room --</option>
+          <option value="Room1">Room1</option>
+          <option value="Room2">Room2</option>
+          {/* Add more rooms as needed */}
+        </select>
+        {selectedRoom && <Chat room={selectedRoom} />}
+      </div>
     </>
   );
 }
 
-export default App
-
+export default App;