snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/hooks/useFileInput.ts

@@ -0,0 +1,44 @@
+import { useSafeRefCallback } from '@rocket.chat/fuselage-hooks';
+import { useRef, useCallback, useEffect } from 'react';
+import type { AllHTMLAttributes } from 'react';
+
+import { useChat } from '../views/room/contexts/ChatContext';
+
+export const useFileInput = (props: AllHTMLAttributes<HTMLInputElement>) => {
+	const fileInputRef = useRef<HTMLInputElement>(undefined);
+	const chatContext = useChat();
+
+	const setupFileInput = useSafeRefCallback(
+		useCallback(
+			(composerNode: HTMLElement) => {
+				const fileInput = document.createElement('input');
+				fileInput.setAttribute('style', 'display: none;');
+				Object.entries(props).forEach(([key, value]) => {
+					fileInput.setAttribute(key, value);
+				});
+
+				composerNode.appendChild(fileInput);
+				fileInputRef.current = fileInput;
+
+				return (): void => {
+					fileInputRef.current = undefined;
+					fileInput.remove();
+				};
+			},
+			[props],
+		),
+	);
+
+	useEffect(() => {
+		const { current: composerNode } = chatContext?.composer?.composerRef || {};
+		if (composerNode) {
+			setupFileInput(composerNode);
+		}
+
+		return () => {
+			setupFileInput(null);
+		};
+	}, [setupFileInput]);
+
+	return fileInputRef;
+};