diff --git a/src/modules/tools/ToolCard.module.scss b/src/modules/tools/ToolCard.module.scss index 5e9c69ee..8bcbb07d 100644 --- a/src/modules/tools/ToolCard.module.scss +++ b/src/modules/tools/ToolCard.module.scss @@ -41,4 +41,9 @@ display: flex; flex-direction: column; gap: $spacing-04; + + a { + position: relative; + z-index: 1; + } } diff --git a/src/modules/tools/ToolCard.tsx b/src/modules/tools/ToolCard.tsx index 05bb7880..1878e17f 100644 --- a/src/modules/tools/ToolCard.tsx +++ b/src/modules/tools/ToolCard.tsx @@ -27,7 +27,7 @@ import { getToolIcon, getToolReference, isExternalTool } from './utils'; import { ArrowRight, ArrowUpRight, Edit, View } from '@carbon/react/icons'; import { UserToolModal } from './manage/UserToolModal'; import { PublicToolModal } from './manage/PublicToolModal'; -import Markdown from 'react-markdown'; +import Markdown, { Components } from 'react-markdown'; interface Props { tool: Tool; @@ -96,7 +96,7 @@ export function ToolCard({ tool, onDeleteSuccess, onSaveSuccess }: Props) {
{toolDescription && (

- {toolDescription} +

)} {isExternalTool(tool.type, tool.id) && } @@ -114,3 +114,15 @@ export function ToolIcon({ tool }: { tool: Tool }) { ); } + +export function ToolDescription({ description }: { description: string }) { + return {description}; +} + +export const TRANSFORM_COMPONENTS: Partial = { + a: ({ node, ...props }) => ( + + {props.children} + + ), +}; diff --git a/src/modules/tools/manage/PublicToolModal.tsx b/src/modules/tools/manage/PublicToolModal.tsx index 88ea8258..d8dcff3a 100644 --- a/src/modules/tools/manage/PublicToolModal.tsx +++ b/src/modules/tools/manage/PublicToolModal.tsx @@ -19,7 +19,7 @@ import { Modal } from '@/components/Modal/Modal'; import { ModalProps } from '@/layout/providers/ModalProvider'; import { ModalBody, ModalHeader } from '@carbon/react'; import classes from './PublicToolModal.module.scss'; -import { ToolIcon } from '../ToolCard'; +import { ToolDescription, ToolIcon } from '../ToolCard'; import { ToolExternalTag } from '@/modules/assistants/tools/ToolToggle'; import { isExternalTool } from '../utils'; import Markdown from 'react-markdown'; @@ -39,7 +39,7 @@ export function PublicToolModal({ tool, ...props }: Props) {

{tool.name}

- {tool.user_description} +