app.py

import gradio as gr
import os
from huggingface_hub import InferenceClient

HF_TOKEN = os.environ.get("HF_API_TOKEN")
client = InferenceClient(model="HuggingFaceH4/zephyr-7b-beta", token=HF_TOKEN)


# Vibe Coding Tools suggestions
VIBE_TOOLS = [
    ("Lovable", "https://lovable.so", "Browser-based AI + no-code prototyping for apps"),
    ("Rocket.new", "https://www.rocket.new/", "Quick web app MVP generator"),
    ("Bolt", "https://bolt.com", "Rapid prototyping + automation, great for MVPs"),
    ("V0", "https://v0.dev", "Serverless backend + front-end scaffolding"),
    ("Replit", "https://replit.com", "Full online dev environment, collaborative coding"),
    ("Glide", "https://www.glideapps.com", "AI + no-code, spreadsheet-based apps"),
    ("Softr", "https://www.softr.io", "Web apps on Airtable/Google Sheets"),
    ("Builder.io", "https://www.builder.io", "Figma-to-code web apps"),
    ("TeleportHQ", "https://teleporthq.io", "AI-assisted web front-end builder"),
    ("Plasmic", "https://www.plasmic.app", "Frontend builder for marketing + product hybrid"),
]

# Core function to generate rich prompt
def generate_rich_prompt(app_name, description, personas, features, tone="professional"):
    system_message = "You are an expert hackathon product designer and AI prompt engineer."
    user_message = f"""
Generate a rich hackathon-ready prompt for Vibe Coding Tools (Lovable, Rocket.new, Bolt, etc.)
Include everything needed to deliver a polished MVP & PoC.

Use the following info to create a full prompt (like the X-EdTech example):

Project name: {app_name}
Summary: {description}
Personas / Roles: {personas}
Features: {features}
Tone: {tone}

Output structure:

1. Project summary (short)
2. Priority outcome for hackathon (clickable prototype + MVP)
3. Opinion on tech stack & approach
4. Deliverables expected
5. Core modules & features with [MVP]/[PoC] markings
6. Demo accounts with role-specific landing cards
7. Sample data model & seed dataset
8. Charts & dashboard details
9. Design system & Liquid Glassmorphism rules
10. Dark / Light toggle specifics
11. Prototype screens to produce (minimum)
12. AI features to simulate
13. APIs & mock endpoints
14. Acceptance criteria
15. Polish / wow factors
16. Acceptance copy / microcopy examples
17. Constraints / nonfunctional
18. Hackathon priorities
19. One-slide pitch summary

List 10 Vibe Coding Tools, link, purpose, and recommended techniques. Ensure the output is clear, structured, and ready-to-use by a developer or designer in a hackathon.
"""

    messages = [
        {"role": "system", "content": system_message},
        {"role": "user", "content": user_message}
    ]

    response = ""
    for message in client.chat_completion(messages, max_tokens=2048, stream=True, temperature=0.7):
        token = message.choices[0].delta.content
        response += token
        yield response

# Build Gradio interface
with gr.Blocks(title="X-Build: Rich Hackathon Prompt Generator") as demo:

    gr.Markdown("<h2 style='text-align:center'>X-Build: Hackathon-Ready Prompt Generator</h2>")

    with gr.Row():
        with gr.Column(scale=1):
            app_name = gr.Textbox(label="App Name", placeholder="Enter your app name")
            description = gr.Textbox(label="App Description", placeholder="Describe your app")
            personas = gr.Textbox(label="Personas / Roles", placeholder="Teacher, Student, Admin...")
            features = gr.Textbox(label="Features", placeholder="Forms, Quizzes, Analytics...")
            tone = gr.Dropdown(label="Prompt Tone", choices=["professional", "casual", "friendly"], value="professional")
            generate_btn = gr.Button("Generate Rich Prompt")

        with gr.Column(scale=1):
            output = gr.Textbox(label="Generated Rich Prompt", lines=30, interactive=False)

    generate_btn.click(
        fn=generate_rich_prompt,
        inputs=[app_name, description, personas, features, tone],
        outputs=output
    )

    # Basic Dark/Light toggle
    theme_toggle = gr.Checkbox(label="Dark Mode", info="Toggle dark/light theme")

    def toggle_theme(dark_mode):
        if dark_mode:
            return gr.update(elem_classes="dark-theme")
        else:
            return gr.update(elem_classes="")
    theme_toggle.change(fn=toggle_theme, inputs=theme_toggle, outputs=[])

# Launch
if __name__ == "__main__":
    demo.launch()