diff --git a/src/frontend/src/customization/components/custom-chat-input.tsx b/src/frontend/src/customization/components/custom-chat-input.tsx
new file mode 100644
index 000000000..ce415a4af
--- /dev/null
+++ b/src/frontend/src/customization/components/custom-chat-input.tsx
@@ -0,0 +1,26 @@
+import ChatInput from "@/modals/IOModal/components/chatView/chatInput/chat-input";
+import { ChatInputType } from "@/types/components";
+
+export const CustomChatInput = ({
+ sendMessage,
+ inputRef,
+ noInput,
+ files,
+ setFiles,
+ isDragging,
+ playgroundPage,
+}: ChatInputType) => {
+ return (
+
+ );
+};
+
+export default CustomChatInput;
diff --git a/src/frontend/src/customization/hooks/use-custom-post-upload-file.ts b/src/frontend/src/customization/hooks/use-custom-post-upload-file.ts
new file mode 100644
index 000000000..8a6c70ab3
--- /dev/null
+++ b/src/frontend/src/customization/hooks/use-custom-post-upload-file.ts
@@ -0,0 +1,13 @@
+import { usePostUploadFileV2 } from "@/controllers/API/queries/file-management";
+import { useMutationFunctionType } from "@/types/api";
+
+interface IPostUploadFile {
+ file: File;
+}
+
+export const customPostUploadFileV2: useMutationFunctionType<
+ undefined,
+ IPostUploadFile
+> = (options?) => {
+ return usePostUploadFileV2(options);
+};
diff --git a/src/frontend/src/customization/hooks/use-custom-use-file-handler.ts b/src/frontend/src/customization/hooks/use-custom-use-file-handler.ts
new file mode 100644
index 000000000..124671bf0
--- /dev/null
+++ b/src/frontend/src/customization/hooks/use-custom-use-file-handler.ts
@@ -0,0 +1,7 @@
+import { useFileHandler } from "@/modals/IOModal/components/chatView/chatInput/hooks/use-file-handler";
+
+export const customUseFileHandler = (currentFlowId: string) => {
+ return useFileHandler(currentFlowId);
+};
+
+export default customUseFileHandler;
diff --git a/src/frontend/src/hooks/files/use-upload-file.ts b/src/frontend/src/hooks/files/use-upload-file.ts
index b347832c8..a574460bf 100644
--- a/src/frontend/src/hooks/files/use-upload-file.ts
+++ b/src/frontend/src/hooks/files/use-upload-file.ts
@@ -1,4 +1,4 @@
-import { usePostUploadFileV2 } from "@/controllers/API/queries/file-management/use-post-upload-file";
+import { customPostUploadFileV2 } from "@/customization/hooks/use-custom-post-upload-file";
import { createFileUpload } from "@/helpers/create-file-upload";
import useFileSizeValidator from "@/shared/hooks/use-file-size-validator";
@@ -9,7 +9,7 @@ const useUploadFile = ({
types?: string[];
multiple?: boolean;
}) => {
- const { mutateAsync: uploadFileMutation } = usePostUploadFileV2();
+ const { mutateAsync: uploadFileMutation } = customPostUploadFileV2();
const { validateFileSize } = useFileSizeValidator();
const getFilesToUpload = async ({
diff --git a/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx b/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx
index 7ab4faeb3..da13bbe2b 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx
@@ -1,5 +1,6 @@
import LangflowLogo from "@/assets/LangflowLogo.svg?react";
import { TextEffectPerChar } from "@/components/ui/textAnimation";
+import CustomChatInput from "@/customization/components/custom-chat-input";
import { ENABLE_IMAGE_ON_PLAYGROUND } from "@/customization/feature-flags";
import { track } from "@/customization/utils/analytics";
import { useMessagesStore } from "@/stores/messagesStore";
@@ -18,7 +19,6 @@ import useFlowStore from "../../../../../stores/flowStore";
import { ChatMessageType } from "../../../../../types/chat";
import { chatViewProps } from "../../../../../types/components";
import FlowRunningSqueleton from "../../flow-running-squeleton";
-import ChatInput from "../chatInput/chat-input";
import useDragAndDrop from "../chatInput/hooks/use-drag-and-drop";
import { useFileHandler } from "../chatInput/hooks/use-file-handler";
import ChatMessage from "../chatMessage/chat-message";
@@ -287,7 +287,7 @@ export default function ChatView({
- {
diff --git a/src/frontend/src/modals/fileManagerModal/components/filesRendererComponent/components/fileRendererComponent/index.tsx b/src/frontend/src/modals/fileManagerModal/components/filesRendererComponent/components/fileRendererComponent/index.tsx
index cf14d1d98..208c65e9c 100644
--- a/src/frontend/src/modals/fileManagerModal/components/filesRendererComponent/components/fileRendererComponent/index.tsx
+++ b/src/frontend/src/modals/fileManagerModal/components/filesRendererComponent/components/fileRendererComponent/index.tsx
@@ -3,7 +3,7 @@ import ShadTooltip from "@/components/common/shadTooltipComponent";
import { Button } from "@/components/ui/button";
import { Checkbox } from "@/components/ui/checkbox";
import { Input } from "@/components/ui/input";
-import { usePostUploadFileV2 } from "@/controllers/API/queries/file-management";
+import { customPostUploadFileV2 } from "@/customization/hooks/use-custom-post-upload-file";
import { FileType } from "@/types/file_management";
import { formatFileSize } from "@/utils/stringManipulation";
import { FILE_ICONS } from "@/utils/styleUtils";
@@ -37,7 +37,7 @@ export default function FileRendererComponent({
handleRename && setOpenRename(true);
};
- const { mutate: uploadFile } = usePostUploadFileV2();
+ const { mutate: uploadFile } = customPostUploadFileV2();
useEffect(() => {
setNewName(file.name);
diff --git a/src/frontend/src/pages/MainPage/pages/filesPage/index.tsx b/src/frontend/src/pages/MainPage/pages/filesPage/index.tsx
index e384312d5..1774e45a5 100644
--- a/src/frontend/src/pages/MainPage/pages/filesPage/index.tsx
+++ b/src/frontend/src/pages/MainPage/pages/filesPage/index.tsx
@@ -6,14 +6,11 @@ import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import Loading from "@/components/ui/loading";
import { SidebarTrigger } from "@/components/ui/sidebar";
-import {
- useGetDownloadFileV2,
- useGetFilesV2,
- usePostUploadFileV2,
-} from "@/controllers/API/queries/file-management";
+import { useGetFilesV2 } from "@/controllers/API/queries/file-management";
import { useDeleteFilesV2 } from "@/controllers/API/queries/file-management/use-delete-files";
import { useGetDownloadFilesV2 } from "@/controllers/API/queries/file-management/use-get-download-files";
import { usePostRenameFileV2 } from "@/controllers/API/queries/file-management/use-put-rename-file";
+import { customPostUploadFileV2 } from "@/customization/hooks/use-custom-post-upload-file";
import useUploadFile from "@/hooks/files/use-upload-file";
import DeleteConfirmationModal from "@/modals/deleteConfirmationModal";
import FilesContextMenuComponent from "@/modals/fileManagerModal/components/filesContextMenuComponent";
@@ -115,7 +112,7 @@ export const FilesPage = () => {
}
};
- const { mutate: uploadFileDirect } = usePostUploadFileV2();
+ const { mutate: uploadFileDirect } = customPostUploadFileV2();
const colDefs: ColDef[] = [
{