Create copilot auth popup UI

crates/theme/src/theme.rs

@@ -9,7 +9,7 @@ use gpui::{
 use serde::{de::DeserializeOwned, Deserialize};
 use serde_json::Value;
 use std::{collections::HashMap, sync::Arc};
-use ui::{CheckboxStyle, IconStyle};
+use ui::{ButtonStyle, CheckboxStyle, Dimensions, IconStyle, SvgStyle};
 
 pub mod ui;
 
@@ -76,8 +76,8 @@ pub struct Workspace {
 
 #[derive(Clone, Deserialize, Default)]
 pub struct BlankPaneStyle {
-    pub logo: IconStyle,
-    pub logo_shadow: IconStyle,
+    pub logo: SvgStyle,
+    pub logo_shadow: SvgStyle,
     pub logo_container: ContainerStyle,
     pub keyboard_hints: ContainerStyle,
     pub keyboard_hint: Interactive<ContainedText>,
@@ -118,8 +118,19 @@ pub struct AvatarStyle {
 
 #[derive(Deserialize, Default, Clone)]
 pub struct Copilot {
-    pub auth_modal: ContainerStyle,
-    pub auth_text: TextStyle,
+    pub auth: CopilotAuth,
+}
+
+#[derive(Deserialize, Default, Clone)]
+pub struct CopilotAuth {
+    pub popup_container: ContainerStyle,
+    pub popup_dimensions: Dimensions,
+    pub instruction_text: TextStyle,
+    pub user_code: TextStyle,
+    pub button: ButtonStyle,
+    pub button_width: f32,
+    pub copilot_icon: SvgStyle,
+    pub close_icon: Interactive<IconStyle>,
 }
 
 #[derive(Deserialize, Default)]
@@ -876,7 +887,7 @@ pub struct FeedbackStyle {
 #[derive(Clone, Deserialize, Default)]
 pub struct WelcomeStyle {
     pub page_width: f32,
-    pub logo: IconStyle,
+    pub logo: SvgStyle,
     pub logo_subheading: ContainedText,
     pub usage_note: ContainedText,
     pub checkbox: CheckboxStyle,

crates/theme/src/ui.rs

@@ -1,18 +1,22 @@
+use std::borrow::Cow;
+
 use gpui::{
     color::Color,
     elements::{
         ConstrainedBox, Container, ContainerStyle, Empty, Flex, KeystrokeLabel, Label,
         MouseEventHandler, ParentElement, Svg,
     },
-    Action, Element, ElementBox, EventContext, RenderContext, View,
+    geometry::vector::{vec2f, Vector2F},
+    scene::MouseClick,
+    Action, Element, ElementBox, EventContext, MouseButton, MouseState, RenderContext, View,
 };
 use serde::Deserialize;
 
-use crate::ContainedText;
+use crate::{ContainedText, Interactive};
 
 #[derive(Clone, Deserialize, Default)]
 pub struct CheckboxStyle {
-    pub icon: IconStyle,
+    pub icon: SvgStyle,
     pub label: ContainedText,
     pub default: ContainerStyle,
     pub checked: ContainerStyle,
@@ -44,7 +48,7 @@ pub fn checkbox_with_label<T: 'static, V: View>(
 ) -> MouseEventHandler<T> {
     MouseEventHandler::<T>::new(0, cx, |state, _| {
         let indicator = if checked {
-            icon(&style.icon)
+            svg(&style.icon)
         } else {
             Empty::new()
                 .constrained()
@@ -80,9 +84,9 @@ pub fn checkbox_with_label<T: 'static, V: View>(
 }
 
 #[derive(Clone, Deserialize, Default)]
-pub struct IconStyle {
+pub struct SvgStyle {
     pub color: Color,
-    pub icon: String,
+    pub asset: String,
     pub dimensions: Dimensions,
 }
 
@@ -92,14 +96,30 @@ pub struct Dimensions {
     pub height: f32,
 }
 
-pub fn icon(style: &IconStyle) -> ConstrainedBox {
-    Svg::new(style.icon.clone())
+impl Dimensions {
+    pub fn to_vec(&self) -> Vector2F {
+        vec2f(self.width, self.height)
+    }
+}
+
+pub fn svg(style: &SvgStyle) -> ConstrainedBox {
+    Svg::new(style.asset.clone())
         .with_color(style.color)
         .constrained()
         .with_width(style.dimensions.width)
         .with_height(style.dimensions.height)
 }
 
+#[derive(Clone, Deserialize, Default)]
+pub struct IconStyle {
+    icon: SvgStyle,
+    container: ContainerStyle,
+}
+
+pub fn icon(style: &IconStyle) -> Container {
+    svg(&style.icon).contained().with_style(style.container)
+}
+
 pub fn keystroke_label<V: View>(
     label_text: &'static str,
     label_style: &ContainedText,
@@ -147,3 +167,49 @@ pub fn keystroke_label_for(
         .contained()
         .with_style(label_style.container)
 }
+
+pub type ButtonStyle = Interactive<ContainedText>;
+
+pub fn cta_button<L, A, V>(
+    label: L,
+    action: A,
+    max_width: f32,
+    style: &ButtonStyle,
+    cx: &mut RenderContext<V>,
+) -> ElementBox
+where
+    L: Into<Cow<'static, str>>,
+    A: 'static + Action + Clone,
+    V: View,
+{
+    cta_button_with_click(label, max_width, style, cx, move |_, cx| {
+        cx.dispatch_action(action.clone())
+    })
+}
+
+pub fn cta_button_with_click<L, V, F>(
+    label: L,
+    max_width: f32,
+    style: &ButtonStyle,
+    cx: &mut RenderContext<V>,
+    f: F,
+) -> ElementBox
+where
+    L: Into<Cow<'static, str>>,
+    V: View,
+    F: Fn(MouseClick, &mut EventContext) + 'static,
+{
+    MouseEventHandler::<F>::new(0, cx, |state, _| {
+        let style = style.style_for(state, false);
+        Label::new(label, style.text.to_owned())
+            .aligned()
+            .contained()
+            .with_style(style.container)
+            .constrained()
+            .with_max_width(max_width)
+            .boxed()
+    })
+    .on_click(MouseButton::Left, f)
+    .with_cursor_style(gpui::CursorStyle::PointingHand)
+    .boxed()
+}