diff --git a/src/frontend/src/components/IOInputField/index.tsx b/src/frontend/src/components/IOInputField/index.tsx
index 774e45427..55e68231e 100644
--- a/src/frontend/src/components/IOInputField/index.tsx
+++ b/src/frontend/src/components/IOInputField/index.tsx
@@ -1,4 +1,5 @@
 import { IOInputProps } from "../../types/components";
+import IOFileInput from "../IOInputs/FileInput";
 import { Textarea } from "../ui/textarea";
 
 export default function IOInputField({
@@ -18,7 +19,7 @@ export default function IOInputField({
           />
         );
       case "fileInput":
-        return <div></div>;
+        return <IOFileInput field={field} updateValue={updateValue} />;
 
       default:
         return (
diff --git a/src/frontend/src/components/IOInputs/FileInput/index.tsx b/src/frontend/src/components/IOInputs/FileInput/index.tsx
new file mode 100644
index 000000000..5bfbd1eca
--- /dev/null
+++ b/src/frontend/src/components/IOInputs/FileInput/index.tsx
@@ -0,0 +1,7 @@
+import { IOFileInputProps } from "../../../types/components";
+
+export default function IOFileInput({ field, updateValue }: IOFileInputProps) {
+  //component to handle file upload from chatIO
+  function handleCLick() {}
+  return <div></div>;
+}
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts
index 7c610565a..1181b0afc 100644
--- a/src/frontend/src/types/components/index.ts
+++ b/src/frontend/src/types/components/index.ts
@@ -116,6 +116,7 @@ export type CodeAreaComponentType = {
 };
 
 export type FileComponentType = {
+  IOInputProps;
   disabled: boolean;
   onChange: (value: string[] | string) => void;
   value: string;
@@ -651,3 +652,8 @@ export type IOInputProps = {
   field: TemplateVariableType;
   updateValue: (e: any) => void;
 };
+
+export type IOFileInputProps = {
+  field: TemplateVariableType;
+  updateValue: (e: any) => void;
+};