From 145ebaa771646fbd04b56980fe4d05342ba0b109 Mon Sep 17 00:00:00 2001 From: Beatrix Date: Sat, 11 Jan 2025 01:14:38 -0800 Subject: [PATCH 1/9] feat(chat): add WelcomeNotice component to WelcomeMessage The WelcomeNotice component is added to the WelcomeMessage component, positioned at the bottom of the message. This provides additional information or notices to the user in the chat welcome message. ## Changes - Added the WelcomeNotice component to the WelcomeMessage component - Positioned the WelcomeNotice at the bottom of the WelcomeMessage, centered horizontally --- .../chat/components/WelcomeMessage.tsx | 7 +- .../chat/components/WelcomeNotice.tsx | 67 +++++ vscode/webviews/graph_dark.svg | 266 ++++++++++++++++++ vscode/webviews/graph_light.svg | 266 ++++++++++++++++++ 4 files changed, 604 insertions(+), 2 deletions(-) create mode 100644 vscode/webviews/chat/components/WelcomeNotice.tsx create mode 100644 vscode/webviews/graph_dark.svg create mode 100644 vscode/webviews/graph_light.svg diff --git a/vscode/webviews/chat/components/WelcomeMessage.tsx b/vscode/webviews/chat/components/WelcomeMessage.tsx index ab66232359cf..41b9d26cb736 100644 --- a/vscode/webviews/chat/components/WelcomeMessage.tsx +++ b/vscode/webviews/chat/components/WelcomeMessage.tsx @@ -9,6 +9,7 @@ import { PromptMigrationWidget } from './../../components/promptsMigration/Promp import { clsx } from 'clsx' import styles from './WelcomeMessage.module.css' +import { WelcomeNotice } from './WelcomeNotice' const localStorageKey = 'chat.welcome-message-dismissed' @@ -32,7 +33,7 @@ export const WelcomeMessage: FunctionComponent = ({ } return ( -
+
{isPromptsV2Enabled && IDE !== CodyIDE.Web && ( )} @@ -48,7 +49,9 @@ export const WelcomeMessage: FunctionComponent = ({ telemetryLocation="WelcomeAreaPrompts" onSelect={item => runAction(item, setView)} /> - +
+ +
+ +
+ graph_dark + graph_light + +
+ ) +} +;
+ +
diff --git a/vscode/webviews/graph_dark.svg b/vscode/webviews/graph_dark.svg new file mode 100644 index 000000000000..2223cd4bb243 --- /dev/null +++ b/vscode/webviews/graph_dark.svg @@ -0,0 +1,266 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/vscode/webviews/graph_light.svg b/vscode/webviews/graph_light.svg new file mode 100644 index 000000000000..5ad909e4574a --- /dev/null +++ b/vscode/webviews/graph_light.svg @@ -0,0 +1,266 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + From 0d79663d3272163411442f3ec403b00bf5c8f79e Mon Sep 17 00:00:00 2001 From: Beatrix Date: Sat, 11 Jan 2025 01:18:05 -0800 Subject: [PATCH 2/9] add isTeamsUpgradeCtaEnabled prop to WelcomeMessage component The isTeamsUpgradeCtaEnabled prop is added to the WelcomeMessage component, allowing the display of the WelcomeNotice component to be conditionally rendered based on the value of this prop. This provides flexibility in controlling the visibility of the WelcomeNotice component within the chat welcome message. ## Changes - Added the isTeamsUpgradeCtaEnabled prop to the WelcomeMessage component - Conditionally rendered the WelcomeNotice component based on the value of isTeamsUpgradeCtaEnabled --- vscode/webviews/Chat.tsx | 3 +++ vscode/webviews/CodyPanel.tsx | 1 + vscode/webviews/chat/components/WelcomeMessage.tsx | 10 +++++++--- 3 files changed, 11 insertions(+), 3 deletions(-) diff --git a/vscode/webviews/Chat.tsx b/vscode/webviews/Chat.tsx index 61767bf6eadb..c71eeb9f4b80 100644 --- a/vscode/webviews/Chat.tsx +++ b/vscode/webviews/Chat.tsx @@ -36,6 +36,7 @@ interface ChatboxProps { setView: (view: View) => void smartApplyEnabled?: boolean isPromptsV2Enabled?: boolean + isTeamsUpgradeCtaEnabled?: boolean } export const Chat: React.FunctionComponent> = ({ @@ -51,6 +52,7 @@ export const Chat: React.FunctionComponent setView, smartApplyEnabled, isPromptsV2Enabled, + isTeamsUpgradeCtaEnabled, }) => { const telemetryRecorder = useTelemetryRecorder() @@ -256,6 +258,7 @@ export const Chat: React.FunctionComponent IDE={userInfo.IDE} setView={setView} isPromptsV2Enabled={isPromptsV2Enabled} + isTeamsUpgradeCtaEnabled={isTeamsUpgradeCtaEnabled} /> diff --git a/vscode/webviews/CodyPanel.tsx b/vscode/webviews/CodyPanel.tsx index 0e304c025811..f4724141593a 100644 --- a/vscode/webviews/CodyPanel.tsx +++ b/vscode/webviews/CodyPanel.tsx @@ -138,6 +138,7 @@ export const CodyPanel: FunctionComponent = ({ smartApplyEnabled={smartApplyEnabled} isPromptsV2Enabled={isPromptsV2Enabled} setView={setView} + isTeamsUpgradeCtaEnabled={isTeamsUpgradeCtaEnabled} /> )} {view === View.History && ( diff --git a/vscode/webviews/chat/components/WelcomeMessage.tsx b/vscode/webviews/chat/components/WelcomeMessage.tsx index 41b9d26cb736..9a43f10bf27f 100644 --- a/vscode/webviews/chat/components/WelcomeMessage.tsx +++ b/vscode/webviews/chat/components/WelcomeMessage.tsx @@ -17,12 +17,14 @@ interface WelcomeMessageProps { setView: (view: View) => void IDE: CodyIDE isPromptsV2Enabled?: boolean + isTeamsUpgradeCtaEnabled?: boolean } export const WelcomeMessage: FunctionComponent = ({ setView, IDE, isPromptsV2Enabled, + isTeamsUpgradeCtaEnabled, }) => { // Remove the old welcome message dismissal key that is no longer used. localStorage.removeItem(localStorageKey) @@ -49,9 +51,11 @@ export const WelcomeMessage: FunctionComponent = ({ telemetryLocation="WelcomeAreaPrompts" onSelect={item => runAction(item, setView)} /> -
- -
+ {isTeamsUpgradeCtaEnabled && ( +
+ +
+ )}
-

Unlock the Sourcegraph platform

-

+

Unlock the Sourcegraph platform

+

Get search, AI chat, autocompletes and inline edits for your entire team to find, understand and fix code across all of your codebases.

-
+
+ + + )} ) : ( @@ -344,6 +397,44 @@ export const UserMenu: React.FunctionComponent = ({ + {isDotComUser && !isProUser && ( + { + telemetryRecorder.recordEvent( + 'cody.userMenu.upgradeToProLink', + 'open', + {} + ) + close() + }} + > + + zapIconGradient + + + + + + + + + + Upgrade to Pro + + )} {isDotComUser && ( { @@ -384,6 +475,25 @@ export const UserMenu: React.FunctionComponent = ({ Extension Settings + {isDotComUser && ( + { + telemetryRecorder.recordEvent( + 'cody.userMenu.exploreEnterprisePlanLink', + 'open', + {} + ) + close() + }} + > + + Explore Enterprise Plans + + + )} @@ -429,7 +539,7 @@ export const UserMenu: React.FunctionComponent = ({ )} popoverRootProps={{ onOpenChange }} popoverContentProps={{ - className: '!tw-p-2', + className: '!tw-p-2 tw-mr-6', onKeyDown: onKeyDown, onCloseAutoFocus: event => { event.preventDefault() diff --git a/vscode/webviews/tabs/TabsBar.tsx b/vscode/webviews/tabs/TabsBar.tsx index 85263da0827c..7ae32244cbae 100644 --- a/vscode/webviews/tabs/TabsBar.tsx +++ b/vscode/webviews/tabs/TabsBar.tsx @@ -34,6 +34,8 @@ interface TabsBarProps { currentView: View setView: (view: View) => void endpointHistory: string[] + // Whether to show the Sourcegraph Teams upgrade CTA or not. + isTeamsUpgradeCtaEnabled?: boolean } type IconComponent = React.ForwardRefExoticComponent< @@ -157,6 +159,7 @@ export const TabsBar = memo(props => { endpointHistory={endpointHistory} allowEndpointChange={allowEndpointChange} className="!tw-opacity-100 tw-h-full" + isTeamsUpgradeCtaEnabled={props.isTeamsUpgradeCtaEnabled} /> )}
From 33277809050287446ef2c22e26bbf9ed70b28e7a Mon Sep 17 00:00:00 2001 From: Beatrix <68532117+abeatrix@users.noreply.github.com> Date: Wed, 15 Jan 2025 09:06:09 -0800 Subject: [PATCH 8/9] feat(webview): add Sourcegraph Workspaces upgrade CTA (#6605) CLOSE https://linear.app/sourcegraph/issue/CODY-4658/switch-account-add-create-workspace-cta-if-they-are-on-plg ![image](https://github.com/user-attachments/assets/a5f1ea71-831a-4a2e-a1b0-39fa0435f520) - Adds a Sourcegraph Teams upgrade CTA to the user menu and tabs bar - The CTA is conditionally rendered based on the `isTeamsUpgradeCtaEnabled` prop - The CTA provides a link to create a Sourcegraph workspace ## Test plan 1. Verify the CTA is displayed when `isTeamsUpgradeCtaEnabled` is true 2. Verify the CTA is not displayed when `isTeamsUpgradeCtaEnabled` is false 3. Verify clicking the "Create a workspace" button navigates to the correct URL From 9b6dd91e1cfe43a7a9adcc9171942cf4ad63331e Mon Sep 17 00:00:00 2001 From: Beatrix Date: Wed, 15 Jan 2025 09:13:34 -0800 Subject: [PATCH 9/9] import DOTCOM_WORKSPACE_LEARN_MORE_URL --- lib/shared/src/sourcegraph-api/environments.ts | 1 + vscode/webviews/chat/components/WelcomeNotice.tsx | 15 +++++++++------ 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/lib/shared/src/sourcegraph-api/environments.ts b/lib/shared/src/sourcegraph-api/environments.ts index a59e616b93ea..c4f171c6838e 100644 --- a/lib/shared/src/sourcegraph-api/environments.ts +++ b/lib/shared/src/sourcegraph-api/environments.ts @@ -40,3 +40,4 @@ export function isS2(arg: Pick | undefined | string): bo // TODO: Update to live link https://linear.app/sourcegraph/issue/CORE-535/cody-clients-migrate-ctas-to-live-links export const DOTCOM_WORKSPACE_UPGRADE_URL = new URL('https://sourcegraph.com/cody/manage') +export const SG_WORKSPACES_URL = new URL('https://workspaces.sourcegraph.com') diff --git a/vscode/webviews/chat/components/WelcomeNotice.tsx b/vscode/webviews/chat/components/WelcomeNotice.tsx index abe47e60ae6b..886a8982fd89 100644 --- a/vscode/webviews/chat/components/WelcomeNotice.tsx +++ b/vscode/webviews/chat/components/WelcomeNotice.tsx @@ -1,5 +1,7 @@ +import { SG_WORKSPACES_URL } from '@sourcegraph/cody-shared/src/sourcegraph-api/environments' import { XIcon } from 'lucide-react' import { type FunctionComponent, useCallback } from 'react' +import { DOTCOM_WORKSPACE_LEARN_MORE_URL } from '../../../src/chat/protocol' import { useLocalStorage } from '../../components/hooks' import { Badge } from '../../components/shadcn/ui/badge' import { Button } from '../../components/shadcn/ui/button' @@ -8,10 +10,6 @@ import graphLightCTA from '../../graph_light.svg' import { SourcegraphLogo } from '../../icons/SourcegraphLogo' import { useTelemetryRecorder } from '../../utils/telemetry' -const WORKSPACES_URL = 'https://workspaces.sourcegraph.com' -// TODO: Update to live link https://linear.app/sourcegraph/issue/CORE-535/ -const DOCS_URL = 'https://docs.sourcegraph.com' - export const WelcomeNotice: FunctionComponent = () => { const [dismissed, setDismissed] = useLocalStorage('sg_welcome_notice_00', 0) if (dismissed) { @@ -37,7 +35,7 @@ export const WelcomeNotice: FunctionComponent = () => {