In this example, you’ll use your ChatGPTClient in an iOS “Help Desk Chat App.” This app will ultimately allow users to communicate with a friendly AI assistant to get help troubleshooting computer-related problems.
First, download and open the Starter for this lesson.
Build and run the project, and you’ll see that a basic chat UI has already been created for you. You can already submit a message too.
However, the app doesn’t actually do anything other than display the new message right now.
To see why, open ChatView, which contains the UI for this app. There are two main views: messagesScrollView and inputMessageView.
messagesScrollView displays the messages, which is an array of GPTMessage instances. You created this previously along with the GPTClient. Upon checking the file hierarchy, you’ll see it already contains a folder for GPTClient, and this has all of the types you previously created in GPTClient and GPTModels.
inputMessageView creates a TextField and a Button that calls sendMessage.
When you press sendMessage right now, it merely sets isLoading to true, starts a task that sleeps and then adds the message you input into the messages array. It doesn’t actually call GPTClient, so this is why the app doesn’t ever get a response from ChatGPT – it isn’t talking to ChatGPT yet!
This is what you need to implement.
Before you do, take a closer look at GPTClient.swift.
You’ll see that it sets the default apiKey from a passed-in environment variable. Xcode can’t access your shell variables at runtime, but you can inject environment variables like this via a scheme. So, you need to actually set your OPEN_API_KEY in the scheme for it to be used by the app.
Once you’ve set your key here in the scheme, you can then start using GPTClient within ChatView.
First, define a new property for the client:
var client = GPTClient(model: .gpt35Turbo)
You just need to declare which model to use, and gpt35Turbo is a good model for most use cases.
GPTClient allows you to call the Chat API via sendChats. This requires that you pass in all of the messages at once, all of which will be used as context by ChatGPT to generate a response.
Remember that there’s a limit on the number of lines in the context, but in this simple use case, you can assume that you won’t hit it. In a real app, you might have to truncate the messages you send or handle this differently, such as using a different API from ChatGPT.
Modify sendMessages within ChatView to actually call the client with the messages:
private func sendMessage() {
// 1
isLoading = true
Task {
// 2
let message = GPTMessage(role: .user, content: inputText)
messages.append(message)
do {
// 3
let response = try await client.sendChats(messages)
isLoading = false
// 4
guard let reply = response.choices.first?.message else {
print("API error! There weren't any choices despite a
successful response")
return
}
// 5
messages.append(reply)
inputText.removeAll()
} catch {
// 6
isLoading = false
print("Got an error: \(error)")
}
}
}
Let’s go over this modified code in parts:
-
You first set
isLoadingas before, which displays aProgressViewwhile the messages are being sent to ChatGPT. -
You then create the new
messageand append it to themessagesarray. This will immediately display it within the scroll view. -
You send all of the messages to ChatGPT and wait for a response. When you get one, you set
isLoadingback tofalse. -
You check that there’s actually a
replyfrom ChatGPT within its response. If not, you simply print an error message. -
You append the
replytomessagesand clear the input text field to prepare for the next user input. -
In the event of a networking error while communicating with ChatGPT, you immediately set
isLoadingtofalseand simply print an error message.
Great, the app is now ready to send messages to ChatGPT! Build and run, and try it out.
Nice, your app is now integrated with ChatGPT! At this point, you can try asking ChatGPT about technical questions, and being the ever-helpful AI it is, you’ll get relevant suggestions and responses just with ChatGPT’s basic functionality.
In the next part, you’ll further customize ChatGPT to act as a “help desk assistant” and follow certain rules.