Fixing the naming to clientresize from clientsideresize

client/src/hooks/Files/useClientResize.ts

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

client/src/hooks/Files/useFileHandling.ts

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

client/src/utils/__tests__/imageResize.test.ts

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

client/src/utils/imageResize.ts

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

librechat.example.yaml

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