Building an AI Chat Bot on iOS SwiftUI

Hi there :) My name is Dhara and I’m a entrepreneur and engineer. Sooo I thought why not document my process as I add an AI chat bot to Wana. Join me on this journey!

Wana is a app that matches users based on their creative interests and then curates things for them to do together. Check us out on the Apple App Store! So, we are adding a new feature to better serve our creative users.

Photo by Mojahid Mottakin on Unsplash

Step 1: Designing the feature

The AI chat bot will be a “creativity assistant” — ideally pulling from sources like Rick Rubin, The Artist’s Way, etc. I played around with the Rick Rubin character on Character.ai to see how helpful it can be and it was actually really cool! It gave some good tips on how I can unblock my paintings. It is pretty much what to integrate into my app.

Step 2: Choosing the right model or integration tool

There are several up & coming SaaS companies that will integrate ChatGPT or various other AI models into your platform for you. But, I’m going to try and integrate ChatGPT into my iOS app myself because why not?!

First, I went onto OpenAI’s developer platform. Luckily they just recently released Assistant into their beta API. The Assistant tool is exactly what it sounds like — an assistant. You can give it whatever instructions you want! I created one for creativity with the following instructions and then played around with it on Playground.

You are a personal creativity assistant. Your job is to help your user grow and unblock their creative spirit, excell in their hobby. Pull from authors, artists, and philosophers of the past to give advice and exercises. Always reference where your advice is coming from.

We are going to design our chatbot such that there is one assistant for the whole app and each user will have their own private thread.

Step 3: Integrate OpenAI API into your SwiftUI App

1. If you haven’t already create/grab your secret API key from OpenAI
2. Open Xcode (surprise!).
3. Create a OpenAIService to manage the API and its requests
4. Create the following methods: createAssistant(), getAssistant(), createThread(), getThread(), sendMessage(), getMessages()
5. Use APIReference to pull the endpoints for each of these methods
6. Create the assistant using OpenAI’s dev platform and then store the assistantId
7. Define the response structs: Assistant, Thread, Message. Make sure they are Encodable and Decodable.
8. Define the request structs for pretty much each endpoint. Make sure they are encodable.

Step 4: Edit your User object such that each has its own thread

1. Add an attribute threadId of type String to your User object. Make sure to add it to your decoder and encoder if necessary.
2. Add an attribute aiMessages that will store all the messages from the thread. Do not encode / decode because on init we will pull these messages from the API.
3. Create a method retreiveThreadMessages() in OpenAIService that calls this endpoint and returns a list of messages for that user’s thread.
4. Create a method createThread() in OpenAIService that calls this endpoint and returns a new Thread object.
5. When you create a user, create its thread and then store the thread.

Step 5: Create your chatbot home view

I’m creating a really simple chatbot home that looks like this. Here’s the code for the simple chat view.

Step 6: Send Message Func

Lastly we want to go back to the OpenAIService and fill in those methods. First we must add the message to the user’s thread. Then, we run the assistant.

1. Create a sendMessage method in OpenAIService that calls this endpoint using the user’s threadId.
2. Create a runAssistant method in OpenAIService that calls this endpoint using the assistantId of the Assistant we created in OpenAI dev platform. You can find it under the “Assistants” tab on the left.
3. When the user clicks the Send button in the chat home view, this sendMessage func is called.

Step 7. Test and iterate :)

This didn’t immediately work for me. I had to play around with the response structs and had to figure out that you have to RUN the assistant in order to get a response 😭. Feel free to leave comments if issues arise. Best of luck :).

P.S. This is a part of Wana Create — a matchmaking app that helps people get creative in the real world. Check it out here!

Images

Don’t worry about the return types as of now! We’ll go through that later.