diff --git a/lib/vscode/src/vs/workbench/contrib/extensions/browser/extensionsViewlet.ts b/lib/vscode/src/vs/workbench/contrib/extensions/browser/extensionsViewlet.ts index 9cd1effb5..018efd12e 100644 --- a/lib/vscode/src/vs/workbench/contrib/extensions/browser/extensionsViewlet.ts +++ b/lib/vscode/src/vs/workbench/contrib/extensions/browser/extensionsViewlet.ts @@ -410,6 +410,38 @@ export class ExtensionsViewPaneContainer extends ViewPaneContainer implements IE overlay.style.backgroundColor = overlayBackgroundColor; hide(overlay); + // NOTE@coder this UI element helps users understand the extension marketplace divergence + const extensionHelperLocalStorageKey = 'coder.extension-help-message'; + + if (localStorage.getItem(extensionHelperLocalStorageKey) === null) { + const helperHeader = append(this.root, $('.header')); + helperHeader.id = 'codeServerMarketplaceHelper'; + helperHeader.style.height = 'auto'; + helperHeader.style.fontWeight = '600'; + helperHeader.style.padding = 'padding: 5px 16px'; + helperHeader.style.position = 'relative'; + helperHeader.innerHTML = ` +
+ `; + + const dismiss = append(helperHeader, $('span')); + dismiss.innerHTML = 'Dismiss'; + dismiss.style.display = 'block'; + dismiss.style.textAlign = 'right'; + dismiss.style.cursor = 'pointer'; + dismiss.onclick = () => { + helperHeader.remove(); + localStorage.setItem(extensionHelperLocalStorageKey, 'viewed'); + }; + } + const header = append(this.root, $('.header')); const placeholder = localize('searchExtensions', "Search Extensions in Marketplace"); const searchValue = this.searchViewletState['query.value'] ? this.searchViewletState['query.value'] : '';