From e50df765d3d04f367d3d6e376dc4c96324b8bb19 Mon Sep 17 00:00:00 2001 From: Nihal Maskey <26411488+maskeynihal@users.noreply.github.com> Date: Tue, 31 Jan 2023 18:37:25 +0545 Subject: [PATCH] Update nextjs-server-components.mdx Without default value, TS throw error about `createContext` should have `defaultValue` Following this blog, https://kentcdodds.com/blog/how-to-use-react-context-effectively#the-custom-consumer-hook; added `undefined` and checking if the provider is created or not. --- .../auth/auth-helpers/nextjs-server-components.mdx | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/apps/docs/pages/guides/auth/auth-helpers/nextjs-server-components.mdx b/apps/docs/pages/guides/auth/auth-helpers/nextjs-server-components.mdx index 69a5d5e6d3c..81ec0800566 100644 --- a/apps/docs/pages/guides/auth/auth-helpers/nextjs-server-components.mdx +++ b/apps/docs/pages/guides/auth/auth-helpers/nextjs-server-components.mdx @@ -282,7 +282,7 @@ type SupabaseContext = { supabase: SupabaseClient } -const Context = createContext() +const Context = createContext(undefined) export default function SupabaseProvider({ children }: { children: React.ReactNode }) { const [supabase] = useState(() => createClient()) @@ -294,7 +294,13 @@ export default function SupabaseProvider({ children }: { children: React.ReactNo ) } -export const useSupabase = () => useContext(Context) +export const useSupabase = () => { + if (context === undefined) { + throw new Error("useSupabase must be used inside SupabaseProvider"); + } + + return useContext(Context) +} ``` > TypeScript types can be [generated with the Supabase CLI](https://supabase.com/docs/reference/javascript/typescript-support) and passed to `createBrowserSupabaseClient` to add type support to the Supabase client.