Skip to content

Commit e6d0614

Browse files
author
Tom Softreck
committed
Release version 0.3.95
### Changes since v0.3.94
1 parent b0e7a88 commit e6d0614

File tree

5 files changed

+133
-40
lines changed

5 files changed

+133
-40
lines changed

‎web/Dockerfile‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,20 @@ COPY package*.json ./
77
RUN npm install
88

99
# Copy application code
10-
COPY .. .
10+
COPY . .
1111

1212
# Install global dependencies
1313
RUN npm install -g @babel/core @babel/preset-env @babel/preset-react eslint
1414

15+
# Create necessary directories
16+
RUN mkdir -p temp logs components
17+
1518
# Build the application
1619
RUN npm run build
1720

1821
# Expose ports for the web interface and development server
22+
# These will be overridden by the environment variables
1923
EXPOSE 80 3000
2024

2125
# Start the application
22-
CMD ["npm", "start"]
26+
CMD ["node", "server.js"]

‎web/docker-compose.yaml‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,21 @@ version: '3.8'
33
services:
44
reactstream-app:
55
build:
6-
context: ..
6+
context: .
77
dockerfile: Dockerfile
88
container_name: reactstream-app
99
ports:
10-
- "80:80"
11-
- "3000:3000"
10+
- "${SERVER_PORT:-80}:${SERVER_PORT:-80}"
11+
- "${DEV_SERVER_PORT:-3000}:${DEV_SERVER_PORT:-3000}"
1212
volumes:
1313
- ./components:/app/components
1414
- ./logs:/app/logs
15+
- ./temp:/app/temp
16+
env_file:
17+
- .env
1518
environment:
16-
- NODE_ENV=production
17-
- VIRTUAL_HOST=www.reactstream.com
19+
- NODE_ENV=${NODE_ENV:-production}
20+
- VIRTUAL_HOST=${VIRTUAL_HOST:-www.reactstream.com}
1821
restart: unless-stopped
1922
networks:
2023
- reactstream-network

‎web/package.json‎

Lines changed: 28 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -6,34 +6,38 @@
66
"scripts": {
77
"build": "webpack --mode production",
88
"start": "node server.js",
9-
"dev": "nodemon server.js"
9+
"dev": "nodemon server.js",
10+
"lint": "eslint .",
11+
"test": "jest"
1012
},
1113
"dependencies": {
12-
"@babel/core": "^7.26.10",
13-
"@babel/eslint-parser": "^7.27.0",
14-
"@babel/preset-env": "^7.26.9",
15-
"@babel/preset-react": "^7.26.3",
16-
"ace-builds": "^1.39.1",
17-
"body-parser": "^2.2.0",
18-
"chalk": "^5.4.1",
14+
"@babel/core": "^7.18.6",
15+
"@babel/eslint-parser": "^7.18.2",
16+
"@babel/preset-env": "^7.18.6",
17+
"@babel/preset-react": "^7.18.6",
18+
"ace-builds": "^1.10.0",
19+
"body-parser": "^1.20.0",
20+
"chalk": "^4.1.2",
1921
"cors": "^2.8.5",
20-
"eslint": "^9.23.0",
21-
"eslint-plugin-react": "^7.37.4",
22-
"eslint-plugin-react-hooks": "^5.2.0",
23-
"express": "^5.1.0",
24-
"monaco-editor": "^0.52.2",
25-
"react": "^19.1.0",
26-
"react-dom": "^19.1.0",
27-
"react-monaco-editor": "^0.58.0",
28-
"socket.io": "^4.8.1",
29-
"socket.io-client": "^4.8.1",
30-
"webpack": "^5.98.0",
31-
"webpack-cli": "^6.0.1"
22+
"dotenv": "^16.0.1",
23+
"eslint": "^8.19.0",
24+
"eslint-plugin-react": "^7.30.1",
25+
"eslint-plugin-react-hooks": "^4.6.0",
26+
"express": "^4.18.1",
27+
"monaco-editor": "^0.34.0",
28+
"react": "^18.2.0",
29+
"react-dom": "^18.2.0",
30+
"react-monaco-editor": "^0.50.1",
31+
"socket.io": "^4.5.1",
32+
"socket.io-client": "^4.5.1",
33+
"webpack": "^5.73.0",
34+
"webpack-cli": "^4.10.0"
3235
},
3336
"devDependencies": {
34-
"css-loader": "^7.1.2",
35-
"html-webpack-plugin": "^5.6.3",
36-
"nodemon": "^3.1.9",
37-
"style-loader": "^4.0.0"
37+
"css-loader": "^6.7.1",
38+
"html-webpack-plugin": "^5.5.0",
39+
"jest": "^28.1.3",
40+
"nodemon": "^2.0.19",
41+
"style-loader": "^3.3.1"
3842
}
3943
}

‎web/server.js‎

Lines changed: 75 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,37 @@ const fs = require('fs');
66
const { exec } = require('child_process');
77
const bodyParser = require('body-parser');
88
const cors = require('cors');
9+
require('dotenv').config();
910

1011
// Initialize Express app
1112
const app = express();
1213
const server = http.createServer(app);
13-
const io = socketIo(server);
14+
const io = socketIo(server, {
15+
cors: {
16+
origin: process.env.CORS_ORIGIN || '*',
17+
methods: ['GET', 'POST']
18+
}
19+
});
1420

1521
// Middleware
16-
app.use(cors());
22+
app.use(cors({
23+
origin: process.env.CORS_ORIGIN || '*'
24+
}));
1725
app.use(bodyParser.json());
1826
app.use(express.static(path.join(__dirname, 'dist')));
1927

2028
// Temporary file storage
21-
const TEMP_DIR = path.join(__dirname, 'temp');
29+
const TEMP_DIR = process.env.TEMP_DIR || path.join(__dirname, 'temp');
2230
if (!fs.existsSync(TEMP_DIR)) {
2331
fs.mkdirSync(TEMP_DIR);
2432
}
2533

34+
// Logs directory
35+
const LOGS_DIR = process.env.LOGS_DIR || path.join(__dirname, 'logs');
36+
if (!fs.existsSync(LOGS_DIR)) {
37+
fs.mkdirSync(LOGS_DIR);
38+
}
39+
2640
// Socket.IO connection
2741
io.on('connection', (socket) => {
2842
console.log('Client connected');
@@ -34,13 +48,29 @@ io.on('connection', (socket) => {
3448
// Save code to temporary file
3549
fs.writeFileSync(tempFile, code);
3650

51+
// Build command with environment variables
52+
const analyzeCommand = `reactstream analyze ${tempFile} ${
53+
process.env.VERBOSE_OUTPUT === 'true' ? '--verbose' : ''
54+
} ${
55+
process.env.AUTO_FIX === 'true' ? '--fix' : ''
56+
} ${
57+
process.env.ENABLE_DEBUG === 'true' ? '--debug' : ''
58+
}`;
59+
3760
// Run ReactStream analyze command
38-
exec(`reactstream analyze ${tempFile} --verbose`, (error, stdout, stderr) => {
61+
exec(analyzeCommand, (error, stdout, stderr) => {
3962
socket.emit('analysis-result', {
4063
output: stdout,
4164
error: stderr || (error ? error.message : null)
4265
});
4366

67+
// Log analysis results
68+
const timestamp = new Date().toISOString();
69+
fs.appendFileSync(
70+
path.join(LOGS_DIR, 'analysis.log'),
71+
`[${timestamp}] Analysis performed\n${stdout}\n${stderr || ''}\n\n`
72+
);
73+
4474
// Clean up temp file
4575
fs.unlinkSync(tempFile);
4676
});
@@ -54,14 +84,30 @@ io.on('connection', (socket) => {
5484
fs.writeFileSync(tempFile, code);
5585

5686
// Run ReactStream serve command (non-blocking)
57-
const serveProcess = exec(`reactstream serve ${tempFile} --port=3000`);
87+
const serveProcess = exec(
88+
`reactstream serve ${tempFile} --port=${process.env.DEV_SERVER_PORT || 3000}`
89+
);
5890

5991
serveProcess.stdout.on('data', (data) => {
6092
socket.emit('serve-output', { type: 'stdout', data });
93+
94+
// Log serve output
95+
const timestamp = new Date().toISOString();
96+
fs.appendFileSync(
97+
path.join(LOGS_DIR, 'serve.log'),
98+
`[${timestamp}] STDOUT: ${data}\n`
99+
);
61100
});
62101

63102
serveProcess.stderr.on('data', (data) => {
64103
socket.emit('serve-output', { type: 'stderr', data });
104+
105+
// Log serve errors
106+
const timestamp = new Date().toISOString();
107+
fs.appendFileSync(
108+
path.join(LOGS_DIR, 'serve.log'),
109+
`[${timestamp}] STDERR: ${data}\n`
110+
);
65111
});
66112

67113
socket.on('disconnect', () => {
@@ -80,7 +126,16 @@ app.post('/api/analyze', (req, res) => {
80126

81127
fs.writeFileSync(tempFile, code);
82128

83-
exec(`reactstream analyze ${tempFile} --verbose`, (error, stdout, stderr) => {
129+
// Build command with environment variables
130+
const analyzeCommand = `reactstream analyze ${tempFile} ${
131+
process.env.VERBOSE_OUTPUT === 'true' ? '--verbose' : ''
132+
} ${
133+
process.env.AUTO_FIX === 'true' ? '--fix' : ''
134+
} ${
135+
process.env.ENABLE_DEBUG === 'true' ? '--debug' : ''
136+
}`;
137+
138+
exec(analyzeCommand, (error, stdout, stderr) => {
84139
res.json({
85140
output: stdout,
86141
error: stderr || (error ? error.message : null)
@@ -90,13 +145,26 @@ app.post('/api/analyze', (req, res) => {
90145
});
91146
});
92147

148+
// Add this to server.js in the API routes section
149+
app.get('/api/config', (req, res) => {
150+
res.json({
151+
devServerPort: process.env.DEV_SERVER_PORT || 3000,
152+
debug: process.env.ENABLE_DEBUG === 'true',
153+
autoFix: process.env.AUTO_FIX === 'true',
154+
verbose: process.env.VERBOSE_OUTPUT === 'true'
155+
});
156+
});
157+
158+
93159
// Serve the main HTML file for all routes
94160
app.get('*', (req, res) => {
95161
res.sendFile(path.join(__dirname, 'dist', 'index.html'));
96162
});
97163

98164
// Start the server
99-
const PORT = process.env.PORT || 80;
165+
const PORT = process.env.SERVER_PORT || 80;
100166
server.listen(PORT, () => {
101167
console.log(`Server running on port ${PORT}`);
168+
console.log(`Environment: ${process.env.NODE_ENV}`);
169+
console.log(`Dev server port: ${process.env.DEV_SERVER_PORT || 3000}`);
102170
});

‎web/src/components/Preview.js‎

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,23 @@
1-
import React, { useRef, useEffect } from 'react';
1+
import React, { useRef, useEffect, useState } from 'react';
22

33
const Preview = ({ isServing }) => {
44
const iframeRef = useRef(null);
5+
const [devServerPort, setDevServerPort] = useState(3000);
56

67
useEffect(() => {
8+
// Get the development server port from the environment
9+
// This is passed to the client via a fetch request
10+
fetch('/api/config')
11+
.then(response => response.json())
12+
.then(config => {
13+
if (config.devServerPort) {
14+
setDevServerPort(config.devServerPort);
15+
}
16+
})
17+
.catch(error => {
18+
console.error('Failed to fetch config:', error);
19+
});
20+
721
// When component is unmounted, clear the iframe
822
return () => {
923
if (iframeRef.current) {
@@ -21,7 +35,7 @@ const Preview = ({ isServing }) => {
2135
) : (
2236
<iframe
2337
ref={iframeRef}
24-
src="http://localhost:3000"
38+
src={`http://localhost:${devServerPort}`}
2539
title="Component Preview"
2640
width="100%"
2741
height="100%"

0 commit comments

Comments
 (0)