Storage adapter (#507)

* add storage adapters

* Remove unused filterCookies function

* add pkce support

* update sveltekit example

* Add pre-release changeset

* Bump SvelteKit version

---------

Co-authored-by: David Plugge <git@davidplugge.de>

.changeset/cyan-dancers-care.md

@@ -0,0 +1,9 @@
+---
+'@supabase/auth-helpers-nextjs': minor
+'@supabase/auth-helpers-react': minor
+'@supabase/auth-helpers-remix': minor
+'@supabase/auth-helpers-shared': minor
+'@supabase/auth-helpers-sveltekit': minor
+---
+
+Add cookie storage adapter per library following a shared storage adapter

.changeset/pre.json

@@ -0,0 +1,17 @@
+{
+  "mode": "pre",
+  "tag": "next",
+  "initialVersions": {
+    "@example/nextjs": "0.0.0",
+    "@example/nextjs-server-components": "0.0.0",
+    "@example/sveltekit": "0.0.0",
+    "config": "0.1.0",
+    "@supabase/auth-helpers-nextjs": "0.6.0",
+    "@supabase/auth-helpers-react": "0.3.1",
+    "@supabase/auth-helpers-remix": "0.1.8",
+    "@supabase/auth-helpers-shared": "0.3.3",
+    "@supabase/auth-helpers-sveltekit": "0.9.3",
+    "tsconfig": "0.1.1"
+  },
+  "changesets": []
+}

.changeset/violet-frogs-know.md

@@ -0,0 +1,9 @@
+---
+'@supabase/auth-helpers-nextjs': minor
+'@supabase/auth-helpers-react': minor
+'@supabase/auth-helpers-remix': minor
+'@supabase/auth-helpers-shared': minor
+'@supabase/auth-helpers-sveltekit': minor
+---
+
+Add full server side support to auth helpers through PKCE

examples/nextjs/package.json

@@ -13,6 +13,7 @@
     "@supabase/auth-helpers-nextjs": "workspace:*",
     "@supabase/auth-helpers-react": "workspace:*",
     "@supabase/auth-ui-react": "^0.2.6",
+    "@supabase/supabase-js": "^2.19.0",
     "next": "^12.2.5",
     "react": "17.0.2",
     "react-dom": "17.0.2"

examples/nextjs/pages/api/callback.ts

@@ -0,0 +1,18 @@
+// pages/api/protected-route.ts
+import { NextApiHandler } from 'next';
+import { createServerSupabaseClient } from '@supabase/auth-helpers-nextjs';
+
+const callback: NextApiHandler = async (req, res) => {
+  // Create authenticated Supabase Client
+  const supabase = createServerSupabaseClient({ req, res });
+
+  const code = req.query.code;
+
+  if (typeof code === 'string') {
+    await supabase.auth.exchangeCodeForSession(code);
+  }
+
+  res.redirect('/');
+};
+
+export default callback;

examples/nextjs/pages/index.tsx

@@ -34,7 +34,10 @@ const LoginPage: NextPage = () => {
           onClick={() => {
             supabaseClient.auth.signInWithOAuth({
               provider: 'github',
-              options: { scopes: 'repo', redirectTo: 'http://localhost:3000' }
+              options: {
+                scopes: 'repo',
+                redirectTo: 'http://localhost:3000/api/callback'
+              }
             });
           }}
         >

examples/remix/app/routes/__supabase.tsx

@@ -70,7 +70,10 @@ export default function Supabase() {
     const {
       data: { subscription }
     } = supabase.auth.onAuthStateChange((event, session) => {
-      if (session?.access_token !== serverAccessToken) {
+      if (
+        session?.access_token !== serverAccessToken &&
+        fetcher.state === 'idle'
+      ) {
         // server and client are out of sync.
         // Remix recalls active loaders after actions complete
         fetcher.submit(null, {

examples/remix/app/routes/__supabase/callback.tsx

@@ -0,0 +1,18 @@
+import { type LoaderArgs, redirect } from '@remix-run/node';
+import { createServerClient } from 'utils/supabase.server';
+
+export async function loader({ request }: LoaderArgs) {
+  const url = new URL(request.url);
+  const code = url.searchParams.get('code');
+
+  const response = new Response();
+  if (code) {
+    const supabase = createServerClient({ request, response });
+    await supabase.auth.exchangeCodeForSession(code);
+  }
+
+  return redirect('/', {
+    status: 303,
+    headers: response.headers
+  });
+}

examples/remix/components/login.tsx

@@ -20,7 +20,10 @@ export default function Login({
 
   const handleGitHubLogin = async () => {
     const { error } = await supabase.auth.signInWithOAuth({
-      provider: 'github'
+      provider: 'github',
+      options: {
+        redirectTo: `${location.origin}/callback`
+      }
     });
 
     if (error) {

examples/remix/package.json

@@ -12,6 +12,7 @@
     "@remix-run/react": "^1.7.6",
     "@remix-run/serve": "^1.7.6",
     "@supabase/auth-helpers-remix": "workspace:*",
+    "@supabase/supabase-js": "^2.19.0",
     "isbot": "^3.5.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"