Code generation working. Need to figure out e2b

[juancastano]

TL;DR

Implement AI-powered UI component generation with OpenAI, Benchify code repair, and E2B preview functionality.

What changed?

• Added environment configuration with .env.example and updated .gitignore
• Created API endpoint for component generation at /api/generate/route.ts
• Implemented core libraries for AI integration:
  • openai.ts for generating Vue components using OpenAI
  • benchify.ts for repairing generated code
  • e2b.ts for creating live component previews
• Added UI components using shadcn/ui including forms, buttons, cards, etc.
• Created a prompt form component for user input
• Updated the homepage with a clean UI for the component generator
• Added necessary dependencies in package.json
• Enhanced styling with Tailwind CSS configuration

How to test?

1. Copy .env.example to .env and add your API keys
2. Run npm install to install dependencies
3. Start the development server with npm run dev
4. Navigate to the homepage and enter a component description
5. Submit the form to generate a Vue component
6. View the generated code and preview (if available)

Why make this change?

This implementation creates a complete UI component generation system that leverages AI to:

1. Generate Vue components based on natural language descriptions
2. Automatically repair code issues using Benchify
3. Provide instant previews of generated components using E2B sandboxes

This streamlines the component creation workflow, allowing developers to quickly prototype UI components without writing code from scratch.

[juancastano]

• some more light prompt engineering #11 : 3 dependent PRs (#12 , #13 , #14 )
• adding tailwind + postcss config #10
• this isn't going to do much, but adapt structure of vue template to use package.json for deps #9
• update return type of generation endpoint and start rendering in iframe #8
• custom vite config to allow for any hosts to access #7
• start calling prod API #6
• return build output #5
• tiny bit of prompt engineering #4
• run the app in the background #3
• Added template and tweaked e2b logic #2
• Code generation working. Need to figure out e2b #1 👈 (View in Graphite)
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[juancastano]

Merge activity

• May 19, 6:16 AM EDT: A user started a stack merge that includes this pull request via Graphite.
• May 19, 6:16 AM EDT: @juancastano merged this pull request with Graphite.