[FIX] File upload (Avatars, Emoji, Sounds) (#18841)

client/contexts/ServerContext.ts

@@ -10,7 +10,7 @@ type ServerContextValue = {
 	absoluteUrl: (path: string) => string;
 	callMethod: (methodName: string, ...args: any[]) => Promise<any>;
 	callEndpoint: (httpMethod: 'GET' | 'POST' | 'DELETE', endpoint: string, ...args: any[]) => Promise<any>;
-	uploadToEndpoint: (endpoint: string) => Promise<void>;
+	uploadToEndpoint: (endpoint: string, params: any, formData: any) => Promise<void>;
 	getStream: (streamName: string, options?: {}) => IServerStream;
 };
 
@@ -40,9 +40,9 @@ export const useEndpoint = (httpMethod: 'GET' | 'POST' | 'DELETE', endpoint: str
 	return useCallback((...args: any[]) => callEndpoint(httpMethod, endpoint, ...args), [callEndpoint, httpMethod, endpoint]);
 };
 
-export const useUpload = (endpoint: string): () => Promise<void> => {
+export const useUpload = (endpoint: string): (params: any, formData: any) => Promise<void> => {
 	const { uploadToEndpoint } = useContext(ServerContext);
-	return useCallback(() => uploadToEndpoint(endpoint), [endpoint, uploadToEndpoint]);
+	return useCallback((params, formData: any) => uploadToEndpoint(endpoint, params, formData), [endpoint, uploadToEndpoint]);
 };
 
 export const useStream = (streamName: string, options?: {}): IServerStream => {

client/hooks/useFileInput.js

@@ -1,7 +1,7 @@
 import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
 import { useRef, useEffect } from 'react';
 
-export const useFileInput = (onSetFile, fileType = 'image/*') => {
+export const useFileInput = (onSetFile, fileType = 'image/*', fileField = 'image') => {
 	const ref = useRef();
 
 	useEffect(() => {
@@ -14,7 +14,7 @@ export const useFileInput = (onSetFile, fileType = 'image/*') => {
 
 		ref.current = fileInput;
 		const handleFiles = () => {
-			formData.append(fileType, fileInput.files[0]);
+			formData.append(fileField, fileInput.files[0]);
 			onSetFile(fileInput.files[0], formData);
 		};
 		fileInput.addEventListener('change', handleFiles, false);

client/hooks/useUpdateAvatar.js

@@ -17,7 +17,7 @@ export const useUpdateAvatar = (avatarObj, userId) => {
 
 	const saveAvatarQuery = useMemo(() => ({
 		userId,
-		avatarUrl,
+		...avatarUrl && { avatarUrl },
 	}), [avatarUrl, userId]);
 
 	const resetAvatarQuery = useMemo(() => ({