mirror of
https://github.com/danny-avila/LibreChat.git
synced 2026-01-06 02:28:51 +01:00
🪦 refactor: Remove Legacy Code (#10533)
* 🗑️ chore: Remove unused Legacy Provider clients and related helpers * Deleted OpenAIClient and GoogleClient files along with their associated tests. * Removed references to these clients in the clients index file. * Cleaned up typedefs by removing the OpenAISpecClient export. * Updated chat controllers to use the OpenAI SDK directly instead of the removed client classes. * chore/remove-openapi-specs * 🗑️ chore: Remove unused mergeSort and misc utility functions * Deleted mergeSort.js and misc.js files as they are no longer needed. * Removed references to cleanUpPrimaryKeyValue in messages.js and adjusted related logic. * Updated mongoMeili.ts to eliminate local implementations of removed functions. * chore: remove legacy endpoints * chore: remove all plugins endpoint related code * chore: remove unused prompt handling code and clean up imports * Deleted handleInputs.js and instructions.js files as they are no longer needed. * Removed references to these files in the prompts index.js. * Updated docker-compose.yml to simplify reverse proxy configuration. * chore: remove unused LightningIcon import from Icons.tsx * chore: clean up translation.json by removing deprecated and unused keys * chore: update Jest configuration and remove unused mock file * Simplified the setupFiles array in jest.config.js by removing the fetchEventSource mock. * Deleted the fetchEventSource.js mock file as it is no longer needed. * fix: simplify endpoint type check in Landing and ConversationStarters components * Updated the endpoint type check to use strict equality for better clarity and performance. * Ensured consistency in the handling of the azureOpenAI endpoint across both components. * chore: remove unused dependencies from package.json and package-lock.json * chore: remove legacy EditController, associated routes and imports * chore: update banResponse logic to refine request handling for banned users * chore: remove unused validateEndpoint middleware and its references * chore: remove unused 'res' parameter from initializeClient in multiple endpoint files * chore: remove unused 'isSmallScreen' prop from BookmarkNav and NewChat components; clean up imports in ArchivedChatsTable and useSetIndexOptions hooks; enhance localization in PromptVersions * chore: remove unused import of Constants and TMessage from MobileNav; retain only necessary QueryKeys import * chore: remove unused TResPlugin type and related references; clean up imports in types and schemas
This commit is contained in:
parent
b6dcefc53a
commit
656e1abaea
161 changed files with 256 additions and 10513 deletions
|
|
@ -70,7 +70,7 @@ function PluginAuthForm({ plugin, onSubmit, isEntityTool }: TPluginAuthFormProps
|
|||
</HoverCard>
|
||||
{errors[authField] && (
|
||||
<span role="alert" className="mt-1 text-sm text-red-400">
|
||||
{errors[authField].message as string}
|
||||
{errors?.[authField]?.message ?? ''}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,245 +0,0 @@
|
|||
import { Search, X } from 'lucide-react';
|
||||
import { Dialog, DialogPanel, DialogTitle } from '@headlessui/react';
|
||||
import { useState, useEffect, useCallback } from 'react';
|
||||
import { useAvailablePluginsQuery } from 'librechat-data-provider/react-query';
|
||||
import type { TError, TPlugin, TPluginAction } from 'librechat-data-provider';
|
||||
import type { TPluginStoreDialogProps } from '~/common/types';
|
||||
import {
|
||||
usePluginDialogHelpers,
|
||||
useSetIndexOptions,
|
||||
usePluginInstall,
|
||||
useAuthContext,
|
||||
useLocalize,
|
||||
} from '~/hooks';
|
||||
import PluginPagination from './PluginPagination';
|
||||
import PluginStoreItem from './PluginStoreItem';
|
||||
import PluginAuthForm from './PluginAuthForm';
|
||||
|
||||
function PluginStoreDialog({ isOpen, setIsOpen }: TPluginStoreDialogProps) {
|
||||
const localize = useLocalize();
|
||||
const { user } = useAuthContext();
|
||||
const { data: availablePlugins } = useAvailablePluginsQuery();
|
||||
const { setTools } = useSetIndexOptions();
|
||||
|
||||
const [userPlugins, setUserPlugins] = useState<string[]>([]);
|
||||
|
||||
const {
|
||||
maxPage,
|
||||
setMaxPage,
|
||||
currentPage,
|
||||
setCurrentPage,
|
||||
itemsPerPage,
|
||||
searchChanged,
|
||||
setSearchChanged,
|
||||
searchValue,
|
||||
setSearchValue,
|
||||
gridRef,
|
||||
handleSearch,
|
||||
handleChangePage,
|
||||
error,
|
||||
setError,
|
||||
errorMessage,
|
||||
setErrorMessage,
|
||||
showPluginAuthForm,
|
||||
setShowPluginAuthForm,
|
||||
selectedPlugin,
|
||||
setSelectedPlugin,
|
||||
} = usePluginDialogHelpers();
|
||||
|
||||
const handleInstallError = useCallback(
|
||||
(error: TError) => {
|
||||
setError(true);
|
||||
if (error.response?.data?.message) {
|
||||
setErrorMessage(error.response.data.message);
|
||||
}
|
||||
setTimeout(() => {
|
||||
setError(false);
|
||||
setErrorMessage('');
|
||||
}, 5000);
|
||||
},
|
||||
[setError, setErrorMessage],
|
||||
);
|
||||
|
||||
const { installPlugin, uninstallPlugin } = usePluginInstall({
|
||||
onInstallError: handleInstallError,
|
||||
onUninstallError: handleInstallError,
|
||||
onUninstallSuccess: (_data, variables) => {
|
||||
setTools(variables.pluginKey, true);
|
||||
},
|
||||
});
|
||||
|
||||
const handleInstall = (pluginAction: TPluginAction, plugin?: TPlugin) => {
|
||||
if (!plugin) {
|
||||
return;
|
||||
}
|
||||
installPlugin(pluginAction, plugin);
|
||||
setShowPluginAuthForm(false);
|
||||
};
|
||||
|
||||
const onPluginInstall = (pluginKey: string) => {
|
||||
const plugin = availablePlugins?.find((p) => p.pluginKey === pluginKey);
|
||||
if (!plugin) {
|
||||
return;
|
||||
}
|
||||
setSelectedPlugin(plugin);
|
||||
|
||||
const { authConfig, authenticated } = plugin ?? {};
|
||||
|
||||
if (authConfig && authConfig.length > 0 && !authenticated) {
|
||||
setShowPluginAuthForm(true);
|
||||
} else {
|
||||
handleInstall({ pluginKey, action: 'install', auth: null }, plugin);
|
||||
}
|
||||
};
|
||||
|
||||
const filteredPlugins = availablePlugins?.filter((plugin) =>
|
||||
plugin.name.toLowerCase().includes(searchValue.toLowerCase()),
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (user && user.plugins) {
|
||||
setUserPlugins(user.plugins);
|
||||
}
|
||||
|
||||
if (filteredPlugins) {
|
||||
setMaxPage(Math.ceil(filteredPlugins.length / itemsPerPage));
|
||||
if (searchChanged) {
|
||||
setCurrentPage(1);
|
||||
setSearchChanged(false);
|
||||
}
|
||||
}
|
||||
}, [
|
||||
availablePlugins,
|
||||
itemsPerPage,
|
||||
user,
|
||||
searchValue,
|
||||
filteredPlugins,
|
||||
searchChanged,
|
||||
setMaxPage,
|
||||
setCurrentPage,
|
||||
setSearchChanged,
|
||||
]);
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={isOpen}
|
||||
onClose={() => {
|
||||
setIsOpen(false);
|
||||
setCurrentPage(1);
|
||||
setSearchValue('');
|
||||
}}
|
||||
className="relative z-[102]"
|
||||
>
|
||||
{/* The backdrop, rendered as a fixed sibling to the panel container */}
|
||||
<div className="fixed inset-0 bg-gray-600/65 transition-opacity dark:bg-black/80" />
|
||||
{/* Full-screen container to center the panel */}
|
||||
<div className="fixed inset-0 flex items-center justify-center p-4">
|
||||
<DialogPanel
|
||||
className="relative w-full transform overflow-hidden overflow-y-auto rounded-lg bg-white text-left shadow-xl transition-all dark:bg-gray-700 max-sm:h-full sm:mx-7 sm:my-8 sm:max-w-2xl lg:max-w-5xl xl:max-w-7xl"
|
||||
style={{ minHeight: '610px' }}
|
||||
>
|
||||
<div className="flex items-center justify-between border-b-[1px] border-black/10 p-6 pb-4 dark:border-white/10">
|
||||
<div className="flex items-center">
|
||||
<div className="text-center sm:text-left">
|
||||
<DialogTitle className="text-lg font-medium leading-6 text-gray-800 dark:text-gray-200">
|
||||
{localize('com_nav_plugin_store')}
|
||||
</DialogTitle>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="sm:mt-0">
|
||||
<button
|
||||
onClick={() => {
|
||||
setIsOpen(false);
|
||||
setCurrentPage(1);
|
||||
}}
|
||||
className="inline-block text-gray-500 hover:text-gray-200"
|
||||
tabIndex={0}
|
||||
>
|
||||
<X />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{error && (
|
||||
<div
|
||||
className="relative m-4 rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700"
|
||||
role="alert"
|
||||
>
|
||||
{localize('com_nav_plugin_auth_error')} {errorMessage}
|
||||
</div>
|
||||
)}
|
||||
{showPluginAuthForm && (
|
||||
<div className="p-4 sm:p-6 sm:pt-4">
|
||||
<PluginAuthForm
|
||||
plugin={selectedPlugin}
|
||||
onSubmit={(action: TPluginAction) => handleInstall(action, selectedPlugin)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
<div className="p-4 sm:p-6 sm:pt-4">
|
||||
<div className="mt-4 flex flex-col gap-4">
|
||||
<div className="flex items-center">
|
||||
<div className="relative flex items-center">
|
||||
<Search className="absolute left-2 h-6 w-6 text-gray-500" aria-hidden="true" />
|
||||
<input
|
||||
type="text"
|
||||
value={searchValue}
|
||||
onChange={handleSearch}
|
||||
placeholder={localize('com_nav_plugin_search')}
|
||||
className="text-token-text-primary flex rounded-md border border-border-heavy bg-surface-tertiary py-2 pl-10 pr-2"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
ref={gridRef}
|
||||
className="grid grid-cols-1 grid-rows-2 gap-3 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"
|
||||
style={{ minHeight: '410px' }}
|
||||
>
|
||||
{filteredPlugins &&
|
||||
filteredPlugins
|
||||
.slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage)
|
||||
.map((plugin, index) => (
|
||||
<PluginStoreItem
|
||||
key={index}
|
||||
plugin={plugin}
|
||||
isInstalled={userPlugins.includes(plugin.pluginKey)}
|
||||
onInstall={() => onPluginInstall(plugin.pluginKey)}
|
||||
onUninstall={() => uninstallPlugin(plugin.pluginKey)}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-2 flex flex-col items-center gap-2 sm:flex-row sm:justify-between">
|
||||
{maxPage > 0 ? (
|
||||
<PluginPagination
|
||||
currentPage={currentPage}
|
||||
maxPage={maxPage}
|
||||
onChangePage={handleChangePage}
|
||||
/>
|
||||
) : (
|
||||
<div style={{ height: '21px' }}></div>
|
||||
)}
|
||||
{/* API not yet implemented: */}
|
||||
{/* <div className="flex flex-col items-center gap-2 sm:flex-row">
|
||||
<PluginStoreLinkButton
|
||||
label="Install an unverified plugin"
|
||||
onClick={onInstallUnverifiedPlugin}
|
||||
/>
|
||||
<div className="hidden h-4 border-l border-black/30 dark:border-white/30 sm:block"></div>
|
||||
<PluginStoreLinkButton
|
||||
label="Develop your own plugin"
|
||||
onClick={onDevelopPluginClick}
|
||||
/>
|
||||
<div className="hidden h-4 border-l border-black/30 dark:border-white/30 sm:block"></div>
|
||||
<PluginStoreLinkButton label="About plugins" onClick={onAboutPluginsClick} />
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</DialogPanel>
|
||||
</div>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
|
||||
export default PluginStoreDialog;
|
||||
|
|
@ -1,76 +0,0 @@
|
|||
import { TPlugin } from 'librechat-data-provider';
|
||||
import { XCircle, DownloadCloud } from 'lucide-react';
|
||||
import { useLocalize } from '~/hooks';
|
||||
|
||||
type TPluginStoreItemProps = {
|
||||
plugin: TPlugin;
|
||||
onInstall: () => void;
|
||||
onUninstall: () => void;
|
||||
isInstalled?: boolean;
|
||||
};
|
||||
|
||||
function PluginStoreItem({ plugin, onInstall, onUninstall, isInstalled }: TPluginStoreItemProps) {
|
||||
const localize = useLocalize();
|
||||
const handleClick = () => {
|
||||
if (isInstalled) {
|
||||
onUninstall();
|
||||
} else {
|
||||
onInstall();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex flex-col gap-4 rounded border border-black/10 bg-white p-6 dark:border-gray-500 dark:bg-gray-700">
|
||||
<div className="flex gap-4">
|
||||
<div className="h-[70px] w-[70px] shrink-0">
|
||||
<div className="relative h-full w-full">
|
||||
<img
|
||||
src={plugin.icon}
|
||||
alt={`${plugin.name} logo`}
|
||||
className="h-full w-full rounded-[5px]"
|
||||
/>
|
||||
<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-gray-700/80 dark:text-gray-50">
|
||||
{plugin.name}
|
||||
</div>
|
||||
{!isInstalled ? (
|
||||
<button
|
||||
className="btn btn-primary relative"
|
||||
aria-label={`${localize('com_nav_plugin_install')} ${plugin.name}`}
|
||||
onClick={handleClick}
|
||||
>
|
||||
<div className="flex w-full items-center justify-center gap-2">
|
||||
{localize('com_nav_plugin_install')}
|
||||
<DownloadCloud
|
||||
className="flex h-4 w-4 items-center stroke-2"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</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_plugin_uninstall')} ${plugin.name}`}
|
||||
>
|
||||
<div className="flex w-full items-center justify-center gap-2">
|
||||
{localize('com_nav_plugin_uninstall')}
|
||||
<XCircle className="flex h-4 w-4 items-center stroke-2" aria-hidden="true" />
|
||||
</div>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="line-clamp-3 h-[60px] text-sm text-gray-700/70 dark:text-gray-50/70">
|
||||
{plugin.description}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default PluginStoreItem;
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
type TPluginStoreLinkButtonProps = {
|
||||
onClick: () => void;
|
||||
label: string;
|
||||
};
|
||||
|
||||
function PluginStoreLinkButton({ onClick, label }: TPluginStoreLinkButtonProps) {
|
||||
return (
|
||||
<div
|
||||
role="button"
|
||||
onClick={onClick}
|
||||
className="text-sm text-black/70 hover:text-black/50 dark:text-white/70 dark:hover:text-white/50"
|
||||
>
|
||||
{label}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default PluginStoreLinkButton;
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
import { HoverCardPortal, HoverCardContent } from '@librechat/client';
|
||||
import './styles.module.css';
|
||||
|
||||
type TPluginTooltipProps = {
|
||||
content: string;
|
||||
|
|
@ -9,11 +8,9 @@ type TPluginTooltipProps = {
|
|||
function PluginTooltip({ content, position }: TPluginTooltipProps) {
|
||||
return (
|
||||
<HoverCardPortal>
|
||||
<HoverCardContent side={position} className="w-80 ">
|
||||
<HoverCardContent side={position} className="w-80">
|
||||
<div className="space-y-2">
|
||||
<div className="text-sm text-gray-600 dark:text-gray-300">
|
||||
{content}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-300">{content}</div>
|
||||
</div>
|
||||
</HoverCardContent>
|
||||
</HoverCardPortal>
|
||||
|
|
|
|||
|
|
@ -1,223 +0,0 @@
|
|||
import { render, screen, fireEvent } from 'test/layout-test-utils';
|
||||
import PluginStoreDialog from '../PluginStoreDialog';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import * as mockDataProvider from 'librechat-data-provider/react-query';
|
||||
import * as authMutations from '~/data-provider/Auth/mutations';
|
||||
import * as authQueries from '~/data-provider/Auth/queries';
|
||||
|
||||
jest.mock('librechat-data-provider/react-query');
|
||||
|
||||
class ResizeObserver {
|
||||
observe() {
|
||||
// do nothing
|
||||
}
|
||||
unobserve() {
|
||||
// do nothing
|
||||
}
|
||||
disconnect() {
|
||||
// do nothing
|
||||
}
|
||||
}
|
||||
|
||||
window.ResizeObserver = ResizeObserver;
|
||||
|
||||
const pluginsQueryResult = [
|
||||
{
|
||||
name: 'Google',
|
||||
pluginKey: 'google',
|
||||
description: 'Use Google Search to find information',
|
||||
icon: 'https://i.imgur.com/SMmVkNB.png',
|
||||
authConfig: [
|
||||
{
|
||||
authField: 'GOOGLE_CSE_ID',
|
||||
label: 'Google CSE ID',
|
||||
description: 'This is your Google Custom Search Engine ID.',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'Wolfram',
|
||||
pluginKey: 'wolfram',
|
||||
description:
|
||||
'Access computation, math, curated knowledge & real-time data through Wolfram|Alpha and Wolfram Language.',
|
||||
icon: 'https://www.wolframcdn.com/images/icons/Wolfram.png',
|
||||
authConfig: [
|
||||
{
|
||||
authField: 'WOLFRAM_APP_ID',
|
||||
label: 'Wolfram App ID',
|
||||
description: 'An AppID must be supplied in all calls to the Wolfram|Alpha API.',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'Calculator',
|
||||
pluginKey: 'calculator',
|
||||
description: 'A simple calculator plugin',
|
||||
icon: 'https://i.imgur.com/SMmVkNB.png',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 1',
|
||||
pluginKey: 'plugin1',
|
||||
description: 'description for Plugin 1.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 2',
|
||||
pluginKey: 'plugin2',
|
||||
description: 'description for Plugin 2.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 3',
|
||||
pluginKey: 'plugin3',
|
||||
description: 'description for Plugin 3.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 4',
|
||||
pluginKey: 'plugin4',
|
||||
description: 'description for Plugin 4.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 5',
|
||||
pluginKey: 'plugin5',
|
||||
description: 'description for Plugin 5.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 6',
|
||||
pluginKey: 'plugin6',
|
||||
description: 'description for Plugin 6.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
{
|
||||
name: 'Plugin 7',
|
||||
pluginKey: 'plugin7',
|
||||
description: 'description for Plugin 7.',
|
||||
icon: 'mock-icon',
|
||||
authConfig: [],
|
||||
},
|
||||
];
|
||||
|
||||
const setup = ({
|
||||
useGetUserQueryReturnValue = {
|
||||
isLoading: false,
|
||||
isError: false,
|
||||
data: {
|
||||
plugins: ['wolfram'],
|
||||
},
|
||||
},
|
||||
useRefreshTokenMutationReturnValue = {
|
||||
isLoading: false,
|
||||
isError: false,
|
||||
mutate: jest.fn(),
|
||||
data: {
|
||||
token: 'mock-token',
|
||||
user: {},
|
||||
},
|
||||
},
|
||||
useAvailablePluginsQueryReturnValue = {
|
||||
isLoading: false,
|
||||
isError: false,
|
||||
data: pluginsQueryResult,
|
||||
},
|
||||
useUpdateUserPluginsMutationReturnValue = {
|
||||
isLoading: false,
|
||||
isError: false,
|
||||
mutate: jest.fn(),
|
||||
data: {},
|
||||
},
|
||||
} = {}) => {
|
||||
const mockUseAvailablePluginsQuery = jest
|
||||
.spyOn(mockDataProvider, 'useAvailablePluginsQuery')
|
||||
//@ts-ignore - we don't need all parameters of the QueryObserverSuccessResult
|
||||
.mockReturnValue(useAvailablePluginsQueryReturnValue);
|
||||
const mockUseUpdateUserPluginsMutation = jest
|
||||
.spyOn(mockDataProvider, 'useUpdateUserPluginsMutation')
|
||||
//@ts-ignore - we don't need all parameters of the QueryObserverSuccessResult
|
||||
.mockReturnValue(useUpdateUserPluginsMutationReturnValue);
|
||||
const mockUseGetUserQuery = jest
|
||||
.spyOn(authQueries, 'useGetUserQuery')
|
||||
//@ts-ignore - we don't need all parameters of the QueryObserverSuccessResult
|
||||
.mockReturnValue(useGetUserQueryReturnValue);
|
||||
const mockUseRefreshTokenMutation = jest
|
||||
.spyOn(authMutations, 'useRefreshTokenMutation')
|
||||
//@ts-ignore - we don't need all parameters of the QueryObserverSuccessResult
|
||||
.mockReturnValue(useRefreshTokenMutationReturnValue);
|
||||
const mockSetIsOpen = jest.fn();
|
||||
const renderResult = render(<PluginStoreDialog isOpen={true} setIsOpen={mockSetIsOpen} />);
|
||||
|
||||
return {
|
||||
...renderResult,
|
||||
mockUseGetUserQuery,
|
||||
mockUseAvailablePluginsQuery,
|
||||
mockUseUpdateUserPluginsMutation,
|
||||
mockUseRefreshTokenMutation,
|
||||
mockSetIsOpen,
|
||||
};
|
||||
};
|
||||
|
||||
test('renders plugin store dialog with plugins from the available plugins query and shows install/uninstall buttons based on user plugins', () => {
|
||||
const { getByText, getByRole } = setup();
|
||||
expect(getByText(/Plugin Store/i)).toBeInTheDocument();
|
||||
expect(getByText(/Use Google Search to find information/i)).toBeInTheDocument();
|
||||
expect(getByRole('button', { name: 'Install Google' })).toBeInTheDocument();
|
||||
expect(getByRole('button', { name: 'Uninstall Wolfram' })).toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('Displays the plugin auth form when installing a plugin with auth', async () => {
|
||||
const { getByRole, getByText } = setup();
|
||||
const googleButton = getByRole('button', { name: 'Install Google' });
|
||||
await userEvent.click(googleButton);
|
||||
expect(getByText(/Google CSE ID/i)).toBeInTheDocument();
|
||||
expect(getByRole('button', { name: 'Save' })).toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('allows the user to navigate between pages', async () => {
|
||||
const { getByRole, getByText } = setup();
|
||||
|
||||
expect(getByText('Google')).toBeInTheDocument();
|
||||
expect(getByText('Wolfram')).toBeInTheDocument();
|
||||
expect(getByText('Plugin 1')).toBeInTheDocument();
|
||||
|
||||
const nextPageButton = getByRole('button', { name: 'Next page' });
|
||||
await userEvent.click(nextPageButton);
|
||||
|
||||
expect(getByText('Plugin 6')).toBeInTheDocument();
|
||||
expect(getByText('Plugin 7')).toBeInTheDocument();
|
||||
// expect(getByText('Plugin 3')).toBeInTheDocument();
|
||||
// expect(getByText('Plugin 4')).toBeInTheDocument();
|
||||
// expect(getByText('Plugin 5')).toBeInTheDocument();
|
||||
|
||||
const previousPageButton = getByRole('button', { name: 'Previous page' });
|
||||
await userEvent.click(previousPageButton);
|
||||
|
||||
expect(getByText('Google')).toBeInTheDocument();
|
||||
expect(getByText('Wolfram')).toBeInTheDocument();
|
||||
expect(getByText('Plugin 1')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('allows the user to search for plugins', async () => {
|
||||
setup();
|
||||
|
||||
const searchInput = screen.getByPlaceholderText('Search plugins');
|
||||
fireEvent.change(searchInput, { target: { value: 'Google' } });
|
||||
|
||||
expect(screen.getByText('Google')).toBeInTheDocument();
|
||||
expect(screen.queryByText('Wolfram')).not.toBeInTheDocument();
|
||||
expect(screen.queryByText('Plugin 1')).not.toBeInTheDocument();
|
||||
|
||||
fireEvent.change(searchInput, { target: { value: 'Plugin 1' } });
|
||||
|
||||
expect(screen.getByText('Plugin 1')).toBeInTheDocument();
|
||||
expect(screen.queryByText('Google')).not.toBeInTheDocument();
|
||||
expect(screen.queryByText('Wolfram')).not.toBeInTheDocument();
|
||||
});
|
||||
|
|
@ -1,60 +0,0 @@
|
|||
import 'test/matchMedia.mock';
|
||||
import { render, screen } from 'test/layout-test-utils';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { TPlugin } from 'librechat-data-provider';
|
||||
import PluginStoreItem from '../PluginStoreItem';
|
||||
|
||||
const mockPlugin = {
|
||||
name: 'Test Plugin',
|
||||
description: 'This is a test plugin',
|
||||
icon: 'test-icon.png',
|
||||
};
|
||||
|
||||
describe('PluginStoreItem', () => {
|
||||
it('renders the plugin name and description', () => {
|
||||
render(
|
||||
<PluginStoreItem
|
||||
plugin={mockPlugin as TPlugin}
|
||||
onInstall={() => {
|
||||
return;
|
||||
}}
|
||||
onUninstall={() => {
|
||||
return;
|
||||
}}
|
||||
/>,
|
||||
);
|
||||
expect(screen.getByText('Test Plugin')).toBeInTheDocument();
|
||||
expect(screen.getByText('This is a test plugin')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('calls onInstall when the install button is clicked', async () => {
|
||||
const onInstall = jest.fn();
|
||||
render(
|
||||
<PluginStoreItem
|
||||
plugin={mockPlugin as TPlugin}
|
||||
onInstall={onInstall}
|
||||
onUninstall={() => {
|
||||
return;
|
||||
}}
|
||||
/>,
|
||||
);
|
||||
await userEvent.click(screen.getByText('Install'));
|
||||
expect(onInstall).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('calls onUninstall when the uninstall button is clicked', async () => {
|
||||
const onUninstall = jest.fn();
|
||||
render(
|
||||
<PluginStoreItem
|
||||
plugin={mockPlugin as TPlugin}
|
||||
onInstall={() => {
|
||||
return;
|
||||
}}
|
||||
onUninstall={onUninstall}
|
||||
isInstalled
|
||||
/>,
|
||||
);
|
||||
await userEvent.click(screen.getByText('Uninstall'));
|
||||
expect(onUninstall).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,6 +1,3 @@
|
|||
export { default as PluginStoreDialog } from './PluginStoreDialog';
|
||||
export { default as PluginStoreItem } from './PluginStoreItem';
|
||||
export { default as PluginPagination } from './PluginPagination';
|
||||
export { default as PluginStoreLinkButton } from './PluginStoreLinkButton';
|
||||
export { default as PluginAuthForm } from './PluginAuthForm';
|
||||
export { default as PluginTooltip } from './PluginTooltip';
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
a {
|
||||
text-decoration: underline;
|
||||
color: white;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue