Convert Self-Hosted Models List into Vue Component
What does this MR do and why?
This work will re-implement the existing page for displaying self-hosted models from the Admin dashboard. The goal is to re-write the existing HAML page and convert it to VueJS. The feature is behind a FF custom_models_vue_app
.
What this MR does:
- Extends the
SelfHostedModelsApp
component to display self-hosted models data if models are present - Uses Pyjamas components for UI
- Invokes
aiSelfHostedModels
query for data
Out of scope: Deleting a self hosted model from the models table. The button has been added in this MR, but the functionality which requires a new endpoint will be implemented in this issue
MR acceptance checklist
Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Screenshots or screen recordings
Web
Before | After |
---|---|
![]() |
![]() |
Mobile
Before | After |
---|---|
![]() |
![]() ![]() |
Note: When selecting the new CodeGemma
model type, the longer characters breaks styling as seen in second screenshot. I don't think this should matter too much as it's still usable and the feature is getting limited use behind a flag. Plus this page will likely be re-dseigned in future with the AI Settings Unification work
How to set up and validate locally
Prequisites
You will need:
- An active GitLab ultimate license
- Disable SAAS mode when running GDK
-
echo $GITLAB_SIMULATE_SAAS
should return0
- See the docs for more information
-
- Run the following commands in your terminal
add_on = GitlabSubscriptions::AddOn.find_or_create_by!(name: "code_suggestions") {|e| e.description = "Test"}
add_on_purchase = GitlabSubscriptions::AddOnPurchase.create!(add_on: add_on, expires_on: 1.month.from_now, quantity: 5, purchase_xid: 'A-S0001')
Feature.enable(:self_managed_code_suggestions)
Feature.enable(:ai_custom_model)
Feature.enable(:custom_models_vue_app)
ApplicationSetting.first.update(duo_features_enabled: true)
- Navigate to your GDK instance in browser
- Click on "Admin" button at the bottom of the left sidebar
- Open the "AI powered Features" drop down in the admin area sidebar
- Click on "Models"
- You may may be asked to accept some terms and conditions with usage (accept them)
- If you do not have any models set up, you will see an empty state where you will be prompted to create a new one
- Create new models. You should see a list of models now.
Related to #463134 (closed)