index.js

const fs = require('fs');
const path = require('path');

// Read HTML file at startup
const html = fs.readFileSync(path.join(__dirname, 'index.html'), { encoding: 'utf8' });

// AWS SDK v3 imports
const { DynamoDBClient } = require('@aws-sdk/client-dynamodb');
const { DynamoDBDocumentClient, PutCommand, ScanCommand } = require('@aws-sdk/lib-dynamodb');

// Create DynamoDB client
const client = new DynamoDBClient({ region: process.env.AWS_REGION || 'us-east-1' });
const dynamo = DynamoDBDocumentClient.from(client);

exports.handler = async (event, context) => {
    try {
        console.log('🚀 Handler started');
        console.log('Event:', JSON.stringify(event, null, 2));
        
        // First, get existing records from DynamoDB
        let tableQuery = null;
        try {
            console.log('🔍 Scanning DynamoDB table...');
            
            const scanCommand = new ScanCommand({
                TableName: "formStore"
            });
            
            tableQuery = await dynamo.send(scanCommand);
            console.log('✅ DynamoDB Scan Success!');
            console.log('📊 Records found:', tableQuery.Count);
            
        } catch (scanError) {
            console.error('❌ DynamoDB Scan Error:', scanError);
            tableQuery = { Items: [] };
        }
        
        // Process form data and save to DynamoDB if present
        if (event.queryStringParameters && Object.keys(event.queryStringParameters).length > 0) {
            try {
                console.log('💾 Saving new form data...');
                
                const putCommand = new PutCommand({
                    TableName: "formStore",
                    Item: {
                        PK: "form",
                        SK: context.awsRequestId,
                        timestamp: new Date().toISOString(),
                        sourceIP: event.requestContext?.http?.sourceIp || 'unknown',
                        userAgent: event.headers?.['user-agent'] || 'unknown',
                        form: event.queryStringParameters
                    }
                });
                
                await dynamo.send(putCommand);
                console.log('✅ Successfully saved to DynamoDB:', context.awsRequestId);
                
                // Refresh the table data after inserting new record
                const refreshScanCommand = new ScanCommand({
                    TableName: "formStore"
                });
                tableQuery = await dynamo.send(refreshScanCommand);
                console.log('🔄 Refreshed data, new count:', tableQuery.Count);
                
            } catch (dbError) {
                console.error('❌ DynamoDB Put Error:', dbError);
            }
        }
        
        // Apply dynamic functions
        console.log('🔧 Processing HTML template...');
        let modifiedHTML = dynamicForm(html, event.queryStringParameters);
        modifiedHTML = dynamictable(modifiedHTML, tableQuery);
        
        console.log('✅ HTML processing complete');
        
        const response = {
            statusCode: 200,
            headers: {
                'Content-Type': 'text/html; charset=utf-8',
                'Cache-Control': 'no-cache'
            },
            body: modifiedHTML,
        };
        
        return response;
        
    } catch (error) {
        console.error('💥 Handler Error:', error);
        return {
            statusCode: 500,
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ 
                error: 'Internal Server Error', 
                message: error.message,
                requestId: context.awsRequestId 
            })
        };
    }
};

function dynamicForm(html, queryStringParameters) {
    let formResults = '';
    
    if (queryStringParameters && Object.keys(queryStringParameters).length > 0) {
        formResults = '<div class="result"><h4>✅ Form Submission Saved Successfully!</h4><ul>';
        
        Object.entries(queryStringParameters).forEach(([key, value]) => {
            if (value && value.trim() !== '') {
                formResults += `<li><strong>${key}:</strong> ${value}</li>`;
            }
        });
        
        formResults += '</ul><p><em>Data has been stored in DynamoDB table "formStore"</em></p></div>';
        
    } else {
        formResults = '<div class="result" style="background: #fff3cd; border-color: #ffeaa7; color: #856404;"><h4>ℹ️ Ready to Process Form Data</h4><p>Fill out the form below to see dynamic processing in action!</p></div>';
    }
    
    return html.replace('{formResults}', formResults);
}

function dynamictable(html, tableQuery) {
    console.log('🏗️ Building table HTML...');
    
    let table = "";
    
    if (tableQuery && tableQuery.Items && tableQuery.Items.length > 0) {
        console.log('✅ Found items, building table...');
        
        // Create a proper HTML table
        table = `
        <div style="overflow-x: auto; margin: 15px 0; border: 2px solid #007bff; border-radius: 8px; padding: 15px; background: #f8f9fa;">
            <h5 style="color: #007bff; margin-top: 0;">📊 Form Submissions Database</h5>
            <table style="width: 100%; border-collapse: collapse; margin: 10px 0; font-size: 14px; background: white;">
                <thead>
                    <tr style="background-color: #007bff; color: white;">
                        <th style="border: 1px solid #ddd; padding: 12px; text-align: left;">Submission ID</th>
                        <th style="border: 1px solid #ddd; padding: 12px; text-align: left;">Timestamp</th>
                        <th style="border: 1px solid #ddd; padding: 12px; text-align: left;">Name</th>
                        <th style="border: 1px solid #ddd; padding: 12px; text-align: left;">Location</th>
                        <th style="border: 1px solid #ddd; padding: 12px; text-align: left;">Details</th>
                    </tr>
                </thead>
                <tbody>
        `;
        
        for (let i = 0; i < tableQuery.Items.length; i++) {
            const item = tableQuery.Items[i];
            const formData = item.form || {};
            
            table += `
                <tr style="background-color: ${i % 2 === 0 ? '#ffffff' : '#f9f9f9'};">
                    <td style="border: 1px solid #ddd; padding: 8px; font-family: monospace; font-size: 10px;">${(item.SK || 'N/A').substring(0, 8)}...</td>
                    <td style="border: 1px solid #ddd; padding: 8px;">${item.timestamp ? new Date(item.timestamp).toLocaleString() : 'N/A'}</td>
                    <td style="border: 1px solid #ddd; padding: 8px;"><strong>${formData.name || 'N/A'}</strong></td>
                    <td style="border: 1px solid #ddd; padding: 8px;">${formData.location || 'N/A'}</td>
                    <td style="border: 1px solid #ddd; padding: 8px;">
                        <details>
                            <summary style="cursor: pointer; color: #007bff;">View All</summary>
                            <pre style="margin: 5px 0; font-size: 11px; background: #f8f9fa; padding: 5px; border-radius: 3px;">${JSON.stringify(formData, null, 2)}</pre>
                        </details>
                    </td>
                </tr>
            `;
        }
        
        table += `
                </tbody>
            </table>
            <p style="color: #6c757d; font-size: 12px; margin-bottom: 0;"><em>📊 Total records: ${tableQuery.Items.length} | Last updated: ${new Date().toLocaleString()}</em></p>
        </div>
        `;
        
        console.log('✅ Table HTML built successfully');
        
    } else {
        console.log('⚠️ No items found');
        table = '<div style="padding: 20px; background: #f8f9fa; border-radius: 5px; text-align: center; color: #6c757d; border: 2px dashed #dee2e6;"><p>📋 No records found in DynamoDB table.</p><p><em>Submit the form above to create your first record!</em></p></div>';
    }
    
    return html.replace("{table}", `<h4>📊 DynamoDB Records:</h4>${table}`);
}