|
|
|
@@ -61,37 +61,39 @@ export const ToolIcon = memo(({ providerName }: ToolIconProps) => { |
|
|
|
> |
|
|
|
<div |
|
|
|
className={classNames( |
|
|
|
'relative flex size-5 items-center justify-center rounded-[6px] border-[0.5px] border-components-panel-border-subtle bg-background-default-dodge', |
|
|
|
'relative', |
|
|
|
)} |
|
|
|
ref={containerRef} |
|
|
|
> |
|
|
|
{(() => { |
|
|
|
if (iconFetchError || !icon) |
|
|
|
<div className="flex size-5 items-center justify-center overflow-hidden rounded-[6px] border-[0.5px] border-components-panel-border-subtle bg-background-default-dodge"> |
|
|
|
{(() => { |
|
|
|
if (iconFetchError || !icon) |
|
|
|
return <Group className="h-3 w-3 opacity-35" /> |
|
|
|
if (typeof icon === 'string') { |
|
|
|
return <img |
|
|
|
src={icon} |
|
|
|
alt='tool icon' |
|
|
|
className={classNames( |
|
|
|
'size-3.5 h-full w-full object-cover', |
|
|
|
notSuccess && 'opacity-50', |
|
|
|
)} |
|
|
|
onError={() => setIconFetchError(true)} |
|
|
|
/> |
|
|
|
} |
|
|
|
if (typeof icon === 'object') { |
|
|
|
return <AppIcon |
|
|
|
className={classNames( |
|
|
|
'size-3.5 h-full w-full object-cover', |
|
|
|
notSuccess && 'opacity-50', |
|
|
|
)} |
|
|
|
icon={icon?.content} |
|
|
|
background={icon?.background} |
|
|
|
/> |
|
|
|
} |
|
|
|
return <Group className="h-3 w-3 opacity-35" /> |
|
|
|
if (typeof icon === 'string') { |
|
|
|
return <img |
|
|
|
src={icon} |
|
|
|
alt='tool icon' |
|
|
|
className={classNames( |
|
|
|
'size-3.5 h-full w-full object-cover', |
|
|
|
notSuccess && 'opacity-50', |
|
|
|
)} |
|
|
|
onError={() => setIconFetchError(true)} |
|
|
|
/> |
|
|
|
} |
|
|
|
if (typeof icon === 'object') { |
|
|
|
return <AppIcon |
|
|
|
className={classNames( |
|
|
|
'size-3.5 h-full w-full object-cover', |
|
|
|
notSuccess && 'opacity-50', |
|
|
|
)} |
|
|
|
icon={icon?.content} |
|
|
|
background={icon?.background} |
|
|
|
/> |
|
|
|
} |
|
|
|
return <Group className="h-3 w-3 opacity-35" /> |
|
|
|
})()} |
|
|
|
{indicator && <Indicator color={indicator} className="absolute right-[-1px] top-[-1px]" />} |
|
|
|
})()} |
|
|
|
</div> |
|
|
|
{indicator && <Indicator color={indicator} className="absolute -right-[1px] -top-[1px]" />} |
|
|
|
</div> |
|
|
|
</Tooltip> |
|
|
|
}) |