commit 1

package.json

@@ -7,6 +7,7 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^13.5.0",
+    "axios": "^1.11.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-scripts": "5.0.1",

src/App.js

@@ -1,23 +1,12 @@
-import logo from './logo.svg';
-import './App.css';
+// src/App.js
+import React from 'react';
+import FileUploadForm from './FileUploadForm';
 
 function App() {
   return (
     <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
+      <h1>🧠 AI Project Generator</h1>
+      <FileUploadForm />
     </div>
   );
 }

src/FileUploadForm.js

@@ -0,0 +1,82 @@
+// src/FileUploadForm.js
+import React, { useState } from 'react';
+import axios from 'axios';
+
+const FileUploadForm = () => {
+  const [file, setFile] = useState(null);
+  const [frontend, setFrontend] = useState("React");
+  const [backend, setBackend] = useState("Flask");
+  const [database, setDatabase] = useState("PostgreSQL");
+  const [loading, setLoading] = useState(false);
+
+  const handleDownload = async (e) => {
+    e.preventDefault();
+    if (!file) return alert("Please select a file!");
+
+    const formData = new FormData();
+    formData.append("file", file);
+    formData.append("frontend", frontend);
+    formData.append("backend", backend);
+    formData.append("database", database);
+
+    try {
+      setLoading(true);
+      const response = await axios.post(
+        "https://your-flask-api-url/chat-stream-doc", // ✅ Update to actual URL
+        formData,
+        {
+          responseType: "blob", // important for zip file
+        }
+      );
+
+      // create download link
+      const blob = new Blob([response.data], { type: "application/zip" });
+      const url = window.URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = "generated_project.zip";
+      document.body.appendChild(a);
+      a.click();
+      window.URL.revokeObjectURL(url);
+    } catch (error) {
+      console.error("Error downloading ZIP:", error);
+      alert("Failed to generate ZIP. Check your input or server logs.");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <form onSubmit={handleDownload}>
+      <h2>Upload Requirement Document</h2>
+      <input type="file" onChange={(e) => setFile(e.target.files[0])} accept=".txt,.pdf" required />
+      <br />
+      <label>Frontend:</label>
+      <select value={frontend} onChange={(e) => setFrontend(e.target.value)}>
+        <option value="React">React</option>
+        <option value="Angular">Angular</option>
+        <option value="Vue">Vue</option>
+      </select>
+      <br />
+      <label>Backend:</label>
+      <select value={backend} onChange={(e) => setBackend(e.target.value)}>
+        <option value="Flask">Flask</option>
+        <option value="Node.js">Node.js</option>
+        <option value="Django">Django</option>
+      </select>
+      <br />
+      <label>Database:</label>
+      <select value={database} onChange={(e) => setDatabase(e.target.value)}>
+        <option value="PostgreSQL">PostgreSQL</option>
+        <option value="MongoDB">MongoDB</option>
+        <option value="MySQL">MySQL</option>
+      </select>
+      <br /><br />
+      <button type="submit" disabled={loading}>
+        {loading ? "Generating..." : "Generate ZIP"}
+      </button>
+    </form>
+  );
+};
+
+export default FileUploadForm;