Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-17 00:40:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Fixing the naming to clientresize from clientsideresize

Browse source
This commit is contained in:
Rakshit Tiwari 2025-06-24 19:33:24 +05:30
parent 0417a38a6e
commit 3fb97b7c4a
5 changed files with 16 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

14
client/src/hooks/Files/useClientSideResize.ts → client/src/hooks/Files/useClientResize.ts
View file

@ -4,7 +4,7 @@ import { useGetFileConfig } from '~/data-provider';
import { import {
resizeImage, resizeImage,
shouldResizeImage, shouldResizeImage,
supportsClientSideResize, supportsClientResize,
type ResizeOptions, type ResizeOptions,
type ResizeResult, type ResizeResult,
} from '~/utils/imageResize'; } from '~/utils/imageResize';
@ -13,14 +13,14 @@ import {
* Hook for client-side image resizing functionality * Hook for client-side image resizing functionality
* Integrates with LibreChat's file configuration system * Integrates with LibreChat's file configuration system
*/ */
export const useClientSideResize = () => { export const useClientResize = () => {
const { data: fileConfig = null } = useGetFileConfig({ const { data: fileConfig = null } = useGetFileConfig({
select: (data) => mergeFileConfig(data), select: (data) => mergeFileConfig(data),
}); });
// Safe access to clientSideImageResize config with fallbacks // Safe access to clientImageResize config with fallbacks
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
const config = (fileConfig as any)?.clientSideImageResize ?? { const config = (fileConfig as any)?.clientImageResize ?? {
enabled: false, enabled: false,
maxWidth: 1900, maxWidth: 1900,
maxHeight: 1900, maxHeight: 1900,
@ -45,7 +45,7 @@ export const useClientSideResize = () => {
} }
// Return original file if browser doesn't support resizing // Return original file if browser doesn't support resizing
if (!supportsClientSideResize()) { if (!supportsClientResize()) {
console.warn('Client-side image resizing not supported in this browser'); console.warn('Client-side image resizing not supported in this browser');
return { file, resized: false }; return { file, resized: false };
} }
@ -75,10 +75,10 @@ export const useClientSideResize = () => {
return { return {
isEnabled, isEnabled,
isSupported: supportsClientSideResize(), isSupported: supportsClientResize(),
config, config,
resizeImageIfNeeded, resizeImageIfNeeded,
}; };
}; };
export default useClientSideResize; export default useClientResize;

4
client/src/hooks/Files/useFileHandling.ts
View file

@ -18,7 +18,7 @@ import useLocalize, { TranslationKeys } from '~/hooks/useLocalize';
import { useChatContext } from '~/Providers/ChatContext'; import { useChatContext } from '~/Providers/ChatContext';
import { useToastContext } from '~/Providers/ToastContext'; import { useToastContext } from '~/Providers/ToastContext';
import { logger, validateFiles } from '~/utils'; import { logger, validateFiles } from '~/utils';
import useClientSideResize from './useClientSideResize'; import useClientResize from './useClientResize';
import { processFileForUpload } from '~/utils/heicConverter'; import { processFileForUpload } from '~/utils/heicConverter';
import { useDelayedUploadToast } from './useDelayedUploadToast'; import { useDelayedUploadToast } from './useDelayedUploadToast';
import useUpdateFiles from './useUpdateFiles'; import useUpdateFiles from './useUpdateFiles';
@ -42,7 +42,7 @@ const useFileHandling = (params?: UseFileHandling) => {
const { addFile, replaceFile, updateFileById, deleteFileById } = useUpdateFiles( const { addFile, replaceFile, updateFileById, deleteFileById } = useUpdateFiles(
params?.fileSetter ?? setFiles, params?.fileSetter ?? setFiles,
); );
const { resizeImageIfNeeded } = useClientSideResize(); const { resizeImageIfNeeded } = useClientResize();
const agent_id = params?.additionalMetadata?.agent_id ?? ''; const agent_id = params?.additionalMetadata?.agent_id ?? '';
const assistant_id = params?.additionalMetadata?.assistant_id ?? ''; const assistant_id = params?.additionalMetadata?.assistant_id ?? '';

8
client/src/utils/__tests__/imageResize.test.ts
View file

@ -2,7 +2,7 @@
* Tests for client-side image resizing utility * Tests for client-side image resizing utility
*/ */
import { shouldResizeImage, supportsClientSideResize } from '../imageResize'; import { shouldResizeImage, supportsClientResize } from '../imageResize';
// Mock browser APIs for testing // Mock browser APIs for testing
Object.defineProperty(global, 'HTMLCanvasElement', { Object.defineProperty(global, 'HTMLCanvasElement', {
@ -34,9 +34,9 @@ Object.defineProperty(global, 'Image', {
}); });
describe('imageResize utility', () => { describe('imageResize utility', () => {
describe('supportsClientSideResize', () => { describe('supportsClientResize', () => {
it('should return true when all required APIs are available', () => { it('should return true when all required APIs are available', () => {
const result = supportsClientSideResize(); const result = supportsClientResize();
expect(result).toBe(true); expect(result).toBe(true);
}); });
@ -45,7 +45,7 @@ describe('imageResize utility', () => {
// @ts-ignore // @ts-ignore
delete global.HTMLCanvasElement; delete global.HTMLCanvasElement;
const result = supportsClientSideResize(); const result = supportsClientResize();
expect(result).toBe(false); expect(result).toBe(false);
global.HTMLCanvasElement = originalCanvas; global.HTMLCanvasElement = originalCanvas;

4
client/src/utils/imageResize.ts
View file

@ -34,7 +34,7 @@ const DEFAULT_RESIZE_OPTIONS: ResizeOptions = {
/** /**
* Checks if the browser supports canvas-based image resizing * Checks if the browser supports canvas-based image resizing
*/ */
export function supportsClientSideResize(): boolean { export function supportsClientResize(): boolean {
try { try {
// Check for required APIs // Check for required APIs
if (typeof HTMLCanvasElement === 'undefined') return false; if (typeof HTMLCanvasElement === 'undefined') return false;
@ -87,7 +87,7 @@ export function resizeImage(
): Promise<ResizeResult> { ): Promise<ResizeResult> {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
// Check browser support // Check browser support
if (!supportsClientSideResize()) { if (!supportsClientResize()) {
reject(new Error('Browser does not support client-side image resizing')); reject(new Error('Browser does not support client-side image resizing'));
return; return;
} }

2
librechat.example.yaml
View file

@ -298,7 +298,7 @@ endpoints:
# percentage: 100 # percentage: 100
# px: 1024 # px: 1024
# # Client-side image resizing to prevent upload errors # # Client-side image resizing to prevent upload errors
# clientSideImageResize: # clientImageResize:
# enabled: false # Enable/disable client-side image resizing (default: false) # enabled: false # Enable/disable client-side image resizing (default: false)
# maxWidth: 1900 # Maximum width for resized images (default: 1900) # maxWidth: 1900 # Maximum width for resized images (default: 1900)
# maxHeight: 1900 # Maximum height for resized images (default: 1900) # maxHeight: 1900 # Maximum height for resized images (default: 1900)