fix: check for blank email address on magic links (#221)

* check for blank email address on magic links * Add changeset file to bump the package version --------- Co-authored-by: Andrew Smith <[email protected]>
supabase-community · Sep 17, 2023 · 2b25291 · 2b25291
1 parent 5607ea4
commit 2b25291
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 2 deletions.
diff --git a/.changeset/pretty-pumpkins-admire.md b/.changeset/pretty-pumpkins-admire.md
@@ -0,0 +1,6 @@
+---
+'@supabase/auth-ui-shared': patch
+'@supabase/auth-ui-react': patch
+---
+
+Fix check for blank email address on magic links
diff --git a/packages/react/src/components/Auth/interfaces/MagicLink.tsx b/packages/react/src/components/Auth/interfaces/MagicLink.tsx
@@ -36,6 +36,12 @@ function MagicLink({
     setError('')
     setMessage('')
     setLoading(true)
+
+    if (email.length === 0) {
+      setError(i18n?.magic_link?.empty_email_address as string)
+      setLoading(false)
+      return
+    }
     const { error } = await supabaseClient.auth.signInWithOtp({
       email,
       options: { emailRedirectTo: redirectTo },
@@ -60,9 +66,10 @@ function MagicLink({
             type="email"
             autoFocus
             placeholder={labels?.email_input_placeholder}
-            onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+            onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+              if (setError) setError('')
               setEmail(e.target.value)
-            }
+            }}
             appearance={appearance}
           />
         </div>

diff --git a/packages/shared/src/types.ts b/packages/shared/src/types.ts
@@ -137,6 +137,7 @@ export type I18nVariables = {
     loading_button_label?: string
     link_text?: string
     confirmation_text?: string
+    empty_email_address?: string
   }
   forgotten_password?: {
     email_label?: string