extensions_ui.rs

   1mod components;
   2mod extension_suggest;
   3mod extension_version_selector;
   4
   5use std::sync::OnceLock;
   6use std::time::Duration;
   7use std::{ops::Range, sync::Arc};
   8
   9use client::{ExtensionMetadata, ExtensionProvides};
  10use collections::{BTreeMap, BTreeSet};
  11use editor::{Editor, EditorElement, EditorStyle};
  12use extension_host::{ExtensionManifest, ExtensionOperation, ExtensionStore};
  13use fuzzy::{match_strings, StringMatchCandidate};
  14use gpui::{
  15    actions, uniform_list, Action, App, ClipboardItem, Context, Entity, EventEmitter, Flatten,
  16    Focusable, InteractiveElement, KeyContext, ParentElement, Render, Styled, Task, TextStyle,
  17    UniformListScrollHandle, WeakEntity, Window,
  18};
  19use num_format::{Locale, ToFormattedString};
  20use project::DirectoryLister;
  21use release_channel::ReleaseChannel;
  22use settings::Settings;
  23use strum::IntoEnumIterator as _;
  24use theme::ThemeSettings;
  25use ui::{prelude::*, CheckboxWithLabel, ContextMenu, PopoverMenu, ToggleButton, Tooltip};
  26use vim_mode_setting::VimModeSetting;
  27use workspace::{
  28    item::{Item, ItemEvent},
  29    Workspace, WorkspaceId,
  30};
  31use zed_actions::ExtensionCategoryFilter;
  32
  33use crate::components::{ExtensionCard, FeatureUpsell};
  34use crate::extension_version_selector::{
  35    ExtensionVersionSelector, ExtensionVersionSelectorDelegate,
  36};
  37
  38actions!(zed, [InstallDevExtension]);
  39
  40pub fn init(cx: &mut App) {
  41    cx.observe_new(move |workspace: &mut Workspace, window, cx| {
  42        let Some(window) = window else {
  43            return;
  44        };
  45        workspace
  46            .register_action(
  47                move |workspace, action: &zed_actions::Extensions, window, cx| {
  48                    let provides_filter = action.category_filter.map(|category| match category {
  49                        ExtensionCategoryFilter::Themes => ExtensionProvides::Themes,
  50                        ExtensionCategoryFilter::IconThemes => ExtensionProvides::IconThemes,
  51                        ExtensionCategoryFilter::Languages => ExtensionProvides::Languages,
  52                        ExtensionCategoryFilter::Grammars => ExtensionProvides::Grammars,
  53                        ExtensionCategoryFilter::LanguageServers => {
  54                            ExtensionProvides::LanguageServers
  55                        }
  56                        ExtensionCategoryFilter::ContextServers => {
  57                            ExtensionProvides::ContextServers
  58                        }
  59                        ExtensionCategoryFilter::SlashCommands => ExtensionProvides::SlashCommands,
  60                        ExtensionCategoryFilter::IndexedDocsProviders => {
  61                            ExtensionProvides::IndexedDocsProviders
  62                        }
  63                        ExtensionCategoryFilter::Snippets => ExtensionProvides::Snippets,
  64                    });
  65
  66                    let existing = workspace
  67                        .active_pane()
  68                        .read(cx)
  69                        .items()
  70                        .find_map(|item| item.downcast::<ExtensionsPage>());
  71
  72                    if let Some(existing) = existing {
  73                        if provides_filter.is_some() {
  74                            existing.update(cx, |extensions_page, cx| {
  75                                extensions_page.change_provides_filter(provides_filter, cx);
  76                            });
  77                        }
  78
  79                        workspace.activate_item(&existing, true, true, window, cx);
  80                    } else {
  81                        let extensions_page =
  82                            ExtensionsPage::new(workspace, provides_filter, window, cx);
  83                        workspace.add_item_to_active_pane(
  84                            Box::new(extensions_page),
  85                            None,
  86                            true,
  87                            window,
  88                            cx,
  89                        )
  90                    }
  91                },
  92            )
  93            .register_action(move |workspace, _: &InstallDevExtension, window, cx| {
  94                let store = ExtensionStore::global(cx);
  95                let prompt = workspace.prompt_for_open_path(
  96                    gpui::PathPromptOptions {
  97                        files: false,
  98                        directories: true,
  99                        multiple: false,
 100                    },
 101                    DirectoryLister::Local(workspace.app_state().fs.clone()),
 102                    window,
 103                    cx,
 104                );
 105
 106                let workspace_handle = cx.entity().downgrade();
 107                window
 108                    .spawn(cx, async move |cx| {
 109                        let extension_path =
 110                            match Flatten::flatten(prompt.await.map_err(|e| e.into())) {
 111                                Ok(Some(mut paths)) => paths.pop()?,
 112                                Ok(None) => return None,
 113                                Err(err) => {
 114                                    workspace_handle
 115                                        .update(cx, |workspace, cx| {
 116                                            workspace.show_portal_error(err.to_string(), cx);
 117                                        })
 118                                        .ok();
 119                                    return None;
 120                                }
 121                            };
 122
 123                        let install_task = store
 124                            .update(cx, |store, cx| {
 125                                store.install_dev_extension(extension_path, cx)
 126                            })
 127                            .ok()?;
 128
 129                        match install_task.await {
 130                            Ok(_) => {}
 131                            Err(err) => {
 132                                workspace_handle
 133                                    .update(cx, |workspace, cx| {
 134                                        workspace.show_error(
 135                                            &err.context("failed to install dev extension"),
 136                                            cx,
 137                                        );
 138                                    })
 139                                    .ok();
 140                            }
 141                        }
 142
 143                        Some(())
 144                    })
 145                    .detach();
 146            });
 147
 148        cx.subscribe_in(workspace.project(), window, |_, _, event, window, cx| {
 149            if let project::Event::LanguageNotFound(buffer) = event {
 150                extension_suggest::suggest(buffer.clone(), window, cx);
 151            }
 152        })
 153        .detach();
 154    })
 155    .detach();
 156}
 157
 158fn extension_provides_label(provides: ExtensionProvides) -> &'static str {
 159    match provides {
 160        ExtensionProvides::Themes => "Themes",
 161        ExtensionProvides::IconThemes => "Icon Themes",
 162        ExtensionProvides::Languages => "Languages",
 163        ExtensionProvides::Grammars => "Grammars",
 164        ExtensionProvides::LanguageServers => "Language Servers",
 165        ExtensionProvides::ContextServers => "Context Servers",
 166        ExtensionProvides::SlashCommands => "Slash Commands",
 167        ExtensionProvides::IndexedDocsProviders => "Indexed Docs Providers",
 168        ExtensionProvides::Snippets => "Snippets",
 169    }
 170}
 171
 172#[derive(Clone)]
 173pub enum ExtensionStatus {
 174    NotInstalled,
 175    Installing,
 176    Upgrading,
 177    Installed(Arc<str>),
 178    Removing,
 179}
 180
 181#[derive(Debug, PartialEq, Eq, PartialOrd, Ord, Hash, Clone, Copy)]
 182enum ExtensionFilter {
 183    All,
 184    Installed,
 185    NotInstalled,
 186}
 187
 188impl ExtensionFilter {
 189    pub fn include_dev_extensions(&self) -> bool {
 190        match self {
 191            Self::All | Self::Installed => true,
 192            Self::NotInstalled => false,
 193        }
 194    }
 195}
 196
 197#[derive(Debug, PartialEq, Eq, PartialOrd, Ord, Hash, Clone, Copy)]
 198enum Feature {
 199    Git,
 200    OpenIn,
 201    Vim,
 202    LanguageBash,
 203    LanguageC,
 204    LanguageCpp,
 205    LanguageGo,
 206    LanguagePython,
 207    LanguageReact,
 208    LanguageRust,
 209    LanguageTypescript,
 210}
 211
 212fn keywords_by_feature() -> &'static BTreeMap<Feature, Vec<&'static str>> {
 213    static KEYWORDS_BY_FEATURE: OnceLock<BTreeMap<Feature, Vec<&'static str>>> = OnceLock::new();
 214    KEYWORDS_BY_FEATURE.get_or_init(|| {
 215        BTreeMap::from_iter([
 216            (Feature::Git, vec!["git"]),
 217            (
 218                Feature::OpenIn,
 219                vec![
 220                    "github",
 221                    "gitlab",
 222                    "bitbucket",
 223                    "codeberg",
 224                    "sourcehut",
 225                    "permalink",
 226                    "link",
 227                    "open in",
 228                ],
 229            ),
 230            (Feature::Vim, vec!["vim"]),
 231            (Feature::LanguageBash, vec!["sh", "bash"]),
 232            (Feature::LanguageC, vec!["c", "clang"]),
 233            (Feature::LanguageCpp, vec!["c++", "cpp", "clang"]),
 234            (Feature::LanguageGo, vec!["go", "golang"]),
 235            (Feature::LanguagePython, vec!["python", "py"]),
 236            (Feature::LanguageReact, vec!["react"]),
 237            (Feature::LanguageRust, vec!["rust", "rs"]),
 238            (
 239                Feature::LanguageTypescript,
 240                vec!["type", "typescript", "ts"],
 241            ),
 242        ])
 243    })
 244}
 245
 246pub struct ExtensionsPage {
 247    workspace: WeakEntity<Workspace>,
 248    list: UniformListScrollHandle,
 249    is_fetching_extensions: bool,
 250    filter: ExtensionFilter,
 251    remote_extension_entries: Vec<ExtensionMetadata>,
 252    dev_extension_entries: Vec<Arc<ExtensionManifest>>,
 253    filtered_remote_extension_indices: Vec<usize>,
 254    query_editor: Entity<Editor>,
 255    query_contains_error: bool,
 256    provides_filter: Option<ExtensionProvides>,
 257    _subscriptions: [gpui::Subscription; 2],
 258    extension_fetch_task: Option<Task<()>>,
 259    upsells: BTreeSet<Feature>,
 260}
 261
 262impl ExtensionsPage {
 263    pub fn new(
 264        workspace: &Workspace,
 265        provides_filter: Option<ExtensionProvides>,
 266        window: &mut Window,
 267        cx: &mut Context<Workspace>,
 268    ) -> Entity<Self> {
 269        cx.new(|cx| {
 270            let store = ExtensionStore::global(cx);
 271            let workspace_handle = workspace.weak_handle();
 272            let subscriptions = [
 273                cx.observe(&store, |_: &mut Self, _, cx| cx.notify()),
 274                cx.subscribe_in(
 275                    &store,
 276                    window,
 277                    move |this, _, event, window, cx| match event {
 278                        extension_host::Event::ExtensionsUpdated => {
 279                            this.fetch_extensions_debounced(cx)
 280                        }
 281                        extension_host::Event::ExtensionInstalled(extension_id) => this
 282                            .on_extension_installed(
 283                                workspace_handle.clone(),
 284                                extension_id,
 285                                window,
 286                                cx,
 287                            ),
 288                        _ => {}
 289                    },
 290                ),
 291            ];
 292
 293            let query_editor = cx.new(|cx| {
 294                let mut input = Editor::single_line(window, cx);
 295                input.set_placeholder_text("Search extensions...", cx);
 296                input
 297            });
 298            cx.subscribe(&query_editor, Self::on_query_change).detach();
 299
 300            let mut this = Self {
 301                workspace: workspace.weak_handle(),
 302                list: UniformListScrollHandle::new(),
 303                is_fetching_extensions: false,
 304                filter: ExtensionFilter::All,
 305                dev_extension_entries: Vec::new(),
 306                filtered_remote_extension_indices: Vec::new(),
 307                remote_extension_entries: Vec::new(),
 308                query_contains_error: false,
 309                provides_filter,
 310                extension_fetch_task: None,
 311                _subscriptions: subscriptions,
 312                query_editor,
 313                upsells: BTreeSet::default(),
 314            };
 315            this.fetch_extensions(None, Some(BTreeSet::from_iter(this.provides_filter)), cx);
 316            this
 317        })
 318    }
 319
 320    fn on_extension_installed(
 321        &mut self,
 322        workspace: WeakEntity<Workspace>,
 323        extension_id: &str,
 324        window: &mut Window,
 325        cx: &mut Context<Self>,
 326    ) {
 327        let extension_store = ExtensionStore::global(cx).read(cx);
 328        let themes = extension_store
 329            .extension_themes(extension_id)
 330            .map(|name| name.to_string())
 331            .collect::<Vec<_>>();
 332        if !themes.is_empty() {
 333            workspace
 334                .update(cx, |_workspace, cx| {
 335                    window.dispatch_action(
 336                        zed_actions::theme_selector::Toggle {
 337                            themes_filter: Some(themes),
 338                        }
 339                        .boxed_clone(),
 340                        cx,
 341                    );
 342                })
 343                .ok();
 344            return;
 345        }
 346
 347        let icon_themes = extension_store
 348            .extension_icon_themes(extension_id)
 349            .map(|name| name.to_string())
 350            .collect::<Vec<_>>();
 351        if !icon_themes.is_empty() {
 352            workspace
 353                .update(cx, |_workspace, cx| {
 354                    window.dispatch_action(
 355                        zed_actions::icon_theme_selector::Toggle {
 356                            themes_filter: Some(icon_themes),
 357                        }
 358                        .boxed_clone(),
 359                        cx,
 360                    );
 361                })
 362                .ok();
 363        }
 364    }
 365
 366    /// Returns whether a dev extension currently exists for the extension with the given ID.
 367    fn dev_extension_exists(extension_id: &str, cx: &mut Context<Self>) -> bool {
 368        let extension_store = ExtensionStore::global(cx).read(cx);
 369
 370        extension_store
 371            .dev_extensions()
 372            .any(|dev_extension| dev_extension.id.as_ref() == extension_id)
 373    }
 374
 375    fn extension_status(extension_id: &str, cx: &mut Context<Self>) -> ExtensionStatus {
 376        let extension_store = ExtensionStore::global(cx).read(cx);
 377
 378        match extension_store.outstanding_operations().get(extension_id) {
 379            Some(ExtensionOperation::Install) => ExtensionStatus::Installing,
 380            Some(ExtensionOperation::Remove) => ExtensionStatus::Removing,
 381            Some(ExtensionOperation::Upgrade) => ExtensionStatus::Upgrading,
 382            None => match extension_store.installed_extensions().get(extension_id) {
 383                Some(extension) => ExtensionStatus::Installed(extension.manifest.version.clone()),
 384                None => ExtensionStatus::NotInstalled,
 385            },
 386        }
 387    }
 388
 389    fn filter_extension_entries(&mut self, cx: &mut Context<Self>) {
 390        self.filtered_remote_extension_indices.clear();
 391        self.filtered_remote_extension_indices.extend(
 392            self.remote_extension_entries
 393                .iter()
 394                .enumerate()
 395                .filter(|(_, extension)| match self.filter {
 396                    ExtensionFilter::All => true,
 397                    ExtensionFilter::Installed => {
 398                        let status = Self::extension_status(&extension.id, cx);
 399                        matches!(status, ExtensionStatus::Installed(_))
 400                    }
 401                    ExtensionFilter::NotInstalled => {
 402                        let status = Self::extension_status(&extension.id, cx);
 403
 404                        matches!(status, ExtensionStatus::NotInstalled)
 405                    }
 406                })
 407                .map(|(ix, _)| ix),
 408        );
 409        cx.notify();
 410    }
 411
 412    fn fetch_extensions(
 413        &mut self,
 414        search: Option<String>,
 415        provides_filter: Option<BTreeSet<ExtensionProvides>>,
 416        cx: &mut Context<Self>,
 417    ) {
 418        self.is_fetching_extensions = true;
 419        cx.notify();
 420
 421        let extension_store = ExtensionStore::global(cx);
 422
 423        let dev_extensions = extension_store.update(cx, |store, _| {
 424            store.dev_extensions().cloned().collect::<Vec<_>>()
 425        });
 426
 427        let remote_extensions = extension_store.update(cx, |store, cx| {
 428            store.fetch_extensions(search.as_deref(), provides_filter.as_ref(), cx)
 429        });
 430
 431        cx.spawn(async move |this, cx| {
 432            let dev_extensions = if let Some(search) = search {
 433                let match_candidates = dev_extensions
 434                    .iter()
 435                    .enumerate()
 436                    .map(|(ix, manifest)| StringMatchCandidate::new(ix, &manifest.name))
 437                    .collect::<Vec<_>>();
 438
 439                let matches = match_strings(
 440                    &match_candidates,
 441                    &search,
 442                    false,
 443                    match_candidates.len(),
 444                    &Default::default(),
 445                    cx.background_executor().clone(),
 446                )
 447                .await;
 448                matches
 449                    .into_iter()
 450                    .map(|mat| dev_extensions[mat.candidate_id].clone())
 451                    .collect()
 452            } else {
 453                dev_extensions
 454            };
 455
 456            let fetch_result = remote_extensions.await;
 457            this.update(cx, |this, cx| {
 458                cx.notify();
 459                this.dev_extension_entries = dev_extensions;
 460                this.is_fetching_extensions = false;
 461                this.remote_extension_entries = fetch_result?;
 462                this.filter_extension_entries(cx);
 463                anyhow::Ok(())
 464            })?
 465        })
 466        .detach_and_log_err(cx);
 467    }
 468
 469    fn render_extensions(
 470        &mut self,
 471        range: Range<usize>,
 472        _: &mut Window,
 473        cx: &mut Context<Self>,
 474    ) -> Vec<ExtensionCard> {
 475        let dev_extension_entries_len = if self.filter.include_dev_extensions() {
 476            self.dev_extension_entries.len()
 477        } else {
 478            0
 479        };
 480        range
 481            .map(|ix| {
 482                if ix < dev_extension_entries_len {
 483                    let extension = &self.dev_extension_entries[ix];
 484                    self.render_dev_extension(extension, cx)
 485                } else {
 486                    let extension_ix =
 487                        self.filtered_remote_extension_indices[ix - dev_extension_entries_len];
 488                    let extension = &self.remote_extension_entries[extension_ix];
 489                    self.render_remote_extension(extension, cx)
 490                }
 491            })
 492            .collect()
 493    }
 494
 495    fn render_dev_extension(
 496        &self,
 497        extension: &ExtensionManifest,
 498        cx: &mut Context<Self>,
 499    ) -> ExtensionCard {
 500        let status = Self::extension_status(&extension.id, cx);
 501
 502        let repository_url = extension.repository.clone();
 503
 504        ExtensionCard::new()
 505            .child(
 506                h_flex()
 507                    .justify_between()
 508                    .child(
 509                        h_flex()
 510                            .gap_2()
 511                            .items_end()
 512                            .child(Headline::new(extension.name.clone()).size(HeadlineSize::Medium))
 513                            .child(
 514                                Headline::new(format!("v{}", extension.version))
 515                                    .size(HeadlineSize::XSmall),
 516                            ),
 517                    )
 518                    .child(
 519                        h_flex()
 520                            .gap_2()
 521                            .justify_between()
 522                            .child(
 523                                Button::new(
 524                                    SharedString::from(format!("rebuild-{}", extension.id)),
 525                                    "Rebuild",
 526                                )
 527                                .on_click({
 528                                    let extension_id = extension.id.clone();
 529                                    move |_, _, cx| {
 530                                        ExtensionStore::global(cx).update(cx, |store, cx| {
 531                                            store.rebuild_dev_extension(extension_id.clone(), cx)
 532                                        });
 533                                    }
 534                                })
 535                                .color(Color::Accent)
 536                                .disabled(matches!(status, ExtensionStatus::Upgrading)),
 537                            )
 538                            .child(
 539                                Button::new(SharedString::from(extension.id.clone()), "Uninstall")
 540                                    .on_click({
 541                                        let extension_id = extension.id.clone();
 542                                        move |_, _, cx| {
 543                                            ExtensionStore::global(cx).update(cx, |store, cx| {
 544                                                store.uninstall_extension(extension_id.clone(), cx)
 545                                            });
 546                                        }
 547                                    })
 548                                    .color(Color::Accent)
 549                                    .disabled(matches!(status, ExtensionStatus::Removing)),
 550                            ),
 551                    ),
 552            )
 553            .child(
 554                h_flex()
 555                    .gap_2()
 556                    .justify_between()
 557                    .child(
 558                        Label::new(format!(
 559                            "{}: {}",
 560                            if extension.authors.len() > 1 {
 561                                "Authors"
 562                            } else {
 563                                "Author"
 564                            },
 565                            extension.authors.join(", ")
 566                        ))
 567                        .size(LabelSize::Small)
 568                        .truncate(),
 569                    )
 570                    .child(Label::new("<>").size(LabelSize::Small)),
 571            )
 572            .child(
 573                h_flex()
 574                    .gap_2()
 575                    .justify_between()
 576                    .children(extension.description.as_ref().map(|description| {
 577                        Label::new(description.clone())
 578                            .size(LabelSize::Small)
 579                            .color(Color::Default)
 580                            .truncate()
 581                    }))
 582                    .children(repository_url.map(|repository_url| {
 583                        IconButton::new(
 584                            SharedString::from(format!("repository-{}", extension.id)),
 585                            IconName::Github,
 586                        )
 587                        .icon_color(Color::Accent)
 588                        .icon_size(IconSize::Small)
 589                        .style(ButtonStyle::Filled)
 590                        .on_click(cx.listener({
 591                            let repository_url = repository_url.clone();
 592                            move |_, _, _, cx| {
 593                                cx.open_url(&repository_url);
 594                            }
 595                        }))
 596                        .tooltip(Tooltip::text(repository_url.clone()))
 597                    })),
 598            )
 599    }
 600
 601    fn render_remote_extension(
 602        &self,
 603        extension: &ExtensionMetadata,
 604        cx: &mut Context<Self>,
 605    ) -> ExtensionCard {
 606        let this = cx.entity().clone();
 607        let status = Self::extension_status(&extension.id, cx);
 608        let has_dev_extension = Self::dev_extension_exists(&extension.id, cx);
 609
 610        let extension_id = extension.id.clone();
 611        let (install_or_uninstall_button, upgrade_button) =
 612            self.buttons_for_entry(extension, &status, has_dev_extension, cx);
 613        let version = extension.manifest.version.clone();
 614        let repository_url = extension.manifest.repository.clone();
 615
 616        let installed_version = match status {
 617            ExtensionStatus::Installed(installed_version) => Some(installed_version),
 618            _ => None,
 619        };
 620
 621        ExtensionCard::new()
 622            .overridden_by_dev_extension(has_dev_extension)
 623            .child(
 624                h_flex()
 625                    .justify_between()
 626                    .child(
 627                        h_flex()
 628                            .gap_2()
 629                            .child(
 630                                Headline::new(extension.manifest.name.clone())
 631                                    .size(HeadlineSize::Medium),
 632                            )
 633                            .child(Headline::new(format!("v{version}")).size(HeadlineSize::XSmall))
 634                            .children(
 635                                installed_version
 636                                    .filter(|installed_version| *installed_version != version)
 637                                    .map(|installed_version| {
 638                                        Headline::new(format!("(v{installed_version} installed)",))
 639                                            .size(HeadlineSize::XSmall)
 640                                    }),
 641                            )
 642                            .map(|parent| {
 643                                if extension.manifest.provides.is_empty() {
 644                                    return parent;
 645                                }
 646
 647                                parent.child(
 648                                    h_flex().gap_2().children(
 649                                        extension
 650                                            .manifest
 651                                            .provides
 652                                            .iter()
 653                                            .map(|provides| {
 654                                                div()
 655                                                    .bg(cx.theme().colors().element_background)
 656                                                    .px_0p5()
 657                                                    .border_1()
 658                                                    .border_color(cx.theme().colors().border)
 659                                                    .rounded_sm()
 660                                                    .child(
 661                                                        Label::new(extension_provides_label(
 662                                                            *provides,
 663                                                        ))
 664                                                        .size(LabelSize::XSmall),
 665                                                    )
 666                                            })
 667                                            .collect::<Vec<_>>(),
 668                                    ),
 669                                )
 670                            }),
 671                    )
 672                    .child(
 673                        h_flex()
 674                            .gap_2()
 675                            .justify_between()
 676                            .children(upgrade_button)
 677                            .child(install_or_uninstall_button),
 678                    ),
 679            )
 680            .child(
 681                h_flex()
 682                    .gap_2()
 683                    .justify_between()
 684                    .child(
 685                        Label::new(format!(
 686                            "{}: {}",
 687                            if extension.manifest.authors.len() > 1 {
 688                                "Authors"
 689                            } else {
 690                                "Author"
 691                            },
 692                            extension.manifest.authors.join(", ")
 693                        ))
 694                        .size(LabelSize::Small)
 695                        .truncate(),
 696                    )
 697                    .child(
 698                        Label::new(format!(
 699                            "Downloads: {}",
 700                            extension.download_count.to_formatted_string(&Locale::en)
 701                        ))
 702                        .size(LabelSize::Small),
 703                    ),
 704            )
 705            .child(
 706                h_flex()
 707                    .gap_2()
 708                    .justify_between()
 709                    .children(extension.manifest.description.as_ref().map(|description| {
 710                        Label::new(description.clone())
 711                            .size(LabelSize::Small)
 712                            .color(Color::Default)
 713                            .truncate()
 714                    }))
 715                    .child(
 716                        h_flex()
 717                            .gap_2()
 718                            .child(
 719                                IconButton::new(
 720                                    SharedString::from(format!("repository-{}", extension.id)),
 721                                    IconName::Github,
 722                                )
 723                                .icon_color(Color::Accent)
 724                                .icon_size(IconSize::Small)
 725                                .style(ButtonStyle::Filled)
 726                                .on_click(cx.listener({
 727                                    let repository_url = repository_url.clone();
 728                                    move |_, _, _, cx| {
 729                                        cx.open_url(&repository_url);
 730                                    }
 731                                }))
 732                                .tooltip(Tooltip::text(repository_url.clone())),
 733                            )
 734                            .child(
 735                                PopoverMenu::new(SharedString::from(format!(
 736                                    "more-{}",
 737                                    extension.id
 738                                )))
 739                                .trigger(
 740                                    IconButton::new(
 741                                        SharedString::from(format!("more-{}", extension.id)),
 742                                        IconName::Ellipsis,
 743                                    )
 744                                    .icon_color(Color::Accent)
 745                                    .icon_size(IconSize::Small)
 746                                    .style(ButtonStyle::Filled),
 747                                )
 748                                .menu(move |window, cx| {
 749                                    Some(Self::render_remote_extension_context_menu(
 750                                        &this,
 751                                        extension_id.clone(),
 752                                        window,
 753                                        cx,
 754                                    ))
 755                                }),
 756                            ),
 757                    ),
 758            )
 759    }
 760
 761    fn render_remote_extension_context_menu(
 762        this: &Entity<Self>,
 763        extension_id: Arc<str>,
 764        window: &mut Window,
 765        cx: &mut App,
 766    ) -> Entity<ContextMenu> {
 767        let context_menu = ContextMenu::build(window, cx, |context_menu, window, _| {
 768            context_menu
 769                .entry(
 770                    "Install Another Version...",
 771                    None,
 772                    window.handler_for(this, {
 773                        let extension_id = extension_id.clone();
 774                        move |this, window, cx| {
 775                            this.show_extension_version_list(extension_id.clone(), window, cx)
 776                        }
 777                    }),
 778                )
 779                .entry("Copy Extension ID", None, {
 780                    let extension_id = extension_id.clone();
 781                    move |_, cx| {
 782                        cx.write_to_clipboard(ClipboardItem::new_string(extension_id.to_string()));
 783                    }
 784                })
 785        });
 786
 787        context_menu
 788    }
 789
 790    fn show_extension_version_list(
 791        &mut self,
 792        extension_id: Arc<str>,
 793        window: &mut Window,
 794        cx: &mut Context<Self>,
 795    ) {
 796        let Some(workspace) = self.workspace.upgrade() else {
 797            return;
 798        };
 799
 800        cx.spawn_in(window, async move |this, cx| {
 801            let extension_versions_task = this.update(cx, |_, cx| {
 802                let extension_store = ExtensionStore::global(cx);
 803
 804                extension_store.update(cx, |store, cx| {
 805                    store.fetch_extension_versions(&extension_id, cx)
 806                })
 807            })?;
 808
 809            let extension_versions = extension_versions_task.await?;
 810
 811            workspace.update_in(cx, |workspace, window, cx| {
 812                let fs = workspace.project().read(cx).fs().clone();
 813                workspace.toggle_modal(window, cx, |window, cx| {
 814                    let delegate = ExtensionVersionSelectorDelegate::new(
 815                        fs,
 816                        cx.entity().downgrade(),
 817                        extension_versions,
 818                    );
 819
 820                    ExtensionVersionSelector::new(delegate, window, cx)
 821                });
 822            })?;
 823
 824            anyhow::Ok(())
 825        })
 826        .detach_and_log_err(cx);
 827    }
 828
 829    fn buttons_for_entry(
 830        &self,
 831        extension: &ExtensionMetadata,
 832        status: &ExtensionStatus,
 833        has_dev_extension: bool,
 834        cx: &mut Context<Self>,
 835    ) -> (Button, Option<Button>) {
 836        let is_compatible =
 837            extension_host::is_version_compatible(ReleaseChannel::global(cx), extension);
 838
 839        if has_dev_extension {
 840            // If we have a dev extension for the given extension, just treat it as uninstalled.
 841            // The button here is a placeholder, as it won't be interactable anyways.
 842            return (
 843                Button::new(SharedString::from(extension.id.clone()), "Install"),
 844                None,
 845            );
 846        }
 847
 848        match status.clone() {
 849            ExtensionStatus::NotInstalled => (
 850                Button::new(SharedString::from(extension.id.clone()), "Install").on_click({
 851                    let extension_id = extension.id.clone();
 852                    move |_, _, cx| {
 853                        telemetry::event!("Extension Installed");
 854                        ExtensionStore::global(cx).update(cx, |store, cx| {
 855                            store.install_latest_extension(extension_id.clone(), cx)
 856                        });
 857                    }
 858                }),
 859                None,
 860            ),
 861            ExtensionStatus::Installing => (
 862                Button::new(SharedString::from(extension.id.clone()), "Install").disabled(true),
 863                None,
 864            ),
 865            ExtensionStatus::Upgrading => (
 866                Button::new(SharedString::from(extension.id.clone()), "Uninstall").disabled(true),
 867                Some(
 868                    Button::new(SharedString::from(extension.id.clone()), "Upgrade").disabled(true),
 869                ),
 870            ),
 871            ExtensionStatus::Installed(installed_version) => (
 872                Button::new(SharedString::from(extension.id.clone()), "Uninstall").on_click({
 873                    let extension_id = extension.id.clone();
 874                    move |_, _, cx| {
 875                        telemetry::event!("Extension Uninstalled", extension_id);
 876                        ExtensionStore::global(cx).update(cx, |store, cx| {
 877                            store.uninstall_extension(extension_id.clone(), cx)
 878                        });
 879                    }
 880                }),
 881                if installed_version == extension.manifest.version {
 882                    None
 883                } else {
 884                    Some(
 885                        Button::new(SharedString::from(extension.id.clone()), "Upgrade")
 886                            .when(!is_compatible, |upgrade_button| {
 887                                upgrade_button.disabled(true).tooltip({
 888                                    let version = extension.manifest.version.clone();
 889                                    move |_, cx| {
 890                                        Tooltip::simple(
 891                                            format!(
 892                                                "v{version} is not compatible with this version of Zed.",
 893                                            ),
 894                                             cx,
 895                                        )
 896                                    }
 897                                })
 898                            })
 899                            .disabled(!is_compatible)
 900                            .on_click({
 901                                let extension_id = extension.id.clone();
 902                                let version = extension.manifest.version.clone();
 903                                move |_, _, cx| {
 904                                    telemetry::event!("Extension Installed", extension_id, version);
 905                                    ExtensionStore::global(cx).update(cx, |store, cx| {
 906                                        store
 907                                            .upgrade_extension(
 908                                                extension_id.clone(),
 909                                                version.clone(),
 910                                                cx,
 911                                            )
 912                                            .detach_and_log_err(cx)
 913                                    });
 914                                }
 915                            }),
 916                    )
 917                },
 918            ),
 919            ExtensionStatus::Removing => (
 920                Button::new(SharedString::from(extension.id.clone()), "Uninstall").disabled(true),
 921                None,
 922            ),
 923        }
 924    }
 925
 926    fn render_search(&self, cx: &mut Context<Self>) -> Div {
 927        let mut key_context = KeyContext::new_with_defaults();
 928        key_context.add("BufferSearchBar");
 929
 930        let editor_border = if self.query_contains_error {
 931            Color::Error.color(cx)
 932        } else {
 933            cx.theme().colors().border
 934        };
 935
 936        h_flex().w_full().gap_2().key_context(key_context).child(
 937            h_flex()
 938                .flex_1()
 939                .px_2()
 940                .py_1()
 941                .gap_2()
 942                .border_1()
 943                .border_color(editor_border)
 944                .min_w(rems_from_px(384.))
 945                .rounded_lg()
 946                .child(Icon::new(IconName::MagnifyingGlass))
 947                .child(self.render_text_input(&self.query_editor, cx)),
 948        )
 949    }
 950
 951    fn render_text_input(
 952        &self,
 953        editor: &Entity<Editor>,
 954        cx: &mut Context<Self>,
 955    ) -> impl IntoElement {
 956        let settings = ThemeSettings::get_global(cx);
 957        let text_style = TextStyle {
 958            color: if editor.read(cx).read_only(cx) {
 959                cx.theme().colors().text_disabled
 960            } else {
 961                cx.theme().colors().text
 962            },
 963            font_family: settings.ui_font.family.clone(),
 964            font_features: settings.ui_font.features.clone(),
 965            font_fallbacks: settings.ui_font.fallbacks.clone(),
 966            font_size: rems(0.875).into(),
 967            font_weight: settings.ui_font.weight,
 968            line_height: relative(1.3),
 969            ..Default::default()
 970        };
 971
 972        EditorElement::new(
 973            editor,
 974            EditorStyle {
 975                background: cx.theme().colors().editor_background,
 976                local_player: cx.theme().players().local(),
 977                text: text_style,
 978                ..Default::default()
 979            },
 980        )
 981    }
 982
 983    fn on_query_change(
 984        &mut self,
 985        _: Entity<Editor>,
 986        event: &editor::EditorEvent,
 987        cx: &mut Context<Self>,
 988    ) {
 989        if let editor::EditorEvent::Edited { .. } = event {
 990            self.query_contains_error = false;
 991            self.refresh_search(cx);
 992        }
 993    }
 994
 995    fn refresh_search(&mut self, cx: &mut Context<Self>) {
 996        self.fetch_extensions_debounced(cx);
 997        self.refresh_feature_upsells(cx);
 998    }
 999
1000    pub fn change_provides_filter(
1001        &mut self,
1002        provides_filter: Option<ExtensionProvides>,
1003        cx: &mut Context<Self>,
1004    ) {
1005        self.provides_filter = provides_filter;
1006        self.refresh_search(cx);
1007    }
1008
1009    fn fetch_extensions_debounced(&mut self, cx: &mut Context<ExtensionsPage>) {
1010        self.extension_fetch_task = Some(cx.spawn(async move |this, cx| {
1011            let search = this
1012                .update(cx, |this, cx| this.search_query(cx))
1013                .ok()
1014                .flatten();
1015
1016            // Only debounce the fetching of extensions if we have a search
1017            // query.
1018            //
1019            // If the search was just cleared then we can just reload the list
1020            // of extensions without a debounce, which allows us to avoid seeing
1021            // an intermittent flash of a "no extensions" state.
1022            if search.is_some() {
1023                cx.background_executor()
1024                    .timer(Duration::from_millis(250))
1025                    .await;
1026            };
1027
1028            this.update(cx, |this, cx| {
1029                this.fetch_extensions(search, Some(BTreeSet::from_iter(this.provides_filter)), cx);
1030            })
1031            .ok();
1032        }));
1033    }
1034
1035    pub fn search_query(&self, cx: &mut App) -> Option<String> {
1036        let search = self.query_editor.read(cx).text(cx);
1037        if search.trim().is_empty() {
1038            None
1039        } else {
1040            Some(search)
1041        }
1042    }
1043
1044    fn render_empty_state(&self, cx: &mut Context<Self>) -> impl IntoElement {
1045        let has_search = self.search_query(cx).is_some();
1046
1047        let message = if self.is_fetching_extensions {
1048            "Loading extensions..."
1049        } else {
1050            match self.filter {
1051                ExtensionFilter::All => {
1052                    if has_search {
1053                        "No extensions that match your search."
1054                    } else {
1055                        "No extensions."
1056                    }
1057                }
1058                ExtensionFilter::Installed => {
1059                    if has_search {
1060                        "No installed extensions that match your search."
1061                    } else {
1062                        "No installed extensions."
1063                    }
1064                }
1065                ExtensionFilter::NotInstalled => {
1066                    if has_search {
1067                        "No not installed extensions that match your search."
1068                    } else {
1069                        "No not installed extensions."
1070                    }
1071                }
1072            }
1073        };
1074
1075        Label::new(message)
1076    }
1077
1078    fn update_settings<T: Settings>(
1079        &mut self,
1080        selection: &ToggleState,
1081
1082        cx: &mut Context<Self>,
1083        callback: impl 'static + Send + Fn(&mut T::FileContent, bool),
1084    ) {
1085        if let Some(workspace) = self.workspace.upgrade() {
1086            let fs = workspace.read(cx).app_state().fs.clone();
1087            let selection = *selection;
1088            settings::update_settings_file::<T>(fs, cx, move |settings, _| {
1089                let value = match selection {
1090                    ToggleState::Unselected => false,
1091                    ToggleState::Selected => true,
1092                    _ => return,
1093                };
1094
1095                callback(settings, value)
1096            });
1097        }
1098    }
1099
1100    fn refresh_feature_upsells(&mut self, cx: &mut Context<Self>) {
1101        let Some(search) = self.search_query(cx) else {
1102            self.upsells.clear();
1103            return;
1104        };
1105
1106        let search = search.to_lowercase();
1107        let search_terms = search
1108            .split_whitespace()
1109            .map(|term| term.trim())
1110            .collect::<Vec<_>>();
1111
1112        for (feature, keywords) in keywords_by_feature() {
1113            if keywords
1114                .iter()
1115                .any(|keyword| search_terms.contains(keyword))
1116            {
1117                self.upsells.insert(*feature);
1118            } else {
1119                self.upsells.remove(feature);
1120            }
1121        }
1122    }
1123
1124    fn render_feature_upsells(&self, cx: &mut Context<Self>) -> impl IntoElement {
1125        let upsells_count = self.upsells.len();
1126
1127        v_flex().children(self.upsells.iter().enumerate().map(|(ix, feature)| {
1128            let upsell = match feature {
1129                Feature::Git => FeatureUpsell::new(
1130                    "Zed comes with basic Git support. More Git features are coming in the future.",
1131                )
1132                .docs_url("https://zed.dev/docs/git"),
1133                Feature::OpenIn => FeatureUpsell::new(
1134                    "Zed supports linking to a source line on GitHub and others.",
1135                )
1136                .docs_url("https://zed.dev/docs/git#git-integrations"),
1137                Feature::Vim => FeatureUpsell::new("Vim support is built-in to Zed!")
1138                    .docs_url("https://zed.dev/docs/vim")
1139                    .child(CheckboxWithLabel::new(
1140                        "enable-vim",
1141                        Label::new("Enable vim mode"),
1142                        if VimModeSetting::get_global(cx).0 {
1143                            ui::ToggleState::Selected
1144                        } else {
1145                            ui::ToggleState::Unselected
1146                        },
1147                        cx.listener(move |this, selection, _, cx| {
1148                            telemetry::event!("Vim Mode Toggled", source = "Feature Upsell");
1149                            this.update_settings::<VimModeSetting>(
1150                                selection,
1151                                cx,
1152                                |setting, value| *setting = Some(value),
1153                            );
1154                        }),
1155                    )),
1156                Feature::LanguageBash => FeatureUpsell::new("Shell support is built-in to Zed!")
1157                    .docs_url("https://zed.dev/docs/languages/bash"),
1158                Feature::LanguageC => FeatureUpsell::new("C support is built-in to Zed!")
1159                    .docs_url("https://zed.dev/docs/languages/c"),
1160                Feature::LanguageCpp => FeatureUpsell::new("C++ support is built-in to Zed!")
1161                    .docs_url("https://zed.dev/docs/languages/cpp"),
1162                Feature::LanguageGo => FeatureUpsell::new("Go support is built-in to Zed!")
1163                    .docs_url("https://zed.dev/docs/languages/go"),
1164                Feature::LanguagePython => FeatureUpsell::new("Python support is built-in to Zed!")
1165                    .docs_url("https://zed.dev/docs/languages/python"),
1166                Feature::LanguageReact => FeatureUpsell::new("React support is built-in to Zed!")
1167                    .docs_url("https://zed.dev/docs/languages/typescript"),
1168                Feature::LanguageRust => FeatureUpsell::new("Rust support is built-in to Zed!")
1169                    .docs_url("https://zed.dev/docs/languages/rust"),
1170                Feature::LanguageTypescript => {
1171                    FeatureUpsell::new("Typescript support is built-in to Zed!")
1172                        .docs_url("https://zed.dev/docs/languages/typescript")
1173                }
1174            };
1175
1176            upsell.when(ix < upsells_count, |upsell| upsell.border_b_1())
1177        }))
1178    }
1179
1180    fn build_extension_provides_filter_menu(
1181        &self,
1182        window: &mut Window,
1183        cx: &mut Context<Self>,
1184    ) -> Entity<ContextMenu> {
1185        let this = cx.entity();
1186        ContextMenu::build(window, cx, |mut menu, _window, _cx| {
1187            menu = menu.header("Extension Category").toggleable_entry(
1188                "All",
1189                self.provides_filter.is_none(),
1190                IconPosition::End,
1191                None,
1192                {
1193                    let this = this.clone();
1194                    move |_window, cx| {
1195                        this.update(cx, |this, cx| {
1196                            this.change_provides_filter(None, cx);
1197                        });
1198                    }
1199                },
1200            );
1201
1202            for provides in ExtensionProvides::iter() {
1203                let label = extension_provides_label(provides);
1204
1205                menu = menu.toggleable_entry(
1206                    label,
1207                    self.provides_filter == Some(provides),
1208                    IconPosition::End,
1209                    None,
1210                    {
1211                        let this = this.clone();
1212                        move |_window, cx| {
1213                            this.update(cx, |this, cx| {
1214                                this.change_provides_filter(Some(provides), cx);
1215                                this.provides_filter = Some(provides);
1216                            });
1217                        }
1218                    },
1219                )
1220            }
1221
1222            menu
1223        })
1224    }
1225}
1226
1227impl Render for ExtensionsPage {
1228    fn render(&mut self, _: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
1229        v_flex()
1230            .size_full()
1231            .bg(cx.theme().colors().editor_background)
1232            .child(
1233                v_flex()
1234                    .gap_4()
1235                    .p_4()
1236                    .border_b_1()
1237                    .border_color(cx.theme().colors().border)
1238                    .bg(cx.theme().colors().editor_background)
1239                    .child(
1240                        h_flex()
1241                            .w_full()
1242                            .gap_2()
1243                            .justify_between()
1244                            .child(Headline::new("Extensions").size(HeadlineSize::XLarge))
1245                            .child(
1246                                Button::new("install-dev-extension", "Install Dev Extension")
1247                                    .style(ButtonStyle::Filled)
1248                                    .size(ButtonSize::Large)
1249                                    .on_click(|_event, window, cx| {
1250                                        window.dispatch_action(Box::new(InstallDevExtension), cx)
1251                                    }),
1252                            ),
1253                    )
1254                    .child(
1255                        h_flex()
1256                            .w_full()
1257                            .gap_2()
1258                            .justify_between()
1259                            .child(h_flex().gap_2().child(self.render_search(cx)).child({
1260                                let this = cx.entity().clone();
1261                                PopoverMenu::new("extension-provides-filter")
1262                                    .menu(move |window, cx| {
1263                                        Some(this.update(cx, |this, cx| {
1264                                            this.build_extension_provides_filter_menu(window, cx)
1265                                        }))
1266                                    })
1267                                    .trigger_with_tooltip(
1268                                        Button::new(
1269                                            "extension-provides-filter-button",
1270                                            self.provides_filter
1271                                                .map(extension_provides_label)
1272                                                .unwrap_or("All"),
1273                                        )
1274                                        .icon(IconName::Filter)
1275                                        .icon_position(IconPosition::Start),
1276                                        Tooltip::text("Filter extensions by category"),
1277                                    )
1278                                    .anchor(gpui::Corner::TopLeft)
1279                            }))
1280                            .child(
1281                                h_flex()
1282                                    .child(
1283                                        ToggleButton::new("filter-all", "All")
1284                                            .style(ButtonStyle::Filled)
1285                                            .size(ButtonSize::Large)
1286                                            .toggle_state(self.filter == ExtensionFilter::All)
1287                                            .on_click(cx.listener(|this, _event, _, cx| {
1288                                                this.filter = ExtensionFilter::All;
1289                                                this.filter_extension_entries(cx);
1290                                            }))
1291                                            .tooltip(move |_, cx| {
1292                                                Tooltip::simple("Show all extensions", cx)
1293                                            })
1294                                            .first(),
1295                                    )
1296                                    .child(
1297                                        ToggleButton::new("filter-installed", "Installed")
1298                                            .style(ButtonStyle::Filled)
1299                                            .size(ButtonSize::Large)
1300                                            .toggle_state(self.filter == ExtensionFilter::Installed)
1301                                            .on_click(cx.listener(|this, _event, _, cx| {
1302                                                this.filter = ExtensionFilter::Installed;
1303                                                this.filter_extension_entries(cx);
1304                                            }))
1305                                            .tooltip(move |_, cx| {
1306                                                Tooltip::simple("Show installed extensions", cx)
1307                                            })
1308                                            .middle(),
1309                                    )
1310                                    .child(
1311                                        ToggleButton::new("filter-not-installed", "Not Installed")
1312                                            .style(ButtonStyle::Filled)
1313                                            .size(ButtonSize::Large)
1314                                            .toggle_state(
1315                                                self.filter == ExtensionFilter::NotInstalled,
1316                                            )
1317                                            .on_click(cx.listener(|this, _event, _, cx| {
1318                                                this.filter = ExtensionFilter::NotInstalled;
1319                                                this.filter_extension_entries(cx);
1320                                            }))
1321                                            .tooltip(move |_, cx| {
1322                                                Tooltip::simple("Show not installed extensions", cx)
1323                                            })
1324                                            .last(),
1325                                    ),
1326                            ),
1327                    ),
1328            )
1329            .child(self.render_feature_upsells(cx))
1330            .child(v_flex().px_4().size_full().overflow_y_hidden().map(|this| {
1331                let mut count = self.filtered_remote_extension_indices.len();
1332                if self.filter.include_dev_extensions() {
1333                    count += self.dev_extension_entries.len();
1334                }
1335
1336                if count == 0 {
1337                    return this.py_4().child(self.render_empty_state(cx));
1338                }
1339
1340                let extensions_page = cx.entity().clone();
1341                let scroll_handle = self.list.clone();
1342                this.child(
1343                    uniform_list(extensions_page, "entries", count, Self::render_extensions)
1344                        .flex_grow()
1345                        .pb_4()
1346                        .track_scroll(scroll_handle),
1347                )
1348            }))
1349    }
1350}
1351
1352impl EventEmitter<ItemEvent> for ExtensionsPage {}
1353
1354impl Focusable for ExtensionsPage {
1355    fn focus_handle(&self, cx: &App) -> gpui::FocusHandle {
1356        self.query_editor.read(cx).focus_handle(cx)
1357    }
1358}
1359
1360impl Item for ExtensionsPage {
1361    type Event = ItemEvent;
1362
1363    fn tab_content_text(&self, _window: &Window, _cx: &App) -> Option<SharedString> {
1364        Some("Extensions".into())
1365    }
1366
1367    fn telemetry_event_text(&self) -> Option<&'static str> {
1368        Some("Extensions Page Opened")
1369    }
1370
1371    fn show_toolbar(&self) -> bool {
1372        false
1373    }
1374
1375    fn clone_on_split(
1376        &self,
1377        _workspace_id: Option<WorkspaceId>,
1378        _window: &mut Window,
1379        _: &mut Context<Self>,
1380    ) -> Option<Entity<Self>> {
1381        None
1382    }
1383
1384    fn to_item_events(event: &Self::Event, mut f: impl FnMut(workspace::item::ItemEvent)) {
1385        f(*event)
1386    }
1387}