Atlas/server.js at main · jaykumar14921/Atlas · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
// server.js
import express from 'express';
import cors from 'cors';
import dotenv from 'dotenv';
import multer from 'multer';
import Anthropic from '@anthropic-ai/sdk';
import AdmZip from 'adm-zip';

dotenv.config();

const app = express();
const PORT = process.env.PORT || 5000;

app.use(cors({
  origin: [
    "https://atlas-drab-eta.vercel.app",
    "http://localhost:3000"  // for local dev
  ]
}));
app.use(express.json());

const upload = multer({ storage: multer.memoryStorage() });

// Initialize Anthropic client
const anthropic = new Anthropic({
  apiKey: process.env.ANTHROPIC_API_KEY,
});

// Cache storage (in-memory for now)
const cache = new Map();

// =====================
// Cache Endpoints
// =====================
app.post('/cache/check', (req, res) => {
  const { prompt = '', imageAnalysis = '' } = req.body || {};
  const key = `${prompt}:${imageAnalysis}`;
  const entry = cache.get(key);

  if (entry) {
    return res.json({
      cached: true,
      timestamp: entry.timestamp,
      code: entry.code,
      files: entry.files
    });
  }
  return res.json({ cached: false });
});

app.post('/cache/store', (req, res) => {
  const { prompt = '', code = '', files = [], imageAnalysis = '' } = req.body || {};
  const key = `${prompt}:${imageAnalysis}`;

  cache.set(key, {
    code,
    files,
    timestamp: Date.now(),
    prompt
  });

  return res.json({ success: true });
});

// =====================
// Helper: Convert images to base64
// =====================
async function processImages(files) {
  if (!files || files.length === 0) return [];

  // Map of accepted MIME types
  const validMimeTypes = {
    'image/jpeg': 'image/jpeg',
    'image/jpg': 'image/jpeg',  // Normalize jpg to jpeg
    'image/png': 'image/png',
    'image/gif': 'image/gif',
    'image/webp': 'image/webp'
  };

  return files
    .filter(file => {
      const mimeType = file.mimetype.toLowerCase();
      if (!validMimeTypes[mimeType]) {
        console.warn(`⚠️  Skipping unsupported image format: ${file.mimetype} (${file.originalname})`);
        return false;
      }
      return true;
    })
    .map(file => {
      const mimeType = file.mimetype.toLowerCase();
      const validMimeType = validMimeTypes[mimeType];

      console.log(`✅ Processing image: ${file.originalname} (${validMimeType})`);

      return {
        type: "image",
        source: {
          type: "base64",
          media_type: validMimeType,
          data: file.buffer.toString('base64')
        }
      };
    });
}

// =====================
// Helper: Extract ZIP contents
// =====================
function extractZipContents(zipBuffer) {
  const zip = new AdmZip(zipBuffer);
  const zipEntries = zip.getEntries();

  let projectStructure = '';
  const files = [];

  zipEntries.forEach(entry => {
    if (!entry.isDirectory && !entry.entryName.includes('__MACOSX') && !entry.entryName.startsWith('.')) {
      const content = entry.getData().toString('utf8');
      projectStructure += `\n\n=== ${entry.entryName} ===\n${content}`;

      files.push({
        path: entry.entryName,
        name: entry.entryName.split('/').pop(),
        size: entry.header.size
      });
    }
  });

  return { projectStructure, files };
}

// =====================
// Generate Code (with images, no ZIP)
// =====================
app.post('/generate-stream', upload.array('images'), async (req, res) => {
  try {
    const prompt = req.body.prompt || '';
    const imageFiles = req.files || [];

    console.log(`📝 Generating code for prompt: "${prompt}" with ${imageFiles.length} image(s)`);

    // Process images
    const imageContent = await processImages(imageFiles);

    // Build message content with improved prompt
    const content = [
  ...imageContent,
  {
    type: "text",
    text: `Create a clean, functional web page: ${prompt}

Requirements:
- Single HTML file with embedded CSS and JavaScript
- Simple, modern design
- Fully functional and responsive
- Return ONLY the HTML code, starting with <!DOCTYPE html>

Keep it minimal.`
  }
];


    // Set up streaming response
    res.setHeader('Content-Type', 'text/plain; charset=utf-8');
    res.setHeader('Transfer-Encoding', 'chunked');

    // Call Anthropic API with streaming and increased token limit
    const stream = await anthropic.messages.stream({
      model: 'claude-sonnet-4-20250514',
      max_tokens: 6000, // Increased from 4096 for better output
      messages: [{
        role: 'user',
        content: content
      }]
    });

    let fullCode = '';

    // Stream the response
    for await (const chunk of stream) {
      if (chunk.type === 'content_block_delta' &&
          chunk.delta.type === 'text_delta') {
        const text = chunk.delta.text;
        fullCode += text;
        res.write(text);
      }
    }

    res.write('\n[DONE]');
    res.end();

    console.log('✅ Code generation complete');

  } catch (error) {
    console.error('❌ Generation error:', error);
    res.status(500).json({
      error: error.message || 'Failed to generate code'
    });
  }
});

// =====================
// Generate from Project ZIP
// =====================
app.post('/generate-from-project',
  upload.fields([{ name: 'projectZip', maxCount: 4 }, { name: 'images', maxCount: 10 }]),
  async (req, res) => {
    try {
      const prompt = req.body.prompt || '';
      const zipFiles = req.files?.projectZip || [];
      const imageFiles = req.files?.images || [];

      console.log(`📦 Processing ${zipFiles.length} ZIP file(s) with prompt: "${prompt}"`);

      if (zipFiles.length === 0) {
        return res.status(400).json({ error: 'No ZIP files provided' });
      }

      // Extract all ZIP files
      let combinedProjectStructure = '';
      let allFiles = [];

      zipFiles.forEach((zipFile, index) => {
        const { projectStructure, files } = extractZipContents(zipFile.buffer);
        combinedProjectStructure += `\n\n=== PROJECT ${index + 1}: ${zipFile.originalname} ===\n${projectStructure}`;
        allFiles = [...allFiles, ...files];
      });

      // Process images
      const imageContent = await processImages(imageFiles);

      // Build message content with improved prompt
      const content = [
        ...imageContent,
        {
          type: "text",
          text: `You are a senior full-stack developer. I'm providing you with existing project code and need your expert help.

PROJECT CODE:
${combinedProjectStructure}

USER REQUEST:
${prompt}

CRITICAL INSTRUCTIONS:
1. Carefully analyze the existing code structure and architecture
2. Understand the current implementation patterns and conventions
3. Implement the requested changes/features professionally
4. Return the COMPLETE, UPDATED code for ALL modified files
5. Maintain consistency with existing code style and structure
6. Add clear comments explaining your changes
7. Ensure backward compatibility unless specifically asked to break it
8. Fix any bugs you notice while implementing the changes
9. Follow best practices and modern standards

OUTPUT FORMAT:
For each file you modify or create, use this EXACT format:

=== path/to/file.ext ===
[complete file content here]

IMPORTANT:
- Include the full file path in the header
- Provide the COMPLETE file content, not just changes
- Separate each file with the === header
- Include ALL files that need to be modified or created
- Do NOT include explanations outside of code comments
- Start directly with the first === header`
        }
      ];

      // Set up streaming response
      res.setHeader('Content-Type', 'text/plain; charset=utf-8');
      res.setHeader('Transfer-Encoding', 'chunked');

      // Send file structure first
      res.write(`FILE_STRUCTURE:${JSON.stringify(allFiles)}\n\n`);

      // Call Anthropic API with streaming and increased token limit
      const stream = await anthropic.messages.stream({
        model: 'claude-sonnet-4-20250514',
        max_tokens: 16000, // Increased from 8192 for better output
        messages: [{
          role: 'user',
          content: content
        }]
      });

      let fullCode = '';

      // Stream the response
      for await (const chunk of stream) {
        if (chunk.type === 'content_block_delta' &&
            chunk.delta.type === 'text_delta') {
          const text = chunk.delta.text;
          fullCode += text;
          res.write(text);
        }
      }

      res.write('\n[DONE]');
      res.end();

      console.log('✅ Project upgrade complete');

    } catch (error) {
      console.error('❌ Project processing error:', error);
      res.status(500).json({
        error: error.message || 'Failed to process project'
      });
    }
  }
);

// =====================
// Health Check
// =====================
app.get('/health', (req, res) => {
  res.json({
    status: 'ok',
    hasApiKey: !!process.env.ANTHROPIC_API_KEY
  });
});

// =====================
// Start Server
// =====================
app.listen(PORT, () => {
  console.log(`🚀 Server running on http://localhost:${PORT}`);

  if (process.env.ANTHROPIC_API_KEY) {
    console.log('✅ Anthropic API key configured');
  } else {
    console.log('⚠️  WARNING: ANTHROPIC_API_KEY not set in .env file');
  }
});