mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-17 00:40:14 +01:00
* 🎨 feat: Enhance Import Conversations UI with loading state and new localization key * fix: Correct pluralization in selected items message in translation.json * Refactor Chat Input File Table Headers to Use SortFilterHeader Component - Replaced button-based sorting headers in the Chat Input Files Table with a new SortFilterHeader component for better code organization and consistency. - Updated the header for filename, updatedAt, and bytes columns to utilize the new component. Enhance Navigation Component with Skeleton Loading States - Added Skeleton loading states to the Nav component for better user experience during data fetching. - Updated Suspense fallbacks for AgentMarketplaceButton and BookmarkNav components to display Skeletons. Refactor Avatar Component for Improved UI - Enhanced the Avatar component by adding a Label for drag-and-drop functionality. - Improved styling and structure for the file upload area. Update Shared Links Component for Better Error Handling and Sorting - Improved error handling in the Shared Links component for fetching next pages and deleting shared links. - Simplified the header rendering for sorting columns and added sorting functionality to the title and createdAt columns. Refactor Archived Chats Component - Merged ArchivedChats and ArchivedChatsTable components into a single ArchivedChats component for better maintainability. - Implemented sorting and searching functionality with debouncing for improved performance. - Enhanced the UI with better loading states and error handling. Update DataTable Component for Sorting Icons - Added sorting icons (ChevronUp, ChevronDown, ChevronsUpDown) to the DataTable headers for better visual feedback on sorting state. Localization Updates - Updated translation.json to fix missing translations and improve existing ones for better user experience. * ✨ feat: Update DataTable component to streamline props and enhance sorting icons * fix: TS issues * feat: polish and redefine DataTable + shared links and archived chats * feat: enhance DataTable with column pinning and improve sorting functionality * feat: enhance deepEqual function for array support and improve column style stability * refactor: DataTable and ArchivedChats; fix: sorting ArchivedChats API * feat(DataTable): Implement new DataTable component with hooks and optimized features - Added DataTable component with support for virtual scrolling, row selection, and customizable columns. - Introduced hooks for debouncing search input, managing row selection, and calculating column styles. - Enhanced accessibility with keyboard navigation and selection checkboxes. - Implemented skeleton loading state for better user experience during data fetching. - Added DataTableSearch component for filtering data with debounced input. - Created utility logger for improved debugging in development. - Updated translations to support new UI elements and actions. * refactor: update SharedLinks and ArchivedChats to use desktopOnly instead of hideOnMobile; remove unused DataTableColumnHeader component * fix: ensure desktopOnly columns are hidden on mobile in DataTable * refactor: reorganize imports in DataTable components and update index exports * refactor: improve styling and animations in Artifacts, ArtifactsSubMenu, and MCPSubMenu components; update border-radius in style.css * refactor(Artifacts): enhance button toggle functionality and manage expanded state with useEffect * refactor: comment out desktopOnly property in SharedLinks and ArchivedChats components; update translation.json with new keys for link actions * refactor(DataTable): streamline column visibility logic and enhance type definitions; improve cleanup timers and optimize rendering * refactor(DataTable): enhance type definitions for processed data rows and update custom actions renderer type * refactor(DataTable): optimize processed data handling and improve warning for missing IDs; streamline DataTableComponents imports * refactor(DataTable): enhance accessibility features and improve localization for selection and loading states * refactor: improve padding in dialog content and enhance row selection functionality in ArchivedChats and DataTable components * refactor(DataTable): remove unnecessary role and tabindex attributes from select all button for improved accessibility * refactor(translation): remove outdated error messages and unused UI strings for cleaner localization * refactor(DataTable): enhance virtualization and scrolling performance with dynamic overscan adjustments * refactor(DataTableErrorBoundary): enhance error handling and localization support * refactor(DataTable): improve column sizing and visibility handling; remove deprecated features * refactor: enhance UI components with improved class handling and state management * refactor(DataTable): improve column width handling and responsiveness; disable row selection * refactor(DataTable): enhance accessibility with row header support and improve column visibility handling * chore(DataTable): comments update * refactor(Table): add unwrapped prop for direct table rendering; adjust minWidth calculation for responsiveness * refactor(DataTable): simplify search handling by removing unnecessary trimming; adjust column width handling for better responsiveness * refactor(translation): remove redundant drag and drop UI text for clarity * refactor(parsers): change uiResources to a constant and streamline artifacts handling * chore: remove unused file, bump @librechat/client to 0.3.2; fix(SharedLinks): missing import; * refactor: change button variant from destructive to ghost for delete actions in SharedLinks and ArchivedChats components * refactor(DataTable): simplify aria-sort assignment for better readability * refactor(DataTable): update aria-label and ariaLabel to use indexed placeholder for localization * refactor(translation): update no data messages for consistency * Refactor code structure for improved readability and maintainability * chore: restore linting fixes * chore: restore linting fixes 2; refactor: remove unused translation keys * feat(tests): add unit tests for DataTable components and error handling - Implement tests for SelectionCheckbox and SkeletonRows components in DataTable. - Add tests for DataTableErrorBoundary to ensure proper error handling and UI rendering. - Create tests for DataTableSearch to validate search functionality and accessibility. - Update DialogTemplate tests to reflect hardcoded cancel text. - Remove redundant IntersectionObserver mock in SplitText tests. - Unmock react-i18next in Translation tests to validate actual i18n functionality. * refactor: Remove jest-environment-jsdom dependency from package.json; fix: reset package-lock * chore: revert lint fixes * chore: clean up package.json by removing unused devDependencies and redundant test scripts * chore: update package dependencies in package.json and package-lock.json - Added new devDependencies: @babel/core, @babel/preset-env, @babel/preset-react, @babel/preset-typescript, @tanstack/react-table, @tanstack/react-virtual, @testing-library/jest-dom, identity-obj-proxy, jest, jest-environment-jsdom, and lucide-react. - Updated existing devDependencies to their latest versions. - Added new module @asamuzakjp/css-color to package-lock.json with its dependencies. - Updated version of @babel/plugin-transform-destructuring and added @babel/plugin-transform-explicit-resource-management in package-lock.json. --------- Co-authored-by: Danny Avila <danny@librechat.ai>
159 lines
3.7 KiB
TypeScript
159 lines
3.7 KiB
TypeScript
import '@testing-library/jest-dom';
|
|
|
|
// Mock import.meta.env for Vite compatibility
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
(global as any).importMetaEnv = {
|
|
MODE: 'test',
|
|
DEV: true,
|
|
PROD: false,
|
|
};
|
|
|
|
Object.defineProperty(globalThis, 'import', {
|
|
value: {
|
|
meta: {
|
|
env: {
|
|
MODE: 'test',
|
|
DEV: true,
|
|
PROD: false,
|
|
},
|
|
},
|
|
},
|
|
});
|
|
|
|
// Mock @dicebear modules (ESM-only modules)
|
|
jest.mock('@dicebear/core', () => ({
|
|
createAvatar: jest.fn(() => ({
|
|
toDataUri: jest.fn(() => 'data:image/svg+xml;base64,mock'),
|
|
})),
|
|
}));
|
|
|
|
jest.mock('@dicebear/collection', () => ({
|
|
initials: {},
|
|
}));
|
|
|
|
// Mock window.matchMedia
|
|
Object.defineProperty(window, 'matchMedia', {
|
|
writable: true,
|
|
value: jest.fn().mockImplementation((query: string) => ({
|
|
matches: false,
|
|
media: query,
|
|
onchange: null,
|
|
addListener: jest.fn(),
|
|
removeListener: jest.fn(),
|
|
addEventListener: jest.fn(),
|
|
removeEventListener: jest.fn(),
|
|
dispatchEvent: jest.fn(),
|
|
})),
|
|
});
|
|
|
|
// Mock ResizeObserver
|
|
class MockResizeObserver {
|
|
callback: ResizeObserverCallback;
|
|
|
|
constructor(callback: ResizeObserverCallback) {
|
|
this.callback = callback;
|
|
}
|
|
|
|
observe = jest.fn();
|
|
unobserve = jest.fn();
|
|
disconnect = jest.fn();
|
|
}
|
|
|
|
Object.defineProperty(window, 'ResizeObserver', {
|
|
writable: true,
|
|
value: MockResizeObserver,
|
|
});
|
|
|
|
// Mock IntersectionObserver
|
|
class MockIntersectionObserver {
|
|
callback: IntersectionObserverCallback;
|
|
options?: IntersectionObserverInit;
|
|
|
|
constructor(callback: IntersectionObserverCallback, options?: IntersectionObserverInit) {
|
|
this.callback = callback;
|
|
this.options = options;
|
|
}
|
|
|
|
observe = jest.fn();
|
|
unobserve = jest.fn();
|
|
disconnect = jest.fn();
|
|
takeRecords = jest.fn().mockReturnValue([]);
|
|
root = null;
|
|
rootMargin = '';
|
|
thresholds = [0];
|
|
}
|
|
|
|
Object.defineProperty(window, 'IntersectionObserver', {
|
|
writable: true,
|
|
value: MockIntersectionObserver,
|
|
});
|
|
|
|
// Mock scrollTo
|
|
Object.defineProperty(window, 'scrollTo', {
|
|
writable: true,
|
|
value: jest.fn(),
|
|
});
|
|
|
|
// Mock requestAnimationFrame and cancelAnimationFrame
|
|
let rafId = 0;
|
|
Object.defineProperty(window, 'requestAnimationFrame', {
|
|
writable: true,
|
|
value: jest.fn((callback: FrameRequestCallback) => {
|
|
rafId += 1;
|
|
setTimeout(() => callback(performance.now()), 0);
|
|
return rafId;
|
|
}),
|
|
});
|
|
|
|
Object.defineProperty(window, 'cancelAnimationFrame', {
|
|
writable: true,
|
|
value: jest.fn(),
|
|
});
|
|
|
|
// Mock react-i18next
|
|
jest.mock('react-i18next', () => ({
|
|
useTranslation: () => ({
|
|
t: (key: string, options?: Record<string, unknown>) => {
|
|
if (options && typeof options === 'object') {
|
|
let result = key;
|
|
Object.entries(options).forEach(([k, v]) => {
|
|
result = result.replace(`{{${k}}}`, String(v));
|
|
result = result.replace(`{${k}}`, String(v));
|
|
});
|
|
return result;
|
|
}
|
|
return key;
|
|
},
|
|
i18n: {
|
|
changeLanguage: jest.fn(),
|
|
language: 'en',
|
|
},
|
|
}),
|
|
Trans: ({ children }: { children: React.ReactNode }) => children,
|
|
initReactI18next: {
|
|
type: '3rdParty',
|
|
init: jest.fn(),
|
|
},
|
|
}));
|
|
|
|
// Mock useLocalize hook
|
|
jest.mock('~/hooks', () => ({
|
|
...jest.requireActual('~/hooks'),
|
|
useLocalize: () => (key: string, options?: Record<string, unknown>) => {
|
|
if (options && typeof options === 'object') {
|
|
let result = key;
|
|
Object.entries(options).forEach(([k, v]) => {
|
|
result = result.replace(`{{${k}}}`, String(v));
|
|
result = result.replace(`{${k}}`, String(v));
|
|
});
|
|
return result;
|
|
}
|
|
return key;
|
|
},
|
|
useMediaQuery: jest.fn(() => false),
|
|
}));
|
|
|
|
// Clear mocks before each test
|
|
beforeEach(() => {
|
|
jest.clearAllMocks();
|
|
});
|