How to use AI for Wagtail upgrades

Sometimes my upgrades can go a little bit like this. They put the release notes where? And it just broke again! Why? I mean, who wouldn't want to turn a chore like this over to a robot? And fortunately, the current AI models out there are pretty good at compiling lots of information, bringing it together, and helping you make decisions. So we're going to look today at a AI agent skill recipe that my uh fellow core team member Tebow came up with. And we're gonna see how it does with upgrading the Wagtail. org website to 7. 3. So let's go ahead and dive in. Real quick, I'm gonna be wearing these glasses for the rest of the recording because I have chronic migraine and they're helpful to me.

First thing you should do is go grab the link to this blog post. I've included it down in the video description. It has the AI agent skill file as well as all the links to the different tools that we're going to be using. Alright, OpenCode is an open source AI coding agent. This is the agent tool that we're going to be using today. You're welcome to use another one if you happen to like clog code or anything along those lines. So definitely follow the installation instructions to get it on your system. And if you do already have a model that you like, you can go ahead and configure it with that model. But I definitely want to show you another really cool tool that I think that you would really appreciate.

Alright, so for the AI model we're going to be feeding into open code, we're going to use a model uh provided by NeuralWatt. And NeuroWatt is a tool that provides models with energy transparency. So you can not only see um how many tokens you use and how much things cost, but you can also see how much energy is being used whenever you run your particular tasks. So that way you can look at not just being efficient when it comes to costs, but also being efficient when it comes to energy. And honestly Honestly, I think that this is something great to encourage. I definitely love seeing more transparency around how much energy these models are using. And I think this is definitely a great thing to support.

Alright, so you're probably wondering, like, are they gonna ask for a credit card as soon as I sign up here? And the answer is no. Uh they do provide a few free tokens for you to play around with and the free tokens should be more than enough for you to try this recipe out a couple times if you want to. All right, so if we click into the dashboard here, um, I just want to point out that not only do you get a breakdown of like how much money you're using and how much tokens you're spending. on your particular activity and the number of requests you're making. So you also get a breakdown of the amount of energy that your requests are taking And I just think it's really cool to see these numbers and to get some transparency around this.

I totally think that this is something that we should be encouraging and doing more of. Alright, so to get going with using one of the models on NeuralWatt, you're definitely going to need an API key. So go here to manage API keys. And then I am definitely not going to show you the API key that I created earlier, but hit this big button here. Give your API key a name, something like Wagtail. uh upgrade, uh you can put test or something like that. And one other neat feature about NeuralWatt is that they do give you the option to flag your API keys as staging or development.

It helps you keep them more organized. And then you're gonna want to hit create key and you wanna copy that key and put it in a safe place. Alright, once we have our API key and we've put it in a very, very safe place that we will never ever publish on the internet because that would be very, very bad. Uh go ahead and head to the docs here and then scroll down until you get to the section on integrations. And so open up the integration guide for open code here and then follow the instructions here on how to get open code integrated with NeuralWatt. And so, you know, hopefully you've already installed OpenCode by this point in time,

but definitely follow the instructions here. here on to set up the API key, you're going to have to put the API key as an environmental variable in one of your shell profiles, whether you use ZSHRC or Bash RC. You'll definitely you might want to put it in both places just to make sure. You can also test this by doing an echo test in your terminal to make sure the API key gets returned, so that can be very useful And then you're going to want to create the open code config as well and copy this information over into that particular file. All right.

So let's hop over to my project and maybe I'll show you a little bit in the terminal as well. All right, welcome to the Wagtail. org repository in my VS Code. You're going to want to have a terminal window open and you're going to want to use uh whatever your preferred terminal text editor is or if you uh have a different text editor to open up your ZS HRC profile or your bash RC file and add your API key to it. I'm not gonna run this command because I don't want to expose some configurations to the API Entire internet, that's just a bad idea. Uh, but definitely uh run that yourself. And uh if you have any trouble, you can always uh ask some questions in the comments

Alright, and then you're definitely going to want to use your favorite code editor to open this particular file or create this particular config file here. Uh we'll just go ahead and open it up here. I've already copied and pasted over the config from NeuralWatt in the documentation. Uh so you can see that it has some JSON here and I'm telling it to use the Quen III Coder 480B model. And that's the one that I definitely want to use. If you want to use one of the other models on NeuroWatt, uh go to their API documentation and copy over the one that you want to use. Alright, we're going to exit out of that. I've already saved that.

If it prompts you to save, definitely save it. Alright, with that already configured, I'm going to go ahead and open up open code. I like creating a new terminal so that I can kind of keep these things uh you know, separated and keep track of them. I I also like to check my own Git status. I don't necessarily want the AI agent to do that every single time. So it's good to have two terminal windows open at least. So I'm going to go ahead and activate open code by typing in open code and hitting enter And now we have our open code interface up and running. So it looks a little bit squished on my screen. But it, you know, honestly, I think it's a pretty, pretty interface.

I thought they did a good job with that. And so you're definitely right now you can see that it already has a model tied in, which means that the config worked If the config doesn't work, you will get an error message. I fat fingered one of the brackets and it told me I had uh incorrect JSON, so it definitely might spit it back out if you do something like that. But for the most part, if you open it and you see the model name there, then you should be good to go. You can also switch things up to different models if you want to by using their connect command here And that way you can switch to a different provider if you want to pretty easily.

Alright, so I'm already in the directory for the project that I want to use. And so you want to make sure that you're in the main directory. I'm in the Wagtail. org directory. So the very first thing I'm going to do with open code is I'm going to run the init command here. And I'm going to do that and I'm going to hit enter. And what it's going to do is create an AI agent file. an agents. md file and it'll provide guidance and context for future agents that are working in the project. uh and just provide an overall view of the project that you're working with. So let's just uh go ahead and let open code do its thing

Alright, so OpenCode has made an agents. md file for us. You can scroll up a little bit if you want to see the output uh that the agent uh it it does a pretty good job of summarizing all the stuff that it's done. Uh so you can scroll through that if you want. And so let's go ahead and see if we can find, yep, here it is. This is the agent's MD file here. So you can see that it provides kind of an agent configuration for my particular project. And it basically went through and got an idea kind of like what sort of environment we use, what our CIs are, and things like that.

It just got a good overview of all the configuration that we use in our particular project. Alright, now that we have a agent's MD file, one other thing I did uh beforehand was copy over this upgrading Wagtail. uh. md file which is the one that Tebow provided in his blog post and I copied that over into the root directory to make sure that that was accessible. You can also get the link to it in the gist down in the video description as well if you don't want to fish through the blog post. Alright, so the next thing is to basically tell the agent to take this

recipe that I have for it and uh to execute it And so there are a few different ways that you can do this. If you want to go ahead and generate a PR. You can go ahead and tell it to do that already. I'm gonna just go ahead and tell it to follow the recipe because I kind of want to see what it does before we put anything up onto our repository So I'm just going to prompt it to, oops, let's make sure we're over here and clicking and and I'm just going to tell it please Follow the instructions in

and then you know honestly like I just like to make sure I'm being precise here and I'm just gonna go ahead and grab um the path here. Let's go with the relative path and see how it does with that. And that way I'm just telling it, hey, follow the instructions in this particular file. And we'll see what it comes up with. If you are like really confident or you're not particularly like concerned about what it would do with your GitHub repository, you can go ahead and tell it to do this whole thing and create a PR if you want to. I personally am still learning about this stuff and just would like to see what it does first before I put it. it up there.

And now that the agent is running, you can go do something else. You can uh catch up on the Olympics, you can put dinner in the oven. Um, you know, anything that makes Cheer Multitasker Heart happy. So one thing that I definitely didn't realize uh you know and this is why you should always read the recipe is that it is going to create a pull request right away. I thought I would have a chance to look at it before it pushed it up, uh, but it does Um and so uh and the other thing is because it does that, uh it definitely noticed that I already had a pull request from testing this earlier. Uh and the agents started interacting with that.

And so one of the cool things that it did is that it did notice um that uh the CI checks failed. Um so you know if we look at my uh pull request over here um when I did this earlier I I moved it into a draft you'll notice that it failed. um right here and the agent correctly identified that it was a failure in our JavaScript linter Um and it didn't like the formatting of the markdown files that I added uh didn't quite uh comply with things. And so it started trying to, you know, its its solution to the whole thing was to try uh and exclude certain files uh from ESLint

checks. So if we scroll all the way down here, the thing is that I don't I think it picked some rally rather random files. So I'm not sure that I would go with that solution. uh that it proposed. Um so so definitely some things about this process to be aware of. I think I would probably tweak it a little uh to make it a draft first versus a PR that would ping for review right away. Um maybe me and Tebo can figure something out uh like that. But overall, like you know, if you look at the report that it has um, you know, it noted that no code changes in the project were required for compatibility, which is the same conclusion I came to

And it provides a very good summary of all the different things that it checked. It also includes a detailed upgrade report. and a changelog entry so that you can see exactly what the agent tried to work on. And so Uh ultimately it came to the same conclusion that I did though, uh that no code changes were ultimately required for this upgrade. And would it do uh better with or worse with a uh major release upgrade? I don't know. I, you know, I'm gonna have to try this on something that is a bigger change. Um, you know, maybe we can find a really old site to upgrade uh with this agent and just see what happens

with it and whether it does uh a particularly good job going through the different upgrade things. That actually could be really fun. So, you know, I I actually know of an old site that I might try this out on. and uh report back on. Here's the version that I did. Like I said, I had a similar conclusion that no code changes were required. uh when I upgraded Wagtail. I went ahead and upgraded Django and Python while I was at it. So I also had to use PyUpgrade and a few other things. uh in order to get everything on our site up to date. Alright, and if you look at our NeuroWatt dashboard, you can see I pretty much used up the whole dollar of uh test

tokens that I had here to play around with. Um I only used about 0. 6 uh kilowatts of energy. I I'm honestly not sure off the top of my head how that compares to things. Uh maybe I can find an article that helped uh puts this in perspective. But I still think it's really neat that I can see kind of the total from all the activity that I had today. And you can also , if you go into the docs for NeuroWatt , and if we go down to the integration guide for OpenCode and take a closer look at the configs You can also add a optional command to look at the energy for each one of the requests

and also to check your energy consumption mid-session. So if you're somebody who's very focused on that, then this could be a great conf config for you to add Alright, so that's how you use an AI agent skill to upgrade your Wagtail website. Please go give it a try. Let us know how it works. I would love to hear more about that in the comments. Also, if you really enjoyed this recipe and you want more information about Wagtail , sign up for our newsletter. I will put the link down in the video description. And you can also subscribe to get more helpful videos like this one.