Implementing Stop Generating Functionality on a React, Next.js, Typescript webapp

Hey everyone,

Searching for some help with a strange problem I’m trying to solve. I have a server side ReadableStream which renders a response client side as a stream from the api. I want to re create the Stop Generating functionality of ChatGPT, but have had no luck so far. I make an api call to create the stream and I can close() the stream successfully but only through using a setTimeout server side, not asynchronously. Anytime I try to find a method to close the stream through a client side call, I either have no way to know the ReadableStreamDefaultController for the stream so I can close it, or the stream throws an error saying its not in a state to be closed. I need to somehow close the stream client side.

Thank you, any help would be great.