From 9676111f5726287665fa4bf4767fdcc5c06b5d28 Mon Sep 17 00:00:00 2001 From: Alberto Date: Sat, 11 May 2024 09:48:55 +1000 Subject: [PATCH 1/3] Add the ability to enable the shouldCreateUser on passwordless login --- examples/react/src/App.tsx | 15 ++++++++---- examples/react/src/app.css | 23 +++++++++++++++++- package.json | 4 ++-- packages/react/src/components/Auth/Auth.tsx | 1 + .../components/Auth/interfaces/MagicLink.tsx | 24 +++++++++++++++---- 5 files changed, 56 insertions(+), 11 deletions(-) diff --git a/examples/react/src/App.tsx b/examples/react/src/App.tsx index a2de0c55..9b421409 100644 --- a/examples/react/src/App.tsx +++ b/examples/react/src/App.tsx @@ -42,7 +42,9 @@ function App() { const [brandColor, setBrandColor] = useState(colors[0] as string) const [borderRadius, setBorderRadius] = useState(radii[0] as string) const [theme, setTheme] = useState('dark') - const [socialLayout, setSocialLayout] = useState(socialAlignments[1] satisfies SocialLayout) + const [socialLayout, setSocialLayout] = useState( + socialAlignments[1] satisfies SocialLayout + ) const [view, setView] = useState(views[0]) return ( @@ -64,6 +66,7 @@ function App() { diff --git a/examples/react/src/app.css b/examples/react/src/app.css index f99e9573..73e6603e 100644 --- a/examples/react/src/app.css +++ b/examples/react/src/app.css @@ -1,5 +1,5 @@ /* -! tailwindcss v3.2.7 | MIT License | https://tailwindcss.com +! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com */ /* @@ -31,6 +31,7 @@ 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. 5. Use the user's configured `sans` font-feature-settings by default. +6. Use the user's configured `sans` font-variation-settings by default. */ html { @@ -47,6 +48,8 @@ html { /* 4 */ font-feature-settings: normal; /* 5 */ + font-variation-settings: normal; + /* 6 */ } /* @@ -188,6 +191,10 @@ select, textarea { font-family: inherit; /* 1 */ + font-feature-settings: inherit; + /* 1 */ + font-variation-settings: inherit; + /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; @@ -338,6 +345,14 @@ menu { padding: 0; } +/* +Reset default styling for dialogs. +*/ + +dialog { + padding: 0; +} + /* Prevent resizing textareas horizontally by default. */ @@ -433,6 +448,9 @@ video { --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; @@ -480,6 +498,9 @@ video { --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; diff --git a/package.json b/package.json index 97c9052d..a96c3c22 100644 --- a/package.json +++ b/package.json @@ -32,8 +32,8 @@ "npm": ">=9.0.0", "node": ">=18.0.0" }, - "packageManager": "pnpm@8.7.0", + "packageManager": "pnpm@9.1.0", "peerDependencies": { "typescript": "4.4.x || 4.5.x || 4.6.x" } -} \ No newline at end of file +} diff --git a/packages/react/src/components/Auth/Auth.tsx b/packages/react/src/components/Auth/Auth.tsx index e1709699..14abcd1a 100644 --- a/packages/react/src/components/Auth/Auth.tsx +++ b/packages/react/src/components/Auth/Auth.tsx @@ -192,6 +192,7 @@ function Auth({ setAuthView={setAuthView} redirectTo={redirectTo} showLinks={showLinks} + additionalData={additionalData} i18n={i18n} /> diff --git a/packages/react/src/components/Auth/interfaces/MagicLink.tsx b/packages/react/src/components/Auth/interfaces/MagicLink.tsx index a1537a5d..eda8e6d2 100644 --- a/packages/react/src/components/Auth/interfaces/MagicLink.tsx +++ b/packages/react/src/components/Auth/interfaces/MagicLink.tsx @@ -1,4 +1,7 @@ -import { SupabaseClient } from '@supabase/supabase-js' +import { + SignInWithPasswordlessCredentials, + SupabaseClient, +} from '@supabase/supabase-js' import React, { useState } from 'react' import { VIEWS, I18nVariables, RedirectTo, en } from '@supabase/auth-ui-shared' import { Appearance } from '../../../types' @@ -17,6 +20,7 @@ function MagicLink({ redirectTo, i18n, appearance, + additionalData, showLinks = false, }: { setAuthView?: any @@ -24,6 +28,7 @@ function MagicLink({ redirectTo?: RedirectTo i18n?: I18nVariables appearance?: Appearance + additionalData?: { [key: string]: any } showLinks?: boolean }) { const [email, setEmail] = useState('') @@ -42,10 +47,21 @@ function MagicLink({ setLoading(false) return } - const { error } = await supabaseClient.auth.signInWithOtp({ + + //Trying to reuse the "additionalData" object to pass the "shouldCreateUser" option; We destructure in here, therefore we don't repet into the data + const { shouldCreateUser, ...restData } = additionalData || {} + + //We add the shouldCreateUser only when the property is present, ensuring retrocompatibility, and also adding the abiltiy to pass data. + const signInOptions: SignInWithPasswordlessCredentials = { email, - options: { emailRedirectTo: redirectTo }, - }) + options: { + emailRedirectTo: redirectTo, + data: restData, + ...(shouldCreateUser !== undefined && { shouldCreateUser }), + }, + } + + const { error } = await supabaseClient.auth.signInWithOtp(signInOptions) if (error) setError(error.message) else setMessage(i18n?.magic_link?.confirmation_text as string) setLoading(false) From 8148088547cf308bf2881a94106df209f6903076 Mon Sep 17 00:00:00 2001 From: Alberto Date: Sat, 11 May 2024 10:16:01 +1000 Subject: [PATCH 2/3] change set --- .changeset/slow-eels-fry.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/slow-eels-fry.md diff --git a/.changeset/slow-eels-fry.md b/.changeset/slow-eels-fry.md new file mode 100644 index 00000000..fe5d71fc --- /dev/null +++ b/.changeset/slow-eels-fry.md @@ -0,0 +1,5 @@ +--- +'@supabase/auth-ui-react': minor +--- + +Add the ability to createUser on passwordless login From 64f1d6db8bed958cb49df3063cfca33f5fb1217c Mon Sep 17 00:00:00 2001 From: Alberto Date: Sat, 11 May 2024 10:16:37 +1000 Subject: [PATCH 3/3] adding this for my local repo --- .changeset/slow-eels-fry.md | 5 ----- packages/react/CHANGELOG.md | 6 ++++++ packages/react/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/slow-eels-fry.md diff --git a/.changeset/slow-eels-fry.md b/.changeset/slow-eels-fry.md deleted file mode 100644 index fe5d71fc..00000000 --- a/.changeset/slow-eels-fry.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@supabase/auth-ui-react': minor ---- - -Add the ability to createUser on passwordless login diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md index 8da8cf73..21b31649 100644 --- a/packages/react/CHANGELOG.md +++ b/packages/react/CHANGELOG.md @@ -1,5 +1,11 @@ # @supabase/auth-ui-react +## 0.5.0 + +### Minor Changes + +- 81480885: Add the ability to createUser on passwordless login + ## 0.4.7 ### Patch Changes diff --git a/packages/react/package.json b/packages/react/package.json index 3f07c35b..1a86ca0f 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,6 +1,6 @@ { "name": "@supabase/auth-ui-react", - "version": "0.4.7", + "version": "0.5.0", "main": "./dist/index.cjs.js", "module": "./dist/index.es.js", "files": [