Cody Web: Polish cody web Prompts

lib/prompt-editor/src/PromptEditor.tsx

@@ -256,7 +256,12 @@ export const PromptEditor: FunctionComponent<Props> = ({
                                 const nodesToInsert = lexicalNodesForContextItems(items, {
                                     isFromInitialContext: true,
                                 })
-                                nodesToInsert.push($createTextNode(' '))
+
+                                // Add whitespace after initial context items chips
+                                if (items.length > 0) {
+                                    nodesToInsert.push($createTextNode(' '))
+                                }
+
                                 $setSelection($getRoot().selectStart()) // insert at start
                                 $insertNodes(nodesToInsert)
                                 $selectEnd()

lib/shared/src/configuration/clientCapabilities.ts

@@ -9,7 +9,7 @@ import type { ContextMentionProviderID } from '../mentions/api'
  * {@link ClientCapabilitiesWithLegacyFields.agentIDE} that are inferred in an ad-hoc way from the
  * environment and aren't self-reported by the client.
  */
-export interface ClientCapabilitiesWithLegacyFields {
+export interface ClientCapabilitiesWithLegacyFields extends ClientCapabilities {
     /**
      * The `agentIDE` value, which is the editor that Cody is being used with. If not set, it
      * defaults to {@link CodyIDE.VSCode} to match the previous behavior.

vscode/webviews/chat/components/WelcomeMessage.tsx

@@ -40,12 +40,12 @@ export const WelcomeMessage: FunctionComponent<WelcomeMessageProps> = ({
                 <PromptList
                     showSearch={false}
                     showFirstNItems={4}
-                    appearanceMode="chips-list"
-                    telemetryLocation="PromptsTab"
+                    recommendedOnly={true}
                     showCommandOrigins={true}
                     showOnlyPromptInsertableCommands={false}
                     showPromptLibraryUnsupportedMessage={false}
-                    recommendedOnly={true}
+                    appearanceMode="chips-list"
+                    telemetryLocation="WelcomeAreaPrompts"
                     onSelect={item => runAction(item, setView)}
                 />
 

vscode/webviews/components/promptList/ActionItem.module.css

@@ -19,6 +19,17 @@
             color: inherit;
         }
     }
+
+    &[data-disabled="true"]  {
+        /*
+         In order to override internal cmdk styles for disabled item.
+         We need to have events over element to have a tooltip over the
+         element on hover/focus.
+        */
+        pointer-events: auto !important;
+        background-color: transparent;
+        cursor: not-allowed;
+    }
 }
 
 .prompt {

vscode/webviews/components/promptList/ActionItem.tsx

@@ -25,6 +25,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from '../../components/shadcn
 
 import { commandRowValue } from './utils'
 
+import { useConfig } from '../../utils/useConfig'
 import styles from './ActionItem.module.css'
 
 interface ActionItemProps {
@@ -35,11 +36,22 @@ interface ActionItemProps {
 
 export const ActionItem: FC<ActionItemProps> = props => {
     const { action, className, onSelect } = props
+    const { clientCapabilities } = useConfig()
+    const isEditEnabled = clientCapabilities.edit !== 'none'
+    const isActionEditLike =
+        action.actionType === 'prompt' ? action.mode !== 'CHAT' : action.mode !== 'ask'
+    const isDisabled = !isEditEnabled && isActionEditLike
 
     return (
         <CommandItem
             value={commandRowValue(action)}
+            disabled={isDisabled}
             className={clsx(className, styles.item)}
+            tooltip={
+                isDisabled
+                    ? 'Edit-like action is not supported in current read-only environment'
+                    : undefined
+            }
             onSelect={onSelect}
         >
             {action.actionType === 'prompt' ? (

vscode/webviews/components/promptList/PromptList.tsx

@@ -24,7 +24,7 @@ import styles from './PromptList.module.css'
 interface PromptListProps {
     showSearch: boolean
     showFirstNItems?: number
-    telemetryLocation: 'PromptSelectField' | 'PromptsTab'
+    telemetryLocation: 'PromptSelectField' | 'PromptsTab' | 'WelcomeAreaPrompts'
     showOnlyPromptInsertableCommands?: boolean
     showCommandOrigins?: boolean
     showPromptLibraryUnsupportedMessage?: boolean

web/CHANGELOG.md

@@ -1,3 +1,8 @@
+## 0.13.0
+- Fix openctx mention by mocking Cody Web workspace root
+- Disable non-runnable prompts in Cody Web
+- Fix prompt editor placeholder 
+
 ## 0.11.0
 - Support an external API for Cody Panel functionality (now you can trigger running prompts outside of Cody Web component)
 

web/lib/agent/agent.client.ts

@@ -19,7 +19,6 @@ interface AgentClientOptions {
     serverEndpoint: string
     accessToken: string
     createAgentWorker: () => Worker
-    workspaceRootUri: string
     telemetryClientName?: string
     customHeaders?: Record<string, string>
     debug?: boolean
@@ -30,7 +29,6 @@ export async function createAgentClient({
     serverEndpoint,
     accessToken,
     createAgentWorker,
-    workspaceRootUri,
     customHeaders,
     telemetryClientName,
     debug = true,
@@ -70,8 +68,11 @@ export async function createAgentClient({
     const serverInfo: ServerInfo = await rpc.sendRequest('initialize', {
         name: process.env.CODY_WEB_DEMO ? 'standalone-web' : 'web',
         version: '0.0.1',
-        workspaceRootUri,
+        // Empty root URI leads to openctx configuration resolution failure, any non-empty
+        // mock value (Cody Web doesn't really use any workspace related features)
+        workspaceRootUri: 'sourcegraph/cody',
         capabilities: {
+            edit: 'none',
             completions: 'none',
             webview: 'agentic',
             disabledMentionsProviders: [FILE_CONTEXT_MENTION_PROVIDER.id],

web/lib/components/CodyWebChat.tsx

@@ -39,7 +39,7 @@ import { ChatSkeleton } from './skeleton/ChatSkeleton'
 // the cody agent properly (completely mock data)
 setDisplayPathEnvInfo({
     isWindows: false,
-    workspaceFolders: [URI.file('/tmp/foo')],
+    workspaceFolders: [],
 })
 
 export interface CodyWebChatProps {

web/lib/components/use-cody-agent.ts

@@ -62,7 +62,6 @@ export function useCodyWebAgent(input: UseCodyWebAgentInput): UseCodyWebAgentRes
             customHeaders,
             telemetryClientName,
             createAgentWorker,
-            workspaceRootUri: '',
             serverEndpoint: serverEndpoint,
             accessToken: accessToken ?? '',
         })

web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sourcegraph/cody-web",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "Cody standalone web app",
   "license": "Apache-2.0",
   "repository": {