# CodiumAI PR-Agent，在 GitLab 上用 AI 來 Code Review

## 本篇要解決的問題

最近看到有人寫了一篇用 AI 來 Code Review 的文章後，才發現原來有開源的好工具可以來使用，也剛好組內也有人提說，要不要來 Code Review，但因為需求常常太多，光開發就沒什麼時間了，就沒有時間來看 Code Review 這工程。

如果 AI Code Review 真的好用，那之後就要來想辦法看能不能做在開發流程裡。

這篇先研究 GitLab 的版本，之後有時間再來看 GitHub 版的。

本篇主要看到的參考文章是這篇：[將 AI Code Review 整進 CICD Day1](https://ithelp.ithome.com.tw/articles/10344761)

因為作者主要用的程式語言是 Python，所以 August 在實作前端的部份時，主要使用的程式碼都來自於官方的說明文件，以下是參考來源：

- [GitLab：Run as a GitLab Pipeline](https://pr-agent-docs.codium.ai/installation/gitlab/)
- [Configuration File](https://pr-agent-docs.codium.ai/usage-guide/configuration_options/)
- [Changing a Model](https://pr-agent-docs.codium.ai/usage-guide/changing_a_model/)

---

## 準備好必要東西：GitLab 帳號及 Token、OpenAI API Key

本篇主要是在 GitLab 上執行 AI Code Review，所以必要的東西就是標題上寫的這三項：

### GitLab 帳號

GitLab 帳號是免費的就可以申請的。

進到官方註冊頁面，可以使用信箱或第三方帳戶進行註冊：<https://gitlab.com/users/sign_up>。

### GitLab Access Token

註冊好 GitLab 帳號後，進到後台的 [Access tokens](https://gitlab.com/-/user_settings/personal_access_tokens) 的頁面中，就可以開始新增一組 Token。

![點擊 新增令牌](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m0pz77niuxc9gsjaw50z.png)

設定 Token 的部份：

1 先寫好一個自己認得出功用的名稱。

2 到期時間可以點擊「X」把日期欄位清空，這樣就會是預設的 1 年以內有效。

3 選取範圍，第一個「api」打勾。

![設定 Token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1bqzdt1c6jy35nvbkygj.png)

這三步做完後，最後點擊下方的「建立 個人存取令牌」，就會產生一組 Token，畫面如下：

![複製 Token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7dyxx70ak1zzzv5swaw8.png)

點擊上圖框起來的按鈕，就可以複製這組新建的 Token，複製好後，我們要自行存起來，如果這邊沒存到，以後要再存就要再重新生成一組新的。

### OpenAI API Key

這點要注意的是，每次 API 的調用，都需要酷錢錢~

而且現在好像是要先刷一筆金額進去，比方 5 美金後，才能開始使用的預付制，之前 August 因為沒有先預付，所以 API 一直調用不起來，直接先刷了 5 美金後才成功。

但也不用緊張，因為 OpenAI 的 API 費用愈來愈便宜了，之後我們會有一步是改用 GPT-4o-mini，就可以大量的來使用。

取得 API Key 的方式很簡單，先進到 OpenAI 的 API Key 後台：[API Key](https://platform.openai.com/api-keys)。

點擊右上角的 Create 的按鈕

![點擊 Create](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9etpii322r3ro4ii0xsm.png)

接著就是取一個認得出來在做什麼的名字，然後再點擊 Create。

![建立 Key](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r7mmy2vtey4gysuwgf89.png)

建立成功，就會看到畫面上顯示著 Key，最後只需要按下 Copy，把這組 Key 給存下來即可。

![取得 Key](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qbdbmnctb5l6yfx4gxf1.png)

---

## GitLab 專案，設定 env 變數

上面一步我們取得了 GitLab Access Token，跟 OpenAI API Key，這二個是很重要的，不能隨意的寫在明碼上，必須要放在環境變數上，一般我們開發時會建一個 `.env` 檔來用，GitLab 的話則是有一個介面讓使用者直接填寫。

GitLab 開好專案後，點擊左側選單的「設定 > CI/CD」：

![進到 CI/CD 設定](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/idedt1votbjnw3wlnpbe.png)

接著打開「變數」的這項，再點擊「新增變數」：

![新增變數](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vrai6mzzyyj0gvn9udkv.png)

需要新增的變數就是我們手上有的二個，我們先新增第一個 GitLab Access Token：

![建立變數](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xk2b6ynt20nlh26crkoi.png)

「保護變數」的部份，照官方說明，如果我們的分支不是保護狀態的話，這個必須要取消勾勾，不然流水線執行時會取不到。

「主鍵」填寫 `GITLAB_PERSONAL_ACCESS_TOKEN`。

「值」填寫我們上一步取得的 GitLab Access Token。

最後按下「新增變數」，就新增了。

之後還要再新增 OpenAI API Key，方式一樣，在「主鍵」的部份改成 `OPENAI_KEY` 就行。

都建立完後，會看到我們的變數清單像這樣子：

![變數清單](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kouk4skwtbi9fdietsb8.png)

---

## 提交必要檔案

接著，我們把官方提供的程式碼，提交到 GitLab 專案上，就可以使用 AI Code Review 了。

### 1 .pr_agent.toml

這個檔案是 AI Code Review 的設定檔，我們要在這個檔案中指定使用的 Model 是 gpt-4o-mini，如果不特別指定，我們 OpenAI API 的費用就會看見飛高高，高到心臟不夠強的話會覺得原來自己在財力上很渺小 XD。

專案根目錄下，新增名為「.pr_agent.toml」的檔案，檔案內容如下：

```toml
[config]
model = "gpt-4o-mini-2024-07-18"
model_turbo = "gpt-4o-mini-2024-07-18"
fallback_models = ["gpt-4o-mini-2024-07-18", "gpt-4o-mini"]
```

這個檔案建立了以後，先提交到 GitLab 上。

先提交到 GitLab 上！

先提交到 GitLab 上！！

先提交到 GitLab 上！！！

因為很重要，所以多說三次。

如果不先把這個檔提交上去，下一步我們把 gitlab-ci 檔提交上去後，預設會先執行的是 gpt4-turbo 的 model，就會看到酷錢錢跟水一樣流走。

因為這套 AI Code Review 是在合併請求時，才會執行，所以 GitLab 預設分支是 `main`，August 另外建了一個 `master` 分支，來讓後續可以執行合併。

第一次把 pr_agent 提交上去後，就會有合併的提示，就要先合併了。

![合併請求提示](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zipacwd1dke0gmfc257t.png)

### .gitlab-ci.yml

這個檔案就是啟動 AI Code Review 用的，在 GitLab CI/CD 時，如果是合併請求的話，就會執行。

專案根目錄下新增名為「.gitlab-ci.yml」的檔案，檔案內容如下：

```yaml
stages:
  - pr_agent

pr_agent_job:
  stage: pr_agent
  image: 
    name: codiumai/pr-agent:latest
    entrypoint: [""]
  script:
    - cd /app
    - echo "Running PR Agent action step"
    - export MR_URL="$CI_MERGE_REQUEST_PROJECT_URL/merge_requests/$CI_MERGE_REQUEST_IID"
    - echo "MR_URL=$MR_URL"
    - export gitlab__PERSONAL_ACCESS_TOKEN=$GITLAB_PERSONAL_ACCESS_TOKEN 
    - export config__git_provider="gitlab"
    - export openai__key=$OPENAI_KEY
    - python -m pr_agent.cli --pr_url="$MR_URL" describe
    - python -m pr_agent.cli --pr_url="$MR_URL" review
    - python -m pr_agent.cli --pr_url="$MR_URL" improve
  rules:
    - if: '$CI_PIPELINE_SOURCE == "merge_request_event"'
```

檔案建立完後，也可以先提交了，或是想之後開發到一個階段再提交也可以。

這個檔案一提交上去，之後只要有合併請求，就會自動觸發 AI Code Review。

---

## 測試一下威力

最後我們來測試一下 AI Code Review 強不強大。

說是測試，臨時也想不到什麼厲害的錯誤程式碼，所以就讓 GPT 寫了一個：

```js
function calculateSum(a, b) {
  return a + b;
}

let sum = calculateSum(5, 10;
console.log("Sum is: " + sum);
```

很明顯就是有新手錯誤（咦），然後我們提交上去後，會看到合併請求的提示：

![第二次合併請求](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mxl0ild9p0skalqzdwzk.png)

建立了合併請求後，就會看到流水線自動在執行：

![自動執行流水線](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/htc6hme4pxppkoptl84l.png)

流水線執行完後，就會看到通過的訊息：

![流水線通過](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3fuozw9b8nuh9p1egxt6.png)

頁面往下滑，就會看見 AI 給的 Code Review 結果：

![Code Review 結果](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8qbkl0n3lfvi3rwi83ft.png)

很明顯的有把錯誤指出來，還會給出錯誤的嚴重程度。

---

## 小結一下

這套 AI Code Review 的工具真的好用，除了 Code Review，還會給分數、自動下標籤、提供描述。

gpt-4o-mini 又是使用成本很低的一個 Model，這幾天不斷的嘗試下來，大概只用掉了 0.1 美金。

However，因為有被說不能把程式碼放上 GitLab、GitHub 等外部平台，所以這個工具還是難以推坑給其他同事。

此外，August 希望在每次 Commit 時就進行 Code Review，以避免提交上線後出現無法回頭的狀況。

下一篇，August 會寫的筆記文就是不依賴 GitLab 的 Pipeline，而且可以在開發者按下 Commit 時，就自動執行 AI Code Review 的方式，敬請期待~