Build a Portable AI Companion with Discord’s User-Installable Apps (GPT 4o)
Tags: discord, node, programming, javascript
Published: 2024-06-18 14:30:00

Discord **[User-Installable Apps](https://discord.com/developers/docs/change-log#userinstallable-apps-preview)** are here, which means you can bring **[Discord Bots](https://docs.roboplay.dev/discord-bots/getting-started)** with you wherever you go - DMs and even other servers your bot isn't in. Best of all, they're not that different from regular bots!

So, what if you could have an AI companion that's always there to help you out, tell you jokes, and even give you advice? We'll be using **[Discord.js](https://discord.js.org/)** and **[Robo.js](https://roboplay.dev/docs)** to create one. Beginners are welcome!

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k2ibjaqnlx8gtnlj3d43.png)

Exciting, right? Let's get started.

## Creating Your Bot Project

Make sure you have **[Node.js](https://nodejs.org/)** and an editor like **[VS Code](https://code.visualstudio.com/)** installed then run the following in your **[terminal](https://www.freecodecamp.org/news/command-line-for-beginners/)**:

```bash
npx create-robo my-ai-companion -k bot
```

This will create a new **Discord.js** project ready to use as a **Discord Bot**, made easier with the **Robo.js** framework. We'll be opting out of **[TypeScript](https://docs.roboplay.dev/robojs/typescript)** to keep things simple.

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jasmcp2d8o4wmmfgnm8w.png)

{% embed https://dev.to/waveplay/how-to-build-a-discord-activity-easily-with-robojs-5bng %}

## Adding AI Capabilities

Now that we have a shiny new bot, let's give it some AI capabilities!

Normally, you'd have to handle commands, events, and AI logic yourself, but with **Robo.js**, you can use plugins to get it instantly. Install the **[@robojs/ai](https://docs.roboplay.dev/plugins/ai)** plugin using your **terminal**:

```bash
npx robo add @robojs/ai
```

**Ta-dah!** Your bot can now chat with users! ✨

... at least, it will once you get an OpenAI key. **[Sign up for OpenAI](https://platform.openai.com/signup)** and get your **[API key](https://platform.openai.com/api-keys)**. Once you have it, add it to your project's `.env` file:

```env
OPENAI_API_KEY="your-api-key-here"
```

You now have the `/chat` and `/imagine` slash commands from **@robojs/ai**.

## Making Your App User-Installable

User installable apps are new, so let's enable this feature in our project's configuration. Open the `robo.mjs` file in the `config` folder and add the following:

```js
export default {
	// ... rest of config
	experimental: {
		userInstall: true
	}
}
```

This will tell **Robo.js** to register all commands as user installable.

Next, enable the "User Install" authorization method for this app in the **[Discord Developer Portal](https://discord.com/developers/applications)** and give it the `application.commands` scope. Oh, and make sure the "Public Bot" setting is enabled. You can share the **Discord Provided Link** to let users install this app.

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0etr52w3691tlhd2yp5t.png)

## Trying It Out

Use the **Discord Provided Link** to install the app to your account then run your project in development mode:

```bash
npm run dev
```

Go on a test server or DM someone and try out the `/chat` command. Your AI companion should respond to you!

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pufuow6b47vc0vxcmmj1.png)

Wanna personalize your AI companion? Open the `ai.mjs` file in the `/config/plugins/robojs` folder and change the `systemMessage` to something you like better. You can change the `model` to something smarter like `gpt-4o`, or even feed it documents to learn from.

```js
export default {
	model: 'gpt-4o',
	systemMessage: 'You are Darth Vader. Respond like a Sith Lord.'
}
```

Learn more in the **[@robojs/ai documentation](https://docs.roboplay.dev/plugins/ai)**.

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/frf3sd0y0sx8pei6aeg8.png)

## Creating a Context Command

Talking to your AI is fun and all, but what if you want it to respond to other messages? **User-Installable Apps** support **[Context Commands](https://docs.roboplay.dev/discord-bots/commands)** too! They're different from **[Slash Commands](https://docs.roboplay.dev/discord-bots/context-menu)** as they take the context of the message into account.

Let's create a context command called `Reply` that responds to any message with "I have no idea what you're talking about" as a placeholder for now. Create a new file in the `/src/context/message` folder called `Reply.js`. Remember to create the folder if it doesn't exist.

```js
export default (interaction) => {
	interaction.reply("I have no idea what you're talking about")
}
```

Right click on the message you want to reply to, look for "Apps", and click on the `Reply` context command.

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ijndol3597gyp32svwzn.png)

Now let's replace the placeholder with a more meaningful response. **@robojs/ai** exports an `AI` object to get responses programatically. Update `Reply.js` to use it:

```js
import { AI } from '@robojs/ai'

export default async (_interaction, message) => {
	const response = await AI.chatSync([
		{
			content: message.content,
			role: 'user'
		}
	], {})
	
	return response.text ?? "I don't know what to say"
}
```

Now run the `Reply` context command on a message again and watch your AI companion respond!

![Image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sqi7098o4hexk1mrc87u.png)

**Why does it work, you ask?** You may have noticed that our bot was able to access `message.content` despite the "Message Content" intent being disabled. This is because **Context Commands** have access to message content by default.

The `interaction` object is also optional when using **Robo.js**. You can simply return the result instead of using `interaction.reply`. Replies are even automatically deferred when your default export is `async`.

## Enjoy Your New Companion!

Now that you have your own User-Installable AI companion, you can take it with you wherever you go on Discord. You can even share it with your friends! You can find the full code for this project written in **TypeScript** on as a **[Robo.js Template](https://docs.roboplay.dev/templates/overview)**.

➞ [🔗 **Template:** Purrth Vader AI](https://github.com/Wave-Play/robo.js/tree/main/templates/discord-bots/purrth-vader)

Check out the **[Robo.js documentation](https://roboplay.dev/docs)** for more cool features and plugins. You can even use it to **[build Discord Activities in seconds](https://dev.to/waveplay/how-to-build-a-discord-activity-easily-with-robojs-5bng)**!

Don't forget to **[join our Discord server](https://roboplay.dev/discord)** to chat with other developers, ask questions, and share your projects. We're here to help you build amazing apps with **Robo.js**! 🚀

{% embed https://roboplay.dev/discord %}

Our very own Robo, Sage, is there to answer any questions about Robo.js, Discord.js, and more.