mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-09-21 21:50:49 +02:00
aae413cc71
* better i18n support an internationalization-framework. * removed unused package * auto sort for translation.json * fixed tests with the new locales function * added new CI actions from locize * to use locize a mention in the README.md * to use locize a mention in the README.md * updated README.md and added TRANSLATION.md to the repo * updated TRANSLATION.md badges * updated README.md to go to the TRANSLATION.md when clicking on the Translation Progress badge * updated TRANSLATION.md and added a new issue template. * updated TRANSLATION.md and added a new issue template. * updated issue template to add the iso code link. * updated the new GitHub actions for `locize` * updated label for new issue template --> i18n * fixed type issue * Fix eslint * Fix eslint with key-spacing spacing * fix: error type * fix: handle undefined values in SortFilterHeader component * fix: typing in Image component * fix: handle optional promptGroup in PromptCard component * fix: update localize function to accept string type and remove unnecessary JSX element * fix: update localize function to enforce TranslationKeys type for better type safety * fix: improve type safety and handle null values in Assistants component * fix: enhance null checks for fileId in FilesListView component * fix: localize 'Go back' button text in FilesListView component * fix: update aria-label for menu buttons and add translation for 'Close Menu' * docs: add Reasoning UI section for Chain-of-Thought AI models in README * fix: enhance type safety by adding type for message in MultiMessage component * fix: improve null checks and optional chaining in useAutoSave hook * fix: improve handling of optional properties in cleanupPreset function * fix: ensure isFetchingNextPage defaults to false and improve null checks for messages in Search component * fix: enhance type safety and null checks in useBuildMessageTree hook --------- Co-authored-by: Danny Avila <danny@librechat.ai>
75 lines
2.7 KiB
TypeScript
75 lines
2.7 KiB
TypeScript
import { TPlugin } from 'librechat-data-provider';
|
|
import { XCircle, PlusCircleIcon, Wrench } from 'lucide-react';
|
|
import { useLocalize } from '~/hooks';
|
|
|
|
type ToolItemProps = {
|
|
tool: TPlugin;
|
|
onAddTool: () => void;
|
|
onRemoveTool: () => void;
|
|
isInstalled?: boolean;
|
|
};
|
|
|
|
function ToolItem({ tool, onAddTool, onRemoveTool, isInstalled = false }: ToolItemProps) {
|
|
const localize = useLocalize();
|
|
const handleClick = () => {
|
|
if (isInstalled) {
|
|
onRemoveTool();
|
|
} else {
|
|
onAddTool();
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="flex flex-col gap-4 rounded border border-border-medium bg-transparent p-6">
|
|
<div className="flex gap-4">
|
|
<div className="h-[70px] w-[70px] shrink-0">
|
|
<div className="relative h-full w-full">
|
|
{tool.icon != null && tool.icon ? (
|
|
<img
|
|
src={tool.icon}
|
|
alt={localize('com_ui_logo', { 0: tool.name })}
|
|
className="h-full w-full rounded-[5px] bg-white"
|
|
/>
|
|
) : (
|
|
<div className="flex h-full w-full items-center justify-center rounded-[5px] border border-border-medium bg-transparent">
|
|
<Wrench className="h-8 w-8 text-text-secondary" />
|
|
</div>
|
|
)}
|
|
<div className="absolute inset-0 rounded-[5px] ring-1 ring-inset ring-black/10"></div>
|
|
</div>
|
|
</div>
|
|
<div className="flex min-w-0 flex-col items-start justify-between">
|
|
<div className="mb-2 line-clamp-1 max-w-full text-lg leading-5 text-text-primary">
|
|
{tool.name}
|
|
</div>
|
|
{!isInstalled ? (
|
|
<button
|
|
className="btn btn-primary relative"
|
|
aria-label={`${localize('com_ui_add')} ${tool.name}`}
|
|
onClick={handleClick}
|
|
>
|
|
<div className="flex w-full items-center justify-center gap-2">
|
|
{localize('com_ui_add')}
|
|
<PlusCircleIcon className="flex h-4 w-4 items-center stroke-2" />
|
|
</div>
|
|
</button>
|
|
) : (
|
|
<button
|
|
className="btn relative bg-gray-300 hover:bg-gray-400 dark:bg-gray-50 dark:hover:bg-gray-200"
|
|
onClick={handleClick}
|
|
aria-label={`${localize('com_nav_tool_remove')} ${tool.name}`}
|
|
>
|
|
<div className="flex w-full items-center justify-center gap-2">
|
|
{localize('com_nav_tool_remove')}
|
|
<XCircle className="flex h-4 w-4 items-center stroke-2" />
|
|
</div>
|
|
</button>
|
|
)}
|
|
</div>
|
|
</div>
|
|
<div className="line-clamp-3 h-[60px] text-sm text-text-secondary">{tool.description}</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default ToolItem;
|