From 6b2e909ff943ba69d37bc33f367ecbf18ce70feb Mon Sep 17 00:00:00 2001 From: jasonkeung Date: Mon, 1 Jun 2026 21:04:04 +0000 Subject: [PATCH] Add docs link for agent API keys Co-Authored-By: Oz --- .../platform/create_api_key_modal.rs | 44 ++++++++++++++----- 1 file changed, 33 insertions(+), 11 deletions(-) diff --git a/app/src/settings_view/platform/create_api_key_modal.rs b/app/src/settings_view/platform/create_api_key_modal.rs index af75840fed..93a19d007a 100644 --- a/app/src/settings_view/platform/create_api_key_modal.rs +++ b/app/src/settings_view/platform/create_api_key_modal.rs @@ -1,11 +1,12 @@ use chrono::Utc; +use markdown_parser::{FormattedText, FormattedTextFragment, FormattedTextLine}; use pathfinder_geometry::vector::vec2f; use warp_core::features::FeatureFlag; use warpui::elements::{ Border, ChildAnchor, ChildView, ConstrainedBox, Container, CornerRadius, CrossAxisAlignment, - Empty, Expanded, Fill, Flex, MainAxisAlignment, MainAxisSize, MouseStateHandle, - OffsetPositioning, Padding, ParentElement, PositionedElementAnchor, - PositionedElementOffsetBounds, Radius, SavePosition, Stack, Text, + Empty, Expanded, Fill, Flex, FormattedTextElement, HighlightedHyperlink, MainAxisAlignment, + MainAxisSize, MouseStateHandle, OffsetPositioning, Padding, ParentElement, + PositionedElementAnchor, PositionedElementOffsetBounds, Radius, SavePosition, Stack, Text, }; use warpui::ui_components::button::ButtonVariant; use warpui::ui_components::components::{Coords, UiComponent, UiComponentStyles}; @@ -29,6 +30,8 @@ use crate::view_components::{Dropdown as DropdownView, DropdownItem}; use crate::workspaces::user_workspaces::UserWorkspaces; const OZ_AGENTS_URL: &str = "https://oz.warp.dev/agents?new=true"; +const API_KEY_DOCS_URL: &str = + "https://docs.warp.dev/reference/cli/api-keys/#personal-vs-agent-keys"; const LABEL_FONT_SIZE: f32 = 14.; const INPUT_WIDTH: f32 = 428.; // 460px - (2 * 16px) padding @@ -601,14 +604,33 @@ impl View for CreateApiKeyModal { RequestState::Succeeded => self.render_success_content(app), _ => { let selected_key_type = self.api_key_type_control.as_ref(app).selected_option(); - - let description_text = Text::new( - selected_key_type.description(), - appearance.ui_font_family(), - LABEL_FONT_SIZE, - ) - .with_color(theme.nonactive_ui_text_color().into()) - .finish(); + let description_text = if selected_key_type == ApiKeyType::Agent { + FormattedTextElement::new( + FormattedText::new([FormattedTextLine::Line(vec![ + FormattedTextFragment::plain_text(selected_key_type.description()), + FormattedTextFragment::plain_text(" "), + FormattedTextFragment::hyperlink("Learn more", API_KEY_DOCS_URL), + ])]), + LABEL_FONT_SIZE, + appearance.ui_font_family(), + appearance.ui_font_family(), + theme.nonactive_ui_text_color().into(), + HighlightedHyperlink::default(), + ) + .with_hyperlink_font_color(theme.accent().into_solid()) + .register_default_click_handlers(|url, _, ctx| { + ctx.open_url(&url.url); + }) + .finish() + } else { + Text::new( + selected_key_type.description(), + appearance.ui_font_family(), + LABEL_FONT_SIZE, + ) + .with_color(theme.nonactive_ui_text_color().into()) + .finish() + }; let name_label = Text::new("Name", appearance.ui_font_family(), LABEL_FONT_SIZE) .with_color(theme.active_ui_text_color().into())