diff --git a/front/components/AssistantBuilderDataSourceModal.tsx b/front/components/AssistantBuilderDataSourceModal.tsx
new file mode 100644
index 0000000000000..6458b393367a5
--- /dev/null
+++ b/front/components/AssistantBuilderDataSourceModal.tsx
@@ -0,0 +1,96 @@
+import { Button, Cog6ToothIcon, XCircleIcon } from "@dust-tt/sparkle";
+import { Dialog, Transition } from "@headlessui/react";
+import { Fragment } from "react";
+
+import { WorkspaceType } from "@app/types/user";
+
+import { PermissionTree } from "./ConnectorPermissionsTree";
+
+export default function AssistantBuilderDataSourceModal({
+ isOpen,
+ setOpen,
+}: // owner,
+{
+ isOpen: boolean;
+ setOpen: (isOpen: boolean) => void;
+ owner: WorkspaceType;
+}) {
+ function closeModal() {
+ // TODO
+ setOpen(false);
+ }
+
+ return (
+
+
+
+ );
+}
diff --git a/front/pages/w/[wId]/builder/assistants/new.tsx b/front/pages/w/[wId]/builder/assistants/new.tsx
index dedada6d293fa..b14a64adb1470 100644
--- a/front/pages/w/[wId]/builder/assistants/new.tsx
+++ b/front/pages/w/[wId]/builder/assistants/new.tsx
@@ -14,6 +14,7 @@ import { GetServerSideProps, InferGetServerSidePropsType } from "next";
import { useRouter } from "next/router";
import { useState } from "react";
+import AssistantBuilderDataSourceModal from "@app/components/AssistantBuilderDataSourceModal";
import AppLayout from "@app/components/sparkle/AppLayout";
import { AppLayoutSimpleCloseTitle } from "@app/components/sparkle/AppLayoutTitle";
import { subNavigationAdmin } from "@app/components/sparkle/navigation";
@@ -73,6 +74,8 @@ export default function CreateAssistant({
const [dataSourceMode, setDataSourceMode] =
useState("GENERIC");
+ const [showDataSourcesModal, setShowDataSourcesModal] = useState(false);
+
return (
}
>
+
}
+ visual={}
/>
{
+ setShowDataSourcesModal(true);
+ }}
/>