Uncaught TypeError: Cannot read properties of null (reading 'useState')

[mashwishi]

Bug report

• [x] I confirm this is a bug with Supabase, not with my own application.
• [x] I confirm I have searched the Docs, GitHub Discussions, and Discord.

Issue

Everytime I add this Auth (this is a component) in my login page i am having issue, I am trying to follow the docs about Supabase Auth with Next.js Pages Directory. If you guys think this is a version issue please let me know. Been trying to search this issue on internet but haven't found related to auth-ui but i do think that this issue is from Auth since it only happens everytime i add this.

Code

import { Auth } from '@supabase/auth-ui-react'
import { ThemeSupa } from '@supabase/auth-ui-shared'
import { createClientComponentClient } from '@supabase/auth-helpers-nextjs'
import { useTheme } from 'next-themes'
import { Database } from '../../types/database.types'

export default function AuthForm() {
    const supabase = createClientComponentClient<Database>()
    const { theme } = useTheme();

    return ( 
            <Auth
            supabaseClient={supabase}
            appearance={{ theme: ThemeSupa }}
            socialLayout="horizontal"
            onlyThirdPartyProviders={true}
            theme={theme === 'dark' ? 'light' : 'dark'}
            showLinks={false}
            providers={['google', 'twitter', 'discord']}
            redirectTo="http://localhost:3000/api/auth/callback"
            />
    )
}

Demo

Packages / Dependencies

"@supabase/auth-helpers-nextjs": "^0.7.2",
"@supabase/auth-helpers-react": "^0.4.0",
"@supabase/auth-ui-react": "^0.4.2",
"@supabase/auth-ui-shared": "^0.1.6",
"@supabase/supabase-js": "^2.25.0",
"next": "^12.0.9",
"react": "17.0.2",
"react-dom": "17.0.2",

Issue #193 Visitor Count

[schybo]

@mashwishi What was your solve here? Running into the same issue

[mashwishi]

@mashwishi What was your solve here? Running into the same issue

@schybo , The issue is the compatibility. So i have decided to update:

    "react": "18.2.0",
    "react-dom": "18.2.0",
    "@supabase/auth-helpers-nextjs": "^0.7.2",
    "@supabase/auth-helpers-react": "^0.4.0",
    "@supabase/auth-ui-react": "^0.4.2",
    "@supabase/auth-ui-shared": "^0.1.6",
    "@supabase/supabase-js": "^2.25.0",

https://stackoverflow.com/questions/76681113/supabase-auth-ui-issue-uncaught-typeerror-cannot-read-properties-of-null-read/76703679#76703679