Limited Time Offer: Watch All Our Bubble Tutorial Videos for Only $99 per Year!


In the next few days we're going to be releasing our first ever Udemy course, and that's going to be my most complete and detailed how to build a Chat GPT clone with bubble set of videos course that I've ever made. But in the meantime, I want to show you a quick tip for how you can summarize a whole conversation using the OpenAI API and then present that back to your user in your that window. So if you want to learn how to get to this stage, you can piece together based on some of our previous videos. Or watch out for the udemy course coming soon by subscribing to our channel. That's how you'll find out about the news.

Add Summarize Button

But right now I'm going to add in a button that is going to summarize this conversation. So basically it is inserting a pre written prompt into the middle of the conversation that you trigger with a button press. So let's go and head and add in another button.

And I'm going to say summarize.

Calling OpenAI API

So when this button is clicked, I want to run a call to the OpenAI API and I want to send all of the previous messages along with it. So it's actually very similar to our send button, but we don't create a message because we don't want the user's message to go into the conversation. We just want the AI to respond with a summary. So I'm going to copy this step because this is the step where we list through all our messages and we generate the JSON needed in order to communicate with the OpenAI API. So I'm going to copy this, paste it in here and then copy this.

So this is the important bit. This is the saving of the response and paste it in here. So just reconnect back up. And so this is the result of step one choices. First item message content, and then we give it the role that we need and the thread id again.

Check out our previous videos, which kind of jump in in the deep end here. So this sends this template of a message and it sends it for every single message in the current thread. And we just basically want to add a message to it. Yeah, we do. And so I could type straight into here, but I'm actually going to do it in the API connector.

So we'll go into plugins and I'll duplicate it so we can say get summary of conversation.

And so then all our messages go in there. I'm going to add in a comma because remember, each of our messages is basically formatted exactly the same as this. So I'm going to paste that in and then I'm going to say the role is user because effectively our button is just like insert a prompt, and so our prompt can be in less than three sentences.

Checking Syntax and Errors

Summarize our conversation so far. Now I want to reinitialize this, and that's only going to work because I've got some dummy content in here. So let's try that. And that's good. There's no errors.

I've not introduced any JSoN syntax issues in the conversation so far. I would point out, of course, that the summarize button won't work if there are no messages. You would get a syntax error because this would effectively be blank. So just be aware of that. Now I actually want to now use our summarize.

So I'm going to copy this into here, move it, delete this, reconnect it back up, and let's go ahead and preview. So while it reloads, I've got a bit of a conversation here going on about a trip to Europe, and I'm going to click summarize.

Right? So it says in our conversation I shared information about popular destinations in Europe. And then, yeah, it picks up that I basically said I like the sound of Paris. So there you go. That's how you can add in a summarize button, or you can summarize a conversation so far with OpenAI in your bubble Chat GPT clone, or however you're introducing the OpenAI API into your bubble app.

Latest videos