Loading
Rework Duo panel trial and access-denied empty states
What does this MR do and why?
This MR reworks two empty states in the GitLab Duo chat panel. Both are shown when a namespace has no GitLab Duo access yet:
- The start-trial state, shown to users who can start a trial (typically group Owners).
- The access-denied state, shown to everyone else.
Implementation notes:
- The "Get things done" card is a new shared component,
duo_workflow_examples_card.vue, used by both states. DuoChatPanel::StartTrialComponentemits a newbuy_credits_pathdata attribute.chat_panel_config.jspasses it through as a prop to the blocked-state view and then to the start-trial state.- Two new internal event labels,
click_duo_agentic_not_available_empty_state_buy_creditsandclick_duo_agentic_not_available_empty_state_learn_more_credits, with event definitions added underee/config/events/. - The access-denied component dropped its
containerTypeprop, since the new copy always says "group".
This is a net improvement, not an experiment, and ships without a feature flag. The design is in Figma; the issue holds the link.
Changelog: changed, EE only.
References
- Issue: https://gitlab.com/gitlab-org/gitlab/-/work_items/607724
- Designer decision on hiding the credits card without a purchase path: https://gitlab.com/gitlab-org/gitlab/-/work_items/607724#note_3885721069
Screenshots or screen recordings
Panel captured on GDK in SaaS mode, 400 px wide.
How to set up and validate locally
- Run GDK in SaaS mode:
export GITLAB_SIMULATE_SAAS=1before starting or restartingrails-web. - Create a group on the Free plan with no GitLab Duo add-on or trial. Add one user as Owner and another as Developer.
- Sign in as the Owner, open any page inside the group, and open the GitLab Duo panel from the right side of the top bar. You should see the start-trial state with the trial card, the credits card, and the "Get things done" card. The "Buy credits" button should point at the Customers Portal purchase-credits URL for the group.
- Sign in as the Developer and repeat. You should see the access-denied state with the new heading and description, and only the "Get things done" card.
- Optional: as the Owner, open a project in your personal namespace. You should see the start-trial state without the credits card and with the shorter description.
- Optional: run the specs:
yarn jest ee/spec/frontend/ai/duo_agentic_chat/components ee/spec/frontend/ai/utils/chat_panel_config_spec.jsbin/rspec ee/spec/components/duo_chat_panel/start_trial_component_spec.rb
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Edited by Roy Liu




