docs: replace deprecated getSession with getClaims in SolidJS tutorial (#43034)

Fixes #42192

Replaces the deprecated `getSession` call with `getClaims` in the
SolidJS tutorial documentation (`with-solidjs.mdx`).

Changes:
- `supabase.auth.getSession()` → `supabase.auth.getClaims()`
- `data.session` → `data.claims`

This follows the recommended migration pattern per the Supabase auth
docs, and is consistent with the same fix applied to the Refine tutorial
in #43006.

---------

Co-authored-by: Chris Chinchilla <chris.ward@supabase.io>

examples/user-management/solid-user-management/.env.example

@@ -1,2 +1,2 @@
 VITE_SUPABASE_URL=https://your-project-ref.supabase.co
-VITE_SUPABASE_ANON_KEY=your-publishable-key
+VITE_SUPABASE_PUBLISHABLE_KEY=your-publishable-key

examples/user-management/solid-user-management/package.json

@@ -11,13 +11,13 @@
 	},
 	"license": "MIT",
 	"devDependencies": {
-		"prettier": "^2.7.1",
-		"typescript": "^4.7.4",
-		"vite": "^4.3.9",
-		"vite-plugin-solid": "^2.3.0"
+		"prettier": "^3.8.1",
+		"typescript": "^5.9.3",
+		"vite": "^7.3.1",
+		"vite-plugin-solid": "^2.11.10"
 	},
 	"dependencies": {
-		"@supabase/supabase-js": "^2.0.4",
-		"solid-js": "^1.4.7"
+		"@supabase/supabase-js": "^2.97.0",
+		"solid-js": "^1.9.11"
 	}
 }

examples/user-management/solid-user-management/src/Account.tsx

@@ -1,13 +1,13 @@
-import { AuthSession } from '@supabase/supabase-js'
 import { Component, createEffect, createSignal } from 'solid-js'
 import Avatar from './Avatar'
 import { supabase } from './supabaseClient'
 
 interface Props {
-	session: AuthSession
+	userId: string
+	userEmail: string | null
 }
 
-const Account: Component<Props> = ({ session }) => {
+const Account: Component<Props> = ({ userId, userEmail }) => {
 	const [loading, setLoading] = createSignal(true)
 	const [username, setUsername] = createSignal<string | null>(null)
 	const [website, setWebsite] = createSignal<string | null>(null)
@@ -20,12 +20,11 @@ const Account: Component<Props> = ({ session }) => {
 	const getProfile = async () => {
 		try {
 			setLoading(true)
-			const { user } = session
 
 			let { data, error, status } = await supabase
 				.from('profiles')
 				.select(`username, website, avatar_url`)
-				.eq('id', user.id)
+				.eq('id', userId)
 				.single()
 
 			if (error && status !== 406) {
@@ -51,10 +50,9 @@ const Account: Component<Props> = ({ session }) => {
 
 		try {
 			setLoading(true)
-			const { user } = session
 
 			const updates = {
-				id: user.id,
+				id: userId,
 				username: username(),
 				website: website(),
 				avatar_url: avatarUrl(),
@@ -86,7 +84,7 @@ const Account: Component<Props> = ({ session }) => {
 						updateProfile(e)
 					}}
 				/>
-				<div>Email: {session.user.email}</div>
+				<div>Email: {userEmail}</div>
 				<div>
 					<label for="username">Name</label>
 					<input

examples/user-management/solid-user-management/src/App.tsx

@@ -1,25 +1,29 @@
 import { Component, createEffect, createSignal } from 'solid-js'
 import { supabase } from './supabaseClient'
-import { AuthSession } from '@supabase/supabase-js'
 import Account from './Account'
 import Auth from './Auth'
 
 const App: Component = () => {
-	const [session, setSession] = createSignal<AuthSession | null>(null)
+	const [userId, setUserId] = createSignal<string | null>(null)
+	const [userEmail, setUserEmail] = createSignal<string | null>(null)
+
+	const syncClaims = async () => {
+		const { data } = await supabase.auth.getClaims()
+		setUserId((data?.claims.sub as string) ?? null)
+		setUserEmail((data?.claims.email as string) ?? null)
+	}
 
 	createEffect(() => {
-		supabase.auth.getSession().then(({ data: { session } }) => {
-			setSession(session)
-		})
+		syncClaims()
 
-		supabase.auth.onAuthStateChange((_event, session) => {
-			setSession(session)
+		supabase.auth.onAuthStateChange(() => {
+			syncClaims()
 		})
 	})
 
 	return (
 		<div class="container" style={{ padding: '50px 0 100px 0' }}>
-			{!session() ? <Auth /> : <Account session={session()!} />}
+			{!userId() ? <Auth /> : <Account userId={userId()!} userEmail={userEmail()} />}
 		</div>
 	)
 }

examples/user-management/solid-user-management/src/supabaseClient.tsx

@@ -2,6 +2,6 @@ import { createClient } from '@supabase/supabase-js'
 import { Database } from './schema'
 
 const supabaseUrl = import.meta.env.VITE_SUPABASE_URL
-const supabasePublishableKey = import.meta.env.VITE_SUPABASE_ANON_KEY
+const supabasePublishableKey = import.meta.env.VITE_SUPABASE_PUBLISHABLE_KEY
 
-export const supabase = createClient<Database>(supabaseUrl, supabasePublishableKey)
+export const supabase = createClient(supabaseUrl, supabasePublishableKey)