From c254ab8581280b4d7319e6f071fae9ed9d56a98f Mon Sep 17 00:00:00 2001 From: Copple <10214025+kiwicopple@users.noreply.github.com> Date: Mon, 15 Aug 2022 15:51:29 +0200 Subject: [PATCH 01/14] starting to update all examples --- spec/supabase_js_v2_legacy.yml | 58 ++-------------------------------- 1 file changed, 2 insertions(+), 56 deletions(-) diff --git a/spec/supabase_js_v2_legacy.yml b/spec/supabase_js_v2_legacy.yml index 44e9c85b242..66ed513dd30 100644 --- a/spec/supabase_js_v2_legacy.yml +++ b/spec/supabase_js_v2_legacy.yml @@ -79,38 +79,16 @@ pages: auth.signInWithPassword(): title: 'signInWithPassword()' $ref: '@supabase/gotrue-js.GoTrueClient.signInWithPassword' - notes: | - - A user can sign up either via email or OAuth. - - If you provide `email` without a `password`, the user will be sent a magic link. - - The magic link's destination URL is determined by the SITE_URL config variable. To change this, you can go to Authentication -> Settings on [app.supabase.com](https://app.supabase.com) - - Specifying a `provider` will open the browser to the relevant login page. examples: - name: Sign in with email. isSpotlight: true js: | ```js - const { user, session, error } = await supabase.auth.signIn({ + const { user, session, error } = await supabase.auth.signInWithPassword({ email: 'example@email.com', password: 'example-password', }) ``` - - name: Sign in with magic link. - description: If no password is provided, the user will be sent a "magic link" to their email address, which they can click to open your application with a valid session. By default, a given user can only request a Magic Link once every 60 seconds. - js: | - ```js - const { user, session, error } = await supabase.auth.signIn({ - email: 'example@email.com' - }) - ``` - - name: Sign in using third-party providers. - description: Supabase supports many different [third-party providers](https://supabase.com/docs/guides/auth#providers). - js: | - ```js - const { user, session, error } = await supabase.auth.signIn({ - // provider can be 'github', 'google', 'gitlab', and more - provider: 'github' - }) - ``` - name: Sign in with Phone. description: Supabase supports Phone Auth. js: | @@ -129,44 +107,12 @@ pages: any URL path on your website (the URL must either be on the same domain as your Site URL [see Auth>Settings in dashboard], or must match one of the Additional Redirect URLs [also in Auth>Settings]). js: | ```js - const { user, session, error } = await supabase.auth.signIn({ + const { user, session, error } = await supabase.auth.signInWithPassword({ provider: 'github' }, { redirectTo: 'https://example.com/welcome' }) ``` - - name: Sign in with scopes. - description: | - If you need additional data from an OAuth provider, you can include a space-separated list of scopes in your request to get back an OAuth provider token. - You may also need to specify the scopes in the provider's OAuth app settings, depending on the provider. - js: | - ```js - const { user, session, error } = await supabase.auth.signIn({ - provider: 'github' - }, { - scopes: 'repo gist notifications' - }) - const oAuthToken = session.provider_token // use to access provider API - ``` - - name: Sign in using a refresh token (e.g. in React Native). - description: | - If you are completing a sign up or login in a React Native app you can pass the refresh token obtained from the provider to obtain a session. - js: | - ```js - // An example using Expo's `AuthSession` - const redirectUri = AuthSession.makeRedirectUri({ useProxy: false }); - const provider = 'google'; - - AuthSession.startAsync({ - authUrl: `https://MYSUPABASEAPP.supabase.co/auth/v1/authorize?provider=${provider}&redirect_to=${redirectUri}`, - returnUrl: redirectUri, - }).then(async (response: any) => { - if (!response) return; - const { user, session, error } = await supabase.auth.signIn({ - refreshToken: response.params?.refresh_token, - }); - }); - ``` auth.signInWithOtp(): title: 'signInWithOtp()' From a52511a70bace01b6b9bf02a78346b82b3b2b266 Mon Sep 17 00:00:00 2001 From: Copple <10214025+kiwicopple@users.noreply.github.com> Date: Mon, 15 Aug 2022 15:53:58 +0200 Subject: [PATCH 02/14] updating examples --- spec/supabase_js_v2_legacy.yml | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/spec/supabase_js_v2_legacy.yml b/spec/supabase_js_v2_legacy.yml index 66ed513dd30..11bf41a8a7b 100644 --- a/spec/supabase_js_v2_legacy.yml +++ b/spec/supabase_js_v2_legacy.yml @@ -79,6 +79,8 @@ pages: auth.signInWithPassword(): title: 'signInWithPassword()' $ref: '@supabase/gotrue-js.GoTrueClient.signInWithPassword' + notes: | + - A user can sign up either via email or phone. examples: - name: Sign in with email. isSpotlight: true @@ -93,7 +95,7 @@ pages: description: Supabase supports Phone Auth. js: | ```js - const { user, session, error } = await supabase.auth.signIn({ + const { user, session, error } = await supabase.auth.signInWithPassword({ phone: '+13334445555', password: 'some-password', }) From 69b9b0820d410bfd2ed32921d5fd9e0550c4987f Mon Sep 17 00:00:00 2001 From: Copple <10214025+kiwicopple@users.noreply.github.com> Date: Tue, 16 Aug 2022 12:39:05 +0200 Subject: [PATCH 03/14] Updates some of the homepage examples --- apps/www/data/CodeExamples.ts | 2 +- apps/www/data/home/api-examples.js | 2 +- apps/www/data/products/auth/auth-api-examples.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/www/data/CodeExamples.ts b/apps/www/data/CodeExamples.ts index e1002e9cbd0..2e81a24c2c9 100644 --- a/apps/www/data/CodeExamples.ts +++ b/apps/www/data/CodeExamples.ts @@ -23,7 +23,7 @@ export const createUserExample: ExampleProps = { const supabase = createClient(supabaseUrl, supabaseKey) // Create a new user - const { user, error } = await supabase.auth.signUp({ + const { user, error } = await supabase.auth.signUpWithPassword({ email: 'example@email.com', password: 'example-password', }) diff --git a/apps/www/data/home/api-examples.js b/apps/www/data/home/api-examples.js index 2785259c96a..652cfaad0c5 100644 --- a/apps/www/data/home/api-examples.js +++ b/apps/www/data/home/api-examples.js @@ -11,7 +11,7 @@ const supabaseKey = 'public-anon-key' const supabase = createClient(supabaseUrl, supabaseKey) // Create a new user -const { user, error } = await supabase.auth.signUp({ +const { user, error } = await supabase.auth.signUpWithPassword({ email: 'example@email.com', password: 'example-password', }) diff --git a/apps/www/data/products/auth/auth-api-examples.js b/apps/www/data/products/auth/auth-api-examples.js index fa745dd414f..937296ac1fd 100644 --- a/apps/www/data/products/auth/auth-api-examples.js +++ b/apps/www/data/products/auth/auth-api-examples.js @@ -5,7 +5,7 @@ export default [ description: '', code: ` // Sign up with email - const { user, error } = await supabase.auth.signUp({ + const { user, error } = await supabase.auth.signUpWithPassword({ email: 'example@email.com', password: 'example-password', }) From 583373208abe8ad777adf880b5cdac5d7020e7b1 Mon Sep 17 00:00:00 2001 From: Alaister Young Date: Tue, 16 Aug 2022 20:50:18 +1000 Subject: [PATCH 04/14] chore: update with-nextjs guide --- apps/reference/docs/guides/with-nextjs.mdx | 57 ++++++++++++++++++---- 1 file changed, 47 insertions(+), 10 deletions(-) diff --git a/apps/reference/docs/guides/with-nextjs.mdx b/apps/reference/docs/guides/with-nextjs.mdx index 0f82541674a..66d8e6f0dd9 100644 --- a/apps/reference/docs/guides/with-nextjs.mdx +++ b/apps/reference/docs/guides/with-nextjs.mdx @@ -214,7 +214,7 @@ export default function Auth() { const handleLogin = async (email) => { try { setLoading(true) - const { error } = await supabase.auth.signIn({ email }) + const { error } = await supabase.auth.signInWithOtp({ email }) if (error) throw error alert('Check your email for the login link!') } catch (error) { @@ -278,10 +278,23 @@ export default function Account({ session }) { getProfile() }, [session]) + async function getCurrentUser() { + const { + data: { session }, + error, + } = await supabase.auth.getSession() + + if (error) { + throw error + } + + return session.user + } + async function getProfile() { try { setLoading(true) - const user = supabase.auth.user() + const user = await getCurrentUser() let { data, error, status } = await supabase .from('profiles') @@ -308,7 +321,7 @@ export default function Account({ session }) { async function updateProfile({ username, website, avatar_url }) { try { setLoading(true) - const user = supabase.auth.user() + const user = await getCurrentUser() const updates = { id: user.id, @@ -318,9 +331,7 @@ export default function Account({ session }) { updated_at: new Date(), } - let { error } = await supabase.from('profiles').upsert(updates, { - returning: 'minimal', // Don't return the value after inserting - }) + let { error } = await supabase.from('profiles').upsert(updates) if (error) { throw error @@ -391,14 +402,40 @@ import Auth from '../components/Auth' import Account from '../components/Account' export default function Home() { + const [isLoading, setIsLoading] = useState(true) const [session, setSession] = useState(null) useEffect(() => { - setSession(supabase.auth.session()) + let mounted = true - supabase.auth.onAuthStateChange((_event, session) => { - setSession(session) - }) + async function getInitialSession() { + const { + data: { session }, + } = await supabase.auth.getSession() + + // only update the react state if the component is still mounted + if (mounted) { + if (session) { + setSession(session) + } + + setIsLoading(false) + } + } + + getInitialSession() + + const { subscription } = supabase.auth.onAuthStateChange( + (_event, session) => { + setSession(session) + } + ) + + return () => { + mounted = false + + subscription?.unsubscribe() + } }, []) return ( From aa78498fa3282f483f0eb96b50d1d85263002a1f Mon Sep 17 00:00:00 2001 From: Alaister Young Date: Tue, 16 Aug 2022 20:52:33 +1000 Subject: [PATCH 05/14] check for user --- apps/reference/docs/guides/with-nextjs.mdx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/apps/reference/docs/guides/with-nextjs.mdx b/apps/reference/docs/guides/with-nextjs.mdx index 66d8e6f0dd9..8607016a079 100644 --- a/apps/reference/docs/guides/with-nextjs.mdx +++ b/apps/reference/docs/guides/with-nextjs.mdx @@ -288,6 +288,10 @@ export default function Account({ session }) { throw error } + if (!session?.user) { + throw new Error('User not logged in') + } + return session.user } From 96de33dd06807f520ac6595d2882d19653b0a60f Mon Sep 17 00:00:00 2001 From: Copple <10214025+kiwicopple@users.noreply.github.com> Date: Tue, 16 Aug 2022 12:54:54 +0200 Subject: [PATCH 06/14] Updates all examples --- .../2021-03-02-supabase-beta-february-2021.mdx | 4 ++-- .../2021-04-06-supabase-beta-march-2021.mdx | 2 +- .../2022-02-22-supabase-beta-january-2022.mdx | 4 ++-- .../_blog/2022-03-31-supabase-edge-functions.mdx | 2 +- .../2022-04-01-hackathon-bring-the-func.mdx | 2 +- ...22-04-18-bring-the-func-hackathon-winners.mdx | 2 +- .../_blog/2022-06-07-beta-update-may-2022.mdx | 8 ++++---- apps/www/components/BuiltWithSupabase/index.tsx | 4 ++-- apps/www/components/Sections/GithubExamples.tsx | 4 ++-- apps/www/data/Examples.json | 16 ++++++++-------- apps/www/data/ProjectExamples.json | 4 ++-- apps/www/pages/storage/Storage.tsx | 2 +- 12 files changed, 27 insertions(+), 27 deletions(-) diff --git a/apps/www/_blog/2021-03-02-supabase-beta-february-2021.mdx b/apps/www/_blog/2021-03-02-supabase-beta-february-2021.mdx index 5a184600c47..35bb2236f89 100644 --- a/apps/www/_blog/2021-03-02-supabase-beta-february-2021.mdx +++ b/apps/www/_blog/2021-03-02-supabase-beta-february-2021.mdx @@ -78,9 +78,9 @@ Launch your database in South Africa. ### Community -One of the community, [@ftonato](https://github.com/ftonato), has built an amazing [example](https://github.com/supabase/supabase/tree/master/examples/with-stencil) that shows how to use Supabase with [Stencil](https://stenciljs.com/) (a Web Component compiler built by they [Ionic](https://ionicframework.com/) team.) +One of the community, [@ftonato](https://github.com/ftonato), has built an amazing [example](https://github.com/supabase/examples/tree/main/supabase-js-v1/with-stencil) that shows how to use Supabase with [Stencil](https://stenciljs.com/) (a Web Component compiler built by they [Ionic](https://ionicframework.com/) team.) -[Check it out!](https://github.com/supabase/supabase/tree/master/examples/with-stencil) +[Check it out!](https://github.com/supabase/examples/tree/main/supabase-js-v1/with-stencil) ![Supabase with Stencil](/images/blog/feb/supabase-stencil.png) diff --git a/apps/www/_blog/2021-04-06-supabase-beta-march-2021.mdx b/apps/www/_blog/2021-04-06-supabase-beta-march-2021.mdx index 073fad6dbb0..6f4eb3c9995 100644 --- a/apps/www/_blog/2021-04-06-supabase-beta-march-2021.mdx +++ b/apps/www/_blog/2021-04-06-supabase-beta-march-2021.mdx @@ -95,7 +95,7 @@ Thanks to a comunity contribution ([@\_mateomorris](https://twitter.com/_mateomo - Ionic Integration by [Simon Grimm](https://www.youtube.com/user/saimon1924) [[Video](https://www.youtube.com/watch?v=pl9XfIWutKE)] - Flutter Integration by [Aditya Thakur](https://www.youtube.com/channel/UChCAJNpMwoEUYCsE_eSyU4w) by [[Video](https://www.youtube.com/watch?v=fqfHEZvQPlY)] - Svelte Integration by [Khaerunnisa Isnaeni](https://www.youtube.com/channel/UCqNDj6eQeTLHuEwgEHWOGjw) [[Video](https://www.youtube.com/watch?v=odPYzJJyEJI)] -- An [example app](https://github.com/supabase/supabase/tree/master/examples/nextjs-ts-user-management) for adding User Profiles to your Next.js app +- An [example app](https://github.com/supabase/examples/tree/main/supabase-js-v1/user-management) for adding User Profiles to your Next.js app ![Supabase Stars march 2021](/images/blog/march-2021/supabase-stars-march-2021.png) diff --git a/apps/www/_blog/2022-02-22-supabase-beta-january-2022.mdx b/apps/www/_blog/2022-02-22-supabase-beta-january-2022.mdx index da70c2b978c..8615f4d2e40 100644 --- a/apps/www/_blog/2022-02-22-supabase-beta-january-2022.mdx +++ b/apps/www/_blog/2022-02-22-supabase-beta-january-2022.mdx @@ -95,12 +95,12 @@ type AccountHolder { It’s all anyone seems to be [talking about](https://twitter.com/jkup/status/1456360115205033989). We genuinely love what [Remix](https://remix.run/) are doing, so it’s only right that we show off how Remix and Supabase work well together. -Check out the new [Remix Auth example](https://github.com/supabase/supabase/tree/master/examples/remix-auth), and let us know what you think. +Check out the new [Remix Auth example](https://github.com/supabase/examples/tree/main/supabase-js-v1/auth/remix-auth), and let us know what you think. ### Expo Todo List Our React Native example has been correctly updated to be an Expo example. -[Check it out here](https://github.com/supabase/supabase/tree/master/examples/todo-list/expo-todo-list). +[Check it out here](https://github.com/supabase/examples/tree/main/supabase-js-v1/todo-list/expo-todo-list). ## Video: API requests with Database Webhooks diff --git a/apps/www/_blog/2022-03-31-supabase-edge-functions.mdx b/apps/www/_blog/2022-03-31-supabase-edge-functions.mdx index fe17cc6ef21..17965805b2a 100644 --- a/apps/www/_blog/2022-03-31-supabase-edge-functions.mdx +++ b/apps/www/_blog/2022-03-31-supabase-edge-functions.mdx @@ -98,7 +98,7 @@ Our observability pipeline has been built [using Logflare](https://supabase.com/ ![new —> deploy —> invoke —> logs](/images/blog/launch-week-4/thursday-functions/functions-new-deploy-invoke-logs.gif) new —> deploy —> invoke —> logs -To round off the end-to-end experience, `supabase-js` now works in Deno, making it easy to interact with the rest of your Supabase project from within your Edge Functions. Your project's URLs, API keys, and database connection strings are made available as environment variables within your Function to make this even easier. And if you want to interact with third-party APIs which require a secret key, such as Stripe, you can easily and securely make these available to your Function as environment variables via the Supabase CLI. To get an idea for what is possible, check out our examples page [here](https://github.com/supabase/supabase/tree/master/examples/edge-functions). +To round off the end-to-end experience, `supabase-js` now works in Deno, making it easy to interact with the rest of your Supabase project from within your Edge Functions. Your project's URLs, API keys, and database connection strings are made available as environment variables within your Function to make this even easier. And if you want to interact with third-party APIs which require a secret key, such as Stripe, you can easily and securely make these available to your Function as environment variables via the Supabase CLI. To get an idea for what is possible, check out our examples page [here](https://github.com/supabase/examples/tree/main/supabase-js-v1/edge-functions). ## Quickstart diff --git a/apps/www/_blog/2022-04-01-hackathon-bring-the-func.mdx b/apps/www/_blog/2022-04-01-hackathon-bring-the-func.mdx index 31ab4628aae..138ef0de773 100644 --- a/apps/www/_blog/2022-04-01-hackathon-bring-the-func.mdx +++ b/apps/www/_blog/2022-04-01-hackathon-bring-the-func.mdx @@ -132,7 +132,7 @@ Here's a collection of resources that will help you get started building with Su - [Edge Functions Guide](https://supabase.com/docs/guides/functions) - [Edge Functions Quickstart video](https://youtu.be/rzglqRdZUQE) - [Supabase CLI local development guide](https://supabase.com/docs/guides/local-development) -- [Edge Functions examples](https://github.com/supabase/supabase/tree/master/examples/edge-functions) +- [Edge Functions examples](https://github.com/supabase/examples/tree/main/supabase-js-v1/edge-functions) ### Additional Info diff --git a/apps/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx b/apps/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx index 603cb16ea8f..249fa8b6ea1 100644 --- a/apps/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx +++ b/apps/www/_blog/2022-04-18-bring-the-func-hackathon-winners.mdx @@ -99,6 +99,6 @@ If you're inspired to build, check out some of the latest resources: - [Edge Functions Guide](https://supabase.com/docs/guides/functions) - [Edge Functions Quickstart video](https://youtu.be/rzglqRdZUQE) - [Supabase CLI local development guide](https://supabase.com/docs/guides/local-development) -- [Edge Functions examples](https://github.com/supabase/supabase/tree/master/examples/edge-functions) +- [Edge Functions examples](https://github.com/supabase/examples/tree/main/supabase-js-v1/edge-functions) [^1]: Updated on June 14 2022 for search optimization: Removed links as account does not exist anymore on GitHub diff --git a/apps/www/_blog/2022-06-07-beta-update-may-2022.mdx b/apps/www/_blog/2022-06-07-beta-update-may-2022.mdx index c3b70e34898..8651a209a51 100644 --- a/apps/www/_blog/2022-06-07-beta-update-may-2022.mdx +++ b/apps/www/_blog/2022-06-07-beta-update-may-2022.mdx @@ -20,9 +20,9 @@ Wildcard redirects are especially useful for Jamstack platforms with preview dep ## Supabase Edge functions with Webhooks -Now you can deploy functions with optional JWT verification. This makes it easier to trigger Edge Functions with webhooks. Use the -no-verify-jwt flag when deploying your functions via the CLI to enable this mode. You can test this out with our [Edge Functions Telegram Bot example](https://github.com/supabase/supabase/tree/master/examples/edge-functions/supabase/functions/telegram-bot). +Now you can deploy functions with optional JWT verification. This makes it easier to trigger Edge Functions with webhooks. Use the -no-verify-jwt flag when deploying your functions via the CLI to enable this mode. You can test this out with our [Edge Functions Telegram Bot example](https://github.com/supabase/examples/tree/main/supabase-js-v1/edge-functions/supabase/functions/telegram-bot). -[![graphql](/images/blog/2022-may/stripe-webhook.jpg)](https://github.com/supabase/supabase/tree/master/examples/edge-functions/supabase/functions/telegram-bot) +[![graphql](/images/blog/2022-may/stripe-webhook.jpg)](https://github.com/supabase/examples/tree/main/supabase-js-v1/edge-functions/supabase/functions/telegram-bot) ## Metrics for everybody @@ -39,7 +39,7 @@ The Policy editor now includes a “Target roles” field. We now have a strong ## State of DB 2022 Basedash conducted a survey that takes the pulse of the current databases that teams, individuals, startups, enterprises and hobbyists are using. - + Supabase was listed in two categories, including the first place in satisfaction for hosting providers (84% of users would use us again 🙏). [Full results](https://stateofdb.com/). [![secret scanning](/images/blog/2022-may/databasesurvey.jpg)](https://stateofdb.com/) @@ -67,7 +67,7 @@ There is an opportunity to work inside the growth team at Supabase. It's still a ### Deepnote Deepnote is a data notebook that’s built for collaboration — Jupyter compatible, works magically in the cloud, and sharing is as easy as sending a link. - + You can connect your Supabase Postgres Database to your Deepnote notebooks to quickly analyze data and share your findings with others. [Check out the guide](https://docs.deepnote.com/integrations/supabase). [![supabrew](/images/blog/2022-may/graph.jpg)](https://docs.deepnote.com/integrations/supabase) diff --git a/apps/www/components/BuiltWithSupabase/index.tsx b/apps/www/components/BuiltWithSupabase/index.tsx index f6d5541a538..25278aea0a1 100644 --- a/apps/www/components/BuiltWithSupabase/index.tsx +++ b/apps/www/components/BuiltWithSupabase/index.tsx @@ -21,8 +21,8 @@ const BuiltExamples = () => {