feat: implement native Stop Generation button using AbortController #364

[annukumar123]

🚀 Overview

Addresses #364 by introducing a native client-side Stop Generation button to cleanly interrupt ongoing LLM streaming responses.

🛠️ Changes Implemented

• utils/api.js: Updated the central fetch wrapper (req) and streamMessage to accept and handle a native browser AbortSignal token.
• App.jsx: Introduced an abortControllerRef using useRef to track active asynchronous text streams dynamically. Added a unified stopGeneration callback handler to safely abort the network fetch request line and seamlessly clean up internal message states.
• ChatWindow.jsx: Integrated a dynamic button state switch that swaps the traditional "Send" action out for an explicit "Stop" trigger button whenever an active generation layout sequence is detected.

🧪 Local Testing Results

Verified locally alongside the FastAPI backend module. Active response stream processes truncate instantly when clicked, printing the intended [Generation Stopped] fallback marker inside the active chat history viewport.

[vercel]

@annukumar123 is attempting to deploy a commit to the Darshan's projects Team on Vercel.

A member of the Team first needs to authorize it.

[annukumar123]

Hi @imDarshanGK,

I have manually resolved the merge conflicts with the main branch directly through the GitHub editor. I made sure to preserve the core template features and props while keeping the AbortController logic intact.

Both the Frontend (React) and Backend (Python) CI test and lint pipelines are now passing completely green! The Stop Generation feature is fully functional and ready for your final review and merge.

Let me know if you'd like me to adjust anything else!

[annukumar123]

Hi @imDarshanGK
Both CI run properly. can you merge it

[imDarshanGK]

@annukumar123 resolve conflicts

[annukumar123]

@imDarshanGK
Here we go. Both CI are working.
Now i want to work on more issues.Can you Assign it to me ?