📊 CSV Data Forecasting Dashboard

\n \n \n {isProcessing ? \"Processing...\" : \"Analyze Data\"}\n \n

\n\n {processingError && (\n

🚨 Processing Error

{processingError}

\n )}\n\n {analysisResult && (\n

Analysis Results

Raw Data (First 10 Rows)

{JSON.stringify(analysisResult.rawData.slice(0, 10), null, 2)}

AI Analysis

{analysisResult.aiAnalysis}

\n {analysisResult.dataColumns && (\n

Data Columns

{col}

\n )}\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/analyze\") {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n const openai = new OpenAI();\n\n try {\n const formData = await request.formData();\n const file = formData.get(\"file\") as File;\n\n // Basic file validation\n if (!file || file.size === 0) {\n return new Response(JSON.stringify({ error: \"No file uploaded\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Limit file size to 5MB\n if (file.size > 5 * 1024 * 1024) {\n return new Response(\n JSON.stringify({\n error: \"File too large. Maximum 5MB allowed.\",\n }),\n {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n }\n\n // Read CSV file\n const csvText = await file.text();\n const parseResult = Papa.parse(csvText, {\n header: true,\n skipEmptyLines: true,\n });\n\n const jsonData = parseResult.data;\n\n // Validate parsed data\n if (jsonData.length === 0) {\n return new Response(JSON.stringify({ error: \"No valid data found in CSV\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Limit data to first 50 rows for analysis\n const limitedData = jsonData.slice(0, 50);\n\n // Use OpenAI for intelligent analysis with more specific instructions\n const analysisPrompt = `Provide a concise data analysis and forecasting insights:\n - Total rows: ${jsonData.length}\n - Columns: ${Object.keys(limitedData[0] || {}).join(\", \")}\n \n Analyze the first few rows and provide:\n 1. Data structure overview\n 2. Potential trends or patterns\n 3. Recommended preprocessing steps\n 4. Possible machine learning approaches for forecasting\n \n Dataset preview: ${JSON.stringify(limitedData.slice(0, 5))}`;\n\n const completion = await openai.chat.completions.create({\n messages: [{ role: \"user\", content: analysisPrompt }],\n model: \"gpt-4o-mini\",\n max_tokens: 500, // Increased token limit for more detailed analysis\n });\n\n return new Response(\n JSON.stringify({\n rawData: jsonData,\n aiAnalysis: completion.choices[0].message.content,\n dataColumns: Object.keys(jsonData[0] || {}),\n totalRows: jsonData.length,\n }),\n {\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n } catch (error) {\n console.error(\"Server-side processing error:\", error);\n return new Response(\n JSON.stringify({\n error: \"Processing failed\",\n details: error.message,\n }),\n {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n }\n }\n\n return new Response(\n `\n \n \n CSV Forecasting Dashboard\n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}\n\nconst css = `\nbody {\n font-family: 'Arial', sans-serif;\n max-width: 900px;\n margin: 0 auto;\n padding: 20px;\n background-color: #f4f4f4;\n}\n.container {\n background-color: white;\n border-radius: 8px;\n padding: 20px;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n}\n.upload-section {\n display: flex;\n gap: 10px;\n margin-bottom: 20px;\n}\nbutton {\n background-color: #4CAF50;\n color: white;\n border: none;\n padding: 10px 15px;\n border-radius: 4px;\n cursor: pointer;\n}\nbutton:disabled {\n background-color: #cccccc;\n}\n.results-section, .error-section {\n background-color: #f9f9f9;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n padding: 15px;\n margin-top: 15px;\n}\n.error-section {\n background-color: #ffebee;\n color: #d32f2f;\n}\n.result-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n}\n.result-grid pre {\n max-height: 300px;\n overflow-y: auto;\n background-color: #f0f0f0;\n padding: 10px;\n border-radius: 4px;\n}\n.columns-section ul {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n list-style-type: none;\n padding: 0;\n}\n.columns-section li {\n background-color: #e0e0e0;\n padding: 5px 10px;\n border-radius: 4px;\n}\n`;","deleted","label",[102],"permalink","https://www.val.town/x/faroutroy/vibrantBronzeAnt/code/main.tsx","extension","actionData","errors"]