Client Side Oauth?

'use client';

import { useSearchParams, useRouter } from 'next/navigation';
import { Suspense } from 'react';

import Loading from '@app/loading';
import { Endpoints } from '@coursefull/enums';
import { supabase } from '@lib/supabase';

async function AuthCallback() {
    const router = useRouter();
    const searchParams = useSearchParams();
    const code = searchParams.get('code');
    const next = searchParams.get('next') ?? '/';

    if (!code) {
        throw new Error(`Auth code not present.`);
    }

    const { error } = await supabase.auth.exchangeCodeForSession(code);

    if (error) {
        throw error;
    }

    router.push(Endpoints.DASHBOARD);

    return <div></div>;
}

export default function Page() {
    return (
        <Suspense fallback={<Loading />}>
            <AuthCallback />
        </Suspense>
    );
}

import { createClient } from '@supabase/supabase-js';

const AUTH_TOKEN_STORAGE_KEY = 'sb-coursefull-auth-token';

const supabase = createClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL || '',
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY || '',
    {
        auth: {
            flowType: 'pkce',
            storageKey: AUTH_TOKEN_STORAGE_KEY,
        },
    }
);

export default supabase;
export { AUTH_TOKEN_STORAGE_KEY };