Update app.py

app.py

@@ -100,8 +100,7 @@ def build_pack(app_idea, stack, platform, style, auth, database, extras):
     if "File uploads" in extras:
         endpoints += ["POST /api/files/upload", "DELETE /api/files/:id"]
 
-    folder_tree = f"""
-{slug}/
+    folder_tree = f"""{slug}/
 ├── app/
 │   ├── components/
 │   ├── pages/
@@ -121,10 +120,9 @@ def build_pack(app_idea, stack, platform, style, auth, database, extras):
 ├── tests/
 ├── .env.example
 ├── README.md
-└── package.json
-""".strip()
+└── package.json"""
 
-    starter_code = f'''# {app_name}
+    starter_code = f"""# {app_name}
 
 ## Suggested stack
 - Frontend: {stack}
@@ -165,11 +163,9 @@ CREATE TABLE projects (
   created_at TIMESTAMP DEFAULT NOW(),
   updated_at TIMESTAMP DEFAULT NOW()
 );
-```
-'''
+```"""
 
-    prd = f"""
-# Product Brief
+    prd = f"""# Product Brief
 
 ## App Name
 {app_name}
@@ -197,8 +193,7 @@ Create a {style.lower()} product that feels fast, clear, and easy to expand in a
 
     api_plan = "# API Routes\n\n" + "\n".join(f"- {route}" for route in endpoints)
 
-    system_prompt = f"""
-You are a senior product engineer and UX architect.
+    system_prompt = f"""You are a senior product engineer and UX architect.
 Generate implementation-ready output for this app idea: {app_idea}
 Stack: {stack}
 Platform: {platform}
@@ -215,8 +210,7 @@ Return:
 6. API routes
 7. Folder structure
 8. Starter code
-Keep output concise, structured, and copy-paste ready.
-""".strip()
+Keep output concise, structured, and copy-paste ready."""
 
     json_export = json.dumps({
         "name": app_name,
@@ -244,3 +238,101 @@ css = """
   --panel: #121937;
   --panel-2: #1a234a;
   --line: #2a3569;
+  --text: #f5f7ff;
+  --muted: #a8b3d1;
+  --accent: #68e1fd;
+  --accent-2: #8b5cf6;
+}
+.gradio-container {
+  background: linear-gradient(180deg, #0b1020 0%, #101735 100%);
+}
+.block, .gr-box, .gr-panel {
+  border-radius: 18px !important;
+}
+"""
+
+with gr.Blocks(css=css, theme=gr.themes.Soft(), title=TITLE) as demo:
+    gr.Markdown(
+        """
+# AppDraft
+### Turn an app idea into a copy-paste build pack for your IDE.
+Describe the app once, then generate a product brief, UI plan, schema, API routes, folder structure, and starter code.
+"""
+    )
+
+    with gr.Row():
+        app_idea = gr.Textbox(
+            label="App idea",
+            lines=5,
+            placeholder="Example: A local service marketplace for last-minute movers with quotes, scheduling, reviews, Stripe payments, and an admin dashboard.",
+        )
+        with gr.Column():
+            stack = gr.Dropdown(
+                ["Next.js + TypeScript", "React + Vite", "FastAPI + React", "Flask + HTMX", "Electron + React", "React Native + Expo"],
+                value="Next.js + TypeScript",
+                label="Target stack",
+            )
+            platform = gr.Dropdown(
+                ["Web app", "Mobile app", "Desktop app", "Marketplace", "SaaS dashboard", "Landing page + app"],
+                value="Web app",
+                label="Platform",
+            )
+            style = gr.Dropdown(
+                ["Minimal modern", "Dark SaaS", "Bold startup", "Playful consumer", "Enterprise clean", "Mobile-first utility"],
+                value="Dark SaaS",
+                label="Design style",
+            )
+            auth = gr.Dropdown(
+                ["Email + password", "Magic link", "OAuth", "No auth"],
+                value="Email + password",
+                label="Auth",
+            )
+            database = gr.Dropdown(
+                ["PostgreSQL", "Supabase", "SQLite", "MongoDB", "Firebase"],
+                value="PostgreSQL",
+                label="Database",
+            )
+            extras = gr.CheckboxGroup(
+                ["Payments", "Notifications", "Admin panel", "AI features", "File uploads", "Realtime"],
+                label="Extras",
+            )
+
+    generate = gr.Button("Generate build pack", variant="primary")
+
+    with gr.Tabs():
+        with gr.Tab("PRD"):
+            prd = gr.Markdown()
+        with gr.Tab("UI"):
+            ui = gr.Markdown()
+        with gr.Tab("Database"):
+            db = gr.Markdown()
+        with gr.Tab("API"):
+            api = gr.Markdown()
+        with gr.Tab("Structure"):
+            tree = gr.Code(language="text")
+        with gr.Tab("Starter code"):
+            starter = gr.Markdown()
+        with gr.Tab("Prompt"):
+            prompt = gr.Code(language="markdown")
+        with gr.Tab("JSON"):
+            export_json = gr.Code(language="json")
+
+    generate.click(
+        fn=build_pack,
+        inputs=[app_idea, stack, platform, style, auth, database, extras],
+        outputs=[prd, ui, db, api, tree, starter, prompt, export_json],
+    )
+
+if __name__ == "__main__":
+    demo.launch()
+```
+
+## Do this now
+
+1. Open `app.py` in your repo.[1]
+2. Select all and replace it with the code above.[1]
+3. Commit the change. Hugging Face will rebuild automatically after the commit.[1]
+
+## If it still fails
+
+If there’s another error after this, send the next log output. The current logs show only the unterminated triple-quoted string problem, so fixing `app.py` should move you to the next stage.[1]