-
Notifications
You must be signed in to change notification settings - Fork 1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(vscode): adding clickble symbol render in chat panel (#3420)
* feat: add onRenderLsp event handler for rendering language server protocol * feat: Add onRenderLsp event handler for rendering language server protocol * chore(vscode): update targetFile path to use workspace relative path * refactor: Update code to use KeywordInfo type for onRenderLsp event handler * feat: add onNavigateSymbol method to ClientApi interface * feat: add onNavigateSymbol method to ClientApi interface * feat: add onNavigateSymbol method to ClientApi interface * feat: add onHoverSymbol method to ClientApi interface * feat: add onHoverSymbol and findSymbolInfo methods to WebviewHelper * feat: add onHoverSymbol and findSymbolInfo methods to WebviewHelper * fix: update onNavigateSymbol parameter name in ClientApi interface * fix: update onNavigateSymbol parameter name in ClientApi interface * feat: Add support for onNavigateSymbol and onHoverSymbol in ChatPage The code changes in `ChatPage` component add support for the `onNavigateSymbol` and `onHoverSymbol` capabilities. These capabilities are checked and set using the `hasCapability` method of the server. The `onNavigateSymbol` and `onHoverSymbol` methods are conditionally used based on the support for these capabilities. This change enhances the functionality of the ChatPage component in the Tabby UI. * chore: remove unused type * feat: Update ClientApi interface to make onNavigateSymbol optional The ClientApi interface has been updated to make the onNavigateSymbol method optional. This change allows for better flexibility in implementing the interface, as the onNavigateSymbol method is now conditionally used based on the support for the capability. This update enhances the usability of the ClientApi interface in the Tabby UI. * feat: Add support for onHoverSymbol in ChatPage The code changes in `ChatPage` component add support for the `onHoverSymbol` capability. This capability is checked and set using the `hasCapability` method of the server. The `onHoverSymbol` method is conditionally used based on the support for this capability. This change enhances the functionality of the ChatPage component in the Tabby UI. * [autofix.ci] apply automated fixes * feat: Add activeSelection prop to MessageMarkdown and update imports * feat: Rename parameter in onNavigateSymbol to hintFilepaths for clarity * feat: Implement CodeElement component for rendering code in Markdown * refactor: Remove onNavigateToContext prop from MessageMarkdown and related components for simplification * feat: Rename onNavigateSymbol to onLookupSymbol and update its signature for improved clarity * feat: Rename onNavigateSymbol to onLookupSymbol and refactor symbol lookup logic for improved clarity and maintainability * feat: Rename onNavigateSymbol to onLookupSymbol and update related logic for consistency across components * [autofix.ci] apply automated fixes * update: render symbol * Update icons.tsx * [autofix.ci] apply automated fixes --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: liangfung <[email protected]> Co-authored-by: Meng Zhang <[email protected]>
- Loading branch information
4 people
authored
Dec 8, 2024
1 parent
5b6c845
commit c61a9ee
Showing
13 changed files
with
320 additions
and
71 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,113 @@ | ||
| import { ReactNode, useContext, useEffect } from 'react' | ||
| import { Element } from 'react-markdown/lib/ast-to-react' | ||
|
|
||
| import { cn } from '@/lib/utils' | ||
|
|
||
| import { CodeBlock } from '../ui/codeblock' | ||
| import { IconSquareChevronRight } from '../ui/icons' | ||
| import { MessageMarkdownContext } from './markdown-context' | ||
|
|
||
| export interface CodeElementProps { | ||
| node: Element | ||
| inline?: boolean | ||
| className?: string | ||
| children: ReactNode & ReactNode[] | ||
| } | ||
|
|
||
| /** | ||
| * Code element in Markdown AST. | ||
| */ | ||
| export function CodeElement({ | ||
| inline, | ||
| className, | ||
| children, | ||
| ...props | ||
| }: CodeElementProps) { | ||
| const { | ||
| lookupSymbol, | ||
| canWrapLongLines, | ||
| onApplyInEditor, | ||
| onCopyContent, | ||
| supportsOnApplyInEditorV2, | ||
| onNavigateToContext, | ||
| symbolPositionMap | ||
| } = useContext(MessageMarkdownContext) | ||
|
|
||
| const keyword = children[0]?.toString() | ||
| const symbolLocation = keyword ? symbolPositionMap.get(keyword) : undefined | ||
|
|
||
| useEffect(() => { | ||
| if (!inline || !lookupSymbol || !keyword) return | ||
| lookupSymbol(keyword) | ||
| }, [inline, keyword, lookupSymbol]) | ||
|
|
||
| if (children.length) { | ||
| if (children[0] === '▍') { | ||
| return <span className="mt-1 animate-pulse cursor-default">▍</span> | ||
| } | ||
| children[0] = (children[0] as string).replace('`▍`', '▍') | ||
| } | ||
|
|
||
| if (inline) { | ||
| const isSymbolNavigable = Boolean(symbolLocation) | ||
|
|
||
| const handleClick = () => { | ||
| if (!isSymbolNavigable || !symbolLocation || !onNavigateToContext) return | ||
|
|
||
| onNavigateToContext( | ||
| { | ||
| filepath: symbolLocation.targetFile, | ||
| range: { | ||
| start: symbolLocation.targetLine, | ||
| end: symbolLocation.targetLine | ||
| }, | ||
| git_url: '', | ||
| content: '', | ||
| kind: 'file' | ||
| }, | ||
| { | ||
| openInEditor: true | ||
| } | ||
| ) | ||
| } | ||
|
|
||
| return ( | ||
| <code | ||
| className={cn( | ||
| 'group/symbol inline-flex flex-nowrap items-center gap-1', | ||
| className, | ||
| { | ||
| symbol: !!lookupSymbol, | ||
| 'bg-muted leading-5': !isSymbolNavigable, | ||
| 'cursor-pointer hover:bg-muted/50 border': isSymbolNavigable | ||
| } | ||
| )} | ||
| onClick={handleClick} | ||
| {...props} | ||
| > | ||
| {isSymbolNavigable && ( | ||
| <IconSquareChevronRight className="h-3.5 w-3.5 text-primary" /> | ||
| )} | ||
| <span | ||
| className={cn('self-baseline', { | ||
| 'group-hover/symbol:text-primary': isSymbolNavigable | ||
| })} | ||
| > | ||
| {children} | ||
| </span> | ||
| </code> | ||
| ) | ||
| } | ||
|
|
||
| const match = /language-(\w+)/.exec(className || '') | ||
| return ( | ||
| <CodeBlock | ||
| language={(match && match[1]) || ''} | ||
| value={String(children).replace(/\n$/, '')} | ||
| onApplyInEditor={onApplyInEditor} | ||
| onCopyContent={onCopyContent} | ||
| canWrapLongLines={canWrapLongLines} | ||
| supportsOnApplyInEditorV2={supportsOnApplyInEditorV2} | ||
| /> | ||
| ) | ||
| } |
Oops, something went wrong.