diff --git a/src/frontend/src/modals/importModal/buttonBox/index.tsx b/src/frontend/src/modals/importModal/buttonBox/index.tsx
deleted file mode 100644
index 131dcec31..000000000
--- a/src/frontend/src/modals/importModal/buttonBox/index.tsx
+++ /dev/null
@@ -1,101 +0,0 @@
-import { buttonBoxPropsType } from "../../../types/components";
-import { classNames } from "../../../utils/utils";
-
-export default function ButtonBox({
-  onClick,
-  title,
-  description,
-  icon,
-  bgColor,
-  textColor,
-  deactivate,
-  size,
-}: buttonBoxPropsType): JSX.Element {
-  let bigCircle: string;
-  let smallCircle: string;
-  let titleFontSize: string;
-  let descriptionFontSize: string;
-  let padding: string;
-  let marginTop: string;
-  let height: string;
-  let width: string;
-  let textHeight: number;
-  let textWidth: number;
-  switch (size) {
-    case "small":
-      bigCircle = "h-12 w-12";
-      smallCircle = "h-8 w-8";
-      titleFontSize = "text-sm";
-      descriptionFontSize = "text-xs";
-      padding = "p-2 py-3";
-      marginTop = "mt-2";
-      height = "h-36";
-      width = "w-32";
-      break;
-    case "medium":
-      bigCircle = "h-16 w-16";
-      smallCircle = "h-12 w-12";
-      titleFontSize = "text-base";
-      descriptionFontSize = "text-sm";
-      padding = "p-4 py-5";
-      marginTop = "mt-3";
-      height = "h-44";
-      width = "w-36";
-      break;
-    case "big":
-      bigCircle = "h-20 w-20";
-      smallCircle = "h-16 w-16";
-      titleFontSize = "text-lg";
-      descriptionFontSize = "text-sm";
-      padding = "p-8 py-10";
-      marginTop = "mt-6";
-      height = "h-56";
-      width = "w-44";
-      break;
-    default:
-      bigCircle = "h-20 w-20";
-      smallCircle = "h-16 w-16";
-      titleFontSize = "text-lg";
-      descriptionFontSize = "text-sm";
-      padding = "p-8 py-10";
-      marginTop = "mt-6";
-      height = "h-56";
-      width = "w-44";
-      break;
-  }
-
-  return (
-    <button disabled={deactivate} onClick={onClick}>
-      <div
-        className={classNames(
-          "button-box-modal-div",
-          bgColor,
-          height,
-          width,
-          padding
-        )}
-      >
-        <div
-          className={`flex items-center justify-center ${bigCircle} mb-1 rounded-full bg-background/30`}
-        >
-          <div
-            className={`flex items-center justify-center ${smallCircle} rounded-full bg-background`}
-          >
-            <div className={textColor}>{icon}</div>
-          </div>
-        </div>
-        <div className="mb-auto mt-auto w-full">
-          <h3
-            className={classNames(
-              "w-full font-semibold text-background truncate-multiline word-break-break-word",
-              titleFontSize,
-              marginTop
-            )}
-          >
-            {title}
-          </h3>
-        </div>
-      </div>
-    </button>
-  );
-}
diff --git a/src/frontend/src/modals/importModal/index.tsx b/src/frontend/src/modals/importModal/index.tsx
deleted file mode 100644
index 6557783c4..000000000
--- a/src/frontend/src/modals/importModal/index.tsx
+++ /dev/null
@@ -1,190 +0,0 @@
-import {
-  ArrowLeftIcon,
-  ArrowUpTrayIcon,
-  ComputerDesktopIcon,
-  DocumentDuplicateIcon,
-} from "@heroicons/react/24/outline";
-import { useContext, useRef, useState } from "react";
-import LoadingComponent from "../../components/loadingComponent";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
-import { IMPORT_DIALOG_SUBTITLE } from "../../constants/constants";
-import { alertContext } from "../../contexts/alertContext";
-import { TabsContext } from "../../contexts/tabsContext";
-import { getExamples } from "../../controllers/API";
-import { FlowType } from "../../types/flow";
-import { classNames } from "../../utils/utils";
-import ButtonBox from "./buttonBox";
-
-export default function ImportModal(): JSX.Element {
-  const [open, setOpen] = useState(true);
-  const { setErrorData } = useContext(alertContext);
-  const ref = useRef();
-  const [showExamples, setShowExamples] = useState(false);
-  const [loadingExamples, setLoadingExamples] = useState(false);
-  const [examples, setExamples] = useState<FlowType[]>([]);
-  const { uploadFlow, addFlow } = useContext(TabsContext);
-
-  function handleExamples(): void {
-    setLoadingExamples(true);
-    getExamples()
-      .then((result) => {
-        setLoadingExamples(false);
-        setExamples(result);
-      })
-      .catch((error) =>
-        setErrorData({
-          title: "there was an error loading examples, please try again",
-          list: [error.message],
-        })
-      );
-  }
-
-  const [modalOpen, setModalOpen] = useState(false);
-
-  return (
-    <Dialog open={modalOpen} onOpenChange={setModalOpen}>
-      <DialogTrigger></DialogTrigger>
-      <DialogContent
-        className={classNames(
-          showExamples
-            ? "h-[600px] lg:max-w-[650px]"
-            : "h-[450px] lg:max-w-[650px]"
-        )}
-      >
-        <DialogHeader>
-          <DialogTitle className="flex items-center">
-            {showExamples && (
-              <>
-                <div className="dialog-header-modal-div">
-                  <button
-                    type="button"
-                    className="dialog-header-modal-button disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
-                    onClick={() => {
-                      setShowExamples(false);
-                    }}
-                  >
-                    <ArrowLeftIcon
-                      className="ml-1 h-5 w-5 text-foreground"
-                      aria-hidden="true"
-                    />
-                  </button>
-                </div>
-              </>
-            )}
-
-            <span className={classNames(showExamples ? "pl-8 pr-2" : "pr-2")}>
-              {showExamples ? "Select an example" : "Import"}
-            </span>
-            <ArrowUpTrayIcon
-              className="ml-1 h-5 w-5 text-foreground"
-              aria-hidden="true"
-            />
-          </DialogTitle>
-          <DialogDescription>{IMPORT_DIALOG_SUBTITLE}</DialogDescription>
-        </DialogHeader>
-
-        <div
-          className={classNames(
-            "dialog-modal-examples-div",
-            showExamples && !loadingExamples
-              ? "dialog-modal-example-true"
-              : "dialog-modal-example-false"
-          )}
-        >
-          {!showExamples && (
-            <div className="dialog-modal-button-box-div">
-              <ButtonBox
-                size="big"
-                bgColor="bg-medium-emerald "
-                description="Prebuilt Examples"
-                icon={<DocumentDuplicateIcon className="document-icon" />}
-                onClick={() => {
-                  setShowExamples(true);
-                  handleExamples();
-                }}
-                textColor="text-medium-emerald "
-                title="Examples"
-              ></ButtonBox>
-              <ButtonBox
-                size="big"
-                bgColor="bg-almost-dark-blue "
-                description="Import from Local"
-                icon={<ComputerDesktopIcon className="document-icon" />}
-                onClick={() => {
-                  uploadFlow();
-                  setModalOpen(false);
-                }}
-                textColor="text-almost-dark-blue "
-                title="Local File"
-              ></ButtonBox>
-            </div>
-          )}
-          {showExamples && loadingExamples && (
-            <div className="loading-component-div">
-              <LoadingComponent remSize={30} />
-            </div>
-          )}
-          {showExamples &&
-            !loadingExamples &&
-            examples.map((example, index) => {
-              return (
-                <div key={example.name} className="m-2">
-                  {" "}
-                  <ButtonBox
-                    size="small"
-                    bgColor="bg-medium-emerald "
-                    description={example.description ?? "Prebuilt Examples"}
-                    icon={
-                      <DocumentDuplicateIcon
-                        strokeWidth={1.5}
-                        className="h-6 w-6 flex-shrink-0"
-                      />
-                    }
-                    onClick={() => {
-                      addFlow(example, false);
-                      setModalOpen(false);
-                    }}
-                    textColor="text-medium-emerald "
-                    title={example.name}
-                  ></ButtonBox>
-                </div>
-              );
-            })}
-        </div>
-
-        <DialogFooter>
-          <div className="dialog-modal-footer">
-            <a
-              href="https://github.com/logspace-ai/langflow_examples"
-              target="_blank"
-              className="dialog-modal-footer-link "
-              rel="noreferrer"
-            >
-              <svg
-                width="24"
-                viewBox="0 0 98 96"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  fill-rule="evenodd"
-                  clip-rule="evenodd"
-                  d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"
-                  fill="currentColor"
-                />
-              </svg>
-              <span className="ml-2 ">Langflow Examples</span>
-            </a>
-          </div>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
diff --git a/src/frontend/src/pages/MainPage/index.tsx b/src/frontend/src/pages/MainPage/index.tsx
index 9582d4c57..92be2525a 100644
--- a/src/frontend/src/pages/MainPage/index.tsx
+++ b/src/frontend/src/pages/MainPage/index.tsx
@@ -71,7 +71,7 @@ export default function HomePage(): JSX.Element {
             <DropdownButton
               firstButtonName="New Project"
               onFirstBtnClick={() => {
-                addFlow(null!, true).then((id) => {
+                addFlow(undefined, true).then((id) => {
                   navigate("/flow/" + id);
                 });
               }}