diff --git a/packages/builder/src/pages/builder/portal/manage/users/_components/AddUserModal.svelte b/packages/builder/src/pages/builder/portal/manage/users/_components/AddUserModal.svelte
index 177a7ff810..415c1cde82 100644
--- a/packages/builder/src/pages/builder/portal/manage/users/_components/AddUserModal.svelte
+++ b/packages/builder/src/pages/builder/portal/manage/users/_components/AddUserModal.svelte
@@ -1,22 +1,30 @@
 <script>
   import { Body, Input, Select, ModalContent } from "@budibase/bbui"
   import { createValidationStore, emailValidator } from "helpers/validation"
+  import { users } from "stores/portal"
 
-  export let options
-  export let selected
-  export let onConfirm
   export let disabled
 
-  const [email, emailError] = createValidationStore("", emailValidator)
+  const options = ["Email onboarding", "Basic onboarding"]
+  let selected = options[0]
+
+  const [email, error, touched] = createValidationStore("", emailValidator)
+
+  async function createUserFlow() {
+    const response = await users.invite(email)
+    console.log(response)
+    notifications.success("Email sent.")
+  }
 </script>
 
 <ModalContent
-  {onConfirm}
+  onConfirm={createUserFlow}
   size="M"
   title="Add new user options"
   confirmText="Add user"
   confirmDisabled={disabled}
   cancelText="Cancel"
+  disabled={!$touched && !$error}
   showCloseIcon={false}
 >
   <Body noPadding
@@ -27,13 +35,14 @@
   <Select
     placeholder={null}
     bind:value={selected}
+    on:change
     {options}
     label="Add new user via:"
   />
   <Input
     type="email"
     bind:value={$email}
-    error={$emailError}
+    error={$touched && $error}
     placeholder="john@doe.com"
     label="Email"
   />
diff --git a/packages/builder/src/pages/builder/portal/manage/users/index.svelte b/packages/builder/src/pages/builder/portal/manage/users/index.svelte
index 25836260d6..868c455a67 100644
--- a/packages/builder/src/pages/builder/portal/manage/users/index.svelte
+++ b/packages/builder/src/pages/builder/portal/manage/users/index.svelte
@@ -11,7 +11,6 @@
     Label,
     Layout,
     Modal,
-    notifications,
   } from "@budibase/bbui"
   import AddUserModal from "./_components/AddUserModal.svelte"
   import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte"
@@ -26,8 +25,6 @@
     // group: {}
   }
 
-  let onboardingOptions = ["Email onboarding", "Basic onboarding"]
-  let selectedOnboardingOption = onboardingOptions[0]
   let search
   let email
   $: filteredUsers = $users.filter(user => user.email.includes(search || ""))
@@ -35,13 +32,9 @@
   let createUserModal
   let basicOnboardingModal
 
-  function createUserFlow() {
-    if (selectedOnboardingOption === onboardingOptions[0]) {
-      notifications.success("Email sent.")
-    } else {
-      createUserModal.hide()
-      basicOnboardingModal.show()
-    }
+  function openBasicOnoboardingModal() {
+    createUserModal.hide()
+    basicOnboardingModal.show()
   }
 </script>
 
@@ -80,13 +73,7 @@
 </Layout>
 
 <Modal bind:this={createUserModal}
-  ><AddUserModal
-    options={onboardingOptions}
-    onConfirm={createUserFlow}
-    disabled={!email}
-    bind:selected={selectedOnboardingOption}
-    bind:email
-  /></Modal
+  ><AddUserModal on:change={openBasicOnoboardingModal} /></Modal
 >
 <Modal bind:this={basicOnboardingModal}><BasicOnboardingModal {email} /></Modal>
 
