Feature Description
Implement a real-time progress indicator in the frontend UI that updates as the backend completes different stages of the generation and publishing pipeline.
Problem It Solves
Generating a blog via LLMs (Gemini/OpenAI) and then chaining synchronous API requests to Dev.to, LinkedIn, Twitter, and GitHub can easily take 10 to 15 seconds. Currently, the user clicks "Publish" and sits in silence wondering if the app froze or is broken (which often leads to users impatiently clicking the button multiple times and causing race conditions).
Proposed Solution
Instead of forcing the user to wait for a single monolithic API response, implement Server-Sent Events (SSE) or WebSockets in the FastAPI backend for the /generate-blog route. The backend will yield status updates, and the React UI / Extension can display a sleek, animated progress stepper:
⏳ "🤖 AI is analyzing your code and writing the blog..."
⏳ "🌐 Publishing article to Dev.to..."
⏳ "🐙 Committing raw solution to GitHub..."
⏳ "🐦 Sharing to Twitter and LinkedIn..."
✅ "Done! View your post here."
Additional Context
This massively improves the perceived performance of the app. Even if it takes 15 seconds, keeping the user visually engaged completely eliminates frustration and confusion!
Feature Description
Implement a real-time progress indicator in the frontend UI that updates as the backend completes different stages of the generation and publishing pipeline.
Problem It Solves
Generating a blog via LLMs (Gemini/OpenAI) and then chaining synchronous API requests to Dev.to, LinkedIn, Twitter, and GitHub can easily take 10 to 15 seconds. Currently, the user clicks "Publish" and sits in silence wondering if the app froze or is broken (which often leads to users impatiently clicking the button multiple times and causing race conditions).
Proposed Solution
Instead of forcing the user to wait for a single monolithic API response, implement Server-Sent Events (SSE) or WebSockets in the FastAPI backend for the /generate-blog route. The backend will yield status updates, and the React UI / Extension can display a sleek, animated progress stepper:
⏳ "🤖 AI is analyzing your code and writing the blog..."
⏳ "🌐 Publishing article to Dev.to..."
⏳ "🐙 Committing raw solution to GitHub..."
⏳ "🐦 Sharing to Twitter and LinkedIn..."
✅ "Done! View your post here."
Additional Context
This massively improves the perceived performance of the app. Even if it takes 15 seconds, keeping the user visually engaged completely eliminates frustration and confusion!