feat(frameworks): Introduce SvelteKit Auth (#6041)

* WIP use `Request` and `Response` for core

* bump Next.js

* rename ts types

* refactor

* simplify

* upgrade Next.js

* implement body reader

* use `Request`/`Response` in `next-auth/next`

* make linter happy

* revert

* fix tests

* remove workaround for middleware return type

* return session in protected api route example

* don't export internal handler

* fall back host to localhost

* refactor `getBody`

* refactor `next-auth/next`

* chore: add `@edge-runtime/jest-environment`

* fix tests, using Node 18 as runtime

* fix test

* remove patch

* upgrade/add dependencies

* type and default import on one line

* don't import all adapters by default in dev

* simplify internal endpoint config

Instead of passing url and params around as a string and an object,
we parse them into a `URL` instance.

* assert if both endpoint and issuer config is missing

* allow internal redirect to be `URL`

* mark clientId as always internally, fix comments

* add web-compatible authorization URL handling

* fix type

* fix neo4j build

* remove new-line

* reduce file changes in the PR

* simplify types

* refactor `crypto` usage

In Node.js, inject `globalThis.crypto` instead of import

* add `next-auth/web`

* refactor

* send header instead of body to indicate redirect response

* fix eslint

* fix tests

* chore: upgrade dep

* fix import

* refactor: more renames

* wip core

* support OIDC

* remove `openid-client`

* temprarily remove duplicate logos

* revert

* move redirect logic to core

* feat: add sveltekit auth

* wip fix css

* revert Logo component

* output ESM

* fix logout

* deprecate OAuth 1,  simplify internals, improve defaults

* refactor providers, test facebook

* fix providers

* target es2020

* fix CSS

* fix AuthHandler, add getServerSession

* update lock file

* make logos optional

* sync with `next-auth`

* clean up `next-auth/edge`

* sync

* Sync (#2)

* fix(core): properly construct url (#5984)

* chore(release): bump package version(s) [skip ci]

* fix(core): add protocol if missing

* fix(core): throw error if no action can be determined

* test(core): fix test

* chore(release): bump package version(s) [skip ci]

* chore(docs): add new tutorial (#5604)

Co-authored-by: Nico Domino <yo@ndo.dev>

* fix(core): handle `Request` -> `Response` regressions  (#5991)

* fix(next): don't override `Content-Type` by `unstable_getServerSession`

* fix(core): handle `,` while setting `set-cookie`

* chore(release): bump package version(s) [skip ci]

* fix(sequelize): increase sequelize `id_token` column length (#5929)

Co-authored-by: Nico Domino <yo@ndo.dev>

* fix(core): correct status code when returning redirects (#6004)

* fix(core): correctly set status when returning redirect

* update tests

* forward other headers

* update test

* remove default 200 status

* fix(core): host detection/NEXTAUTH_URL (#6007)

* rename `host` to `origin` internally

* rename `userOptions` to `authOptions` internally

* use object for `headers` internally

* default `method` to GET

* simplify `unstable_getServerSession`

* allow optional headers

* revert middleware

* wip getURL

* revert host detection

* use old `detectHost`

* fix/add some tests wip

* move more to core, refactor getURL

* better type auth actions

* fix custom path support (w/ api/auth)

* add `getURL` tests

* fix email tests

* fix assert tests

* custom base without api/auth, with trailing slash

* remove parseUrl from assert.ts

* return 400 when wrong url

* fix tests

* refactor

* fix protocol in dev

* fix tests

* fix custom url handling

* add todo comments

* chore(release): bump package version(s) [skip ci]

* update lock file

* fix(next): correctly bundle next-auth/middleware
fixes #6025

* fix(core): preserve incoming set cookies (#6029)

* fix(core): preserve `set-cookie` by the user

* add test

* improve req/res mocking

* refactor

* fix comment typo

* chore(release): bump package version(s) [skip ci]

* make logos optional

* sync with `next-auth`

* clean up `next-auth/edge`

* sync

Co-authored-by: Balázs Orbán <balazsorban44@users.noreply.github.com>
Co-authored-by: Thomas Desmond <24610108+thomas-desmond@users.noreply.github.com>
Co-authored-by: Nico Domino <yo@ndo.dev>
Co-authored-by: Cyril Perraud <perraud.cyril@gmail.com>

* merge

* clean up sveltekit auth handler

* upgrade playground to latest

* upgrade sveltekit auth to latest

* Some more refactoring

* feat: extract type to core and reuse in sveltekit

* remove uuid

* make secret required in dev

* remove todo comments

* pass through OAuth client options

* generate declaration map

* default env secret to AUTH_SECRET

* temporary Headers fix

* move pages to lib

* move errors to lib

* move pages/index to lib

* move routes to lib

* move init to lib

* move styles to lib

* move types to lib

* move utils to lib

* fix imports

* update ignore/clean patterns

* fix imports

* update styles ts

* update gitignore

* update exports field

* revert `next-auth`

* remove extra tsconfig files

* remove `private` from package.json

* revert

* feat sveltekit

* commit

* remove unused file, expose type

* remove nextauth_url, memoize locals.getSession

* move to dependency

* fix

* format

* fix post build

* simplify

* fix lock file

* add packages/frameworks

* update package.json

* update gitignore

* Delete .gitignore

* Update types.ts

* Update tsconfig.dev.json

* skip test

* format

* skip format/lint

Co-authored-by: Balázs Orbán <info@balazsorban.com>
Co-authored-by: Balázs Orbán <balazsorban44@users.noreply.github.com>
Co-authored-by: Thomas Desmond <24610108+thomas-desmond@users.noreply.github.com>
Co-authored-by: Nico Domino <yo@ndo.dev>
Co-authored-by: Cyril Perraud <perraud.cyril@gmail.com>

.eslintrc.js

@@ -18,6 +18,7 @@ module.exports = {
       parserOptions: {
         project: [
           path.resolve(__dirname, "./packages/**/tsconfig.eslint.json"),
+          path.resolve(__dirname, "./packages/frameworks/**/tsconfig.json"),
           path.resolve(__dirname, "./apps/**/tsconfig.json"),
         ],
       },

.gitignore

@@ -85,4 +85,13 @@ packages/core/adapters.*
 packages/core/index.*
 packages/core/jwt
 packages/core/lib
-packages/core/providers
+packages/core/providers
+
+
+# SvelteKit
+packages/frameworks/sveltekit/index.*
+packages/frameworks/sveltekit/client.*
+packages/frameworks/sveltekit/.svelte-kit
+packages/frameworks/sveltekit/package
+packages/frameworks/sveltekit/vite.config.js.timestamp-*
+packages/frameworks/sveltekit/vite.config.ts.timestamp-*

apps/playground-sveltekit/.eslintignore

@@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock

apps/playground-sveltekit/.eslintrc.cjs

@@ -1,24 +1,20 @@
 module.exports = {
-  root: true,
-  parser: "@typescript-eslint/parser",
-  extends: [
-    "eslint:recommended",
-    "plugin:@typescript-eslint/recommended",
-    "prettier",
-  ],
-  plugins: ["svelte3", "@typescript-eslint"],
-  ignorePatterns: ["*.cjs", "build/**/*"],
-  overrides: [{ files: ["*.svelte"], processor: "svelte3/svelte3" }],
-  settings: {
-    "svelte3/typescript": () => require("typescript"),
-  },
-  parserOptions: {
-    sourceType: "module",
-    ecmaVersion: 2020,
-  },
-  env: {
-    browser: true,
-    es2017: true,
-    node: true,
-  },
-}
+	root: true,
+	parser: '@typescript-eslint/parser',
+	extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
+	plugins: ['svelte3', '@typescript-eslint'],
+	ignorePatterns: ['*.cjs'],
+	overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
+	settings: {
+		'svelte3/typescript': () => require('typescript')
+	},
+	parserOptions: {
+		sourceType: 'module',
+		ecmaVersion: 2020
+	},
+	env: {
+		browser: true,
+		es2017: true,
+		node: true
+	}
+};

apps/playground-sveltekit/.gitignore

@@ -6,3 +6,7 @@ node_modules
 .env
 .env.*
 !.env.example
+.vercel
+.output
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*

apps/playground-sveltekit/.prettierignore

@@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock

apps/playground-sveltekit/.prettierrc

@@ -0,0 +1,9 @@
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100,
+	"plugins": ["prettier-plugin-svelte"],
+	"pluginSearchDirs": ["."],
+	"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
+}

apps/playground-sveltekit/package.json

@@ -1,43 +1,37 @@
 {
-  "name": "sveltekit-nextauth",
-  "private": true,
-  "version": "0.0.1",
-  "scripts": {
-    "dev": "vite dev",
-    "build": "vite build",
-    "preview": "vite preview",
-    "start": "HOST=127.0.0.1 PORT=5173 ORIGIN=http://localhost:5173 node ./build",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "prettier --check . && eslint .",
-    "format": "prettier --write ."
-  },
-  "devDependencies": {
-    "@sveltejs/adapter-auto": "^1.0.0-next.80",
-    "@sveltejs/adapter-node": "1.0.0-next.96",
-    "@sveltejs/kit": "1.0.0-next.511",
-    "@types/cookie": "^0.5.1",
-    "@typescript-eslint/eslint-plugin": "^5.35.1",
-    "@typescript-eslint/parser": "^5.35.1",
-    "eslint": "^8.22.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-svelte3": "^4.0.0",
-    "prettier": "^2.7.1",
-    "prettier-plugin-svelte": "^2.7.0",
-    "svelte": "^3.49.0",
-    "svelte-check": "^2.8.1",
-    "svelte-preprocess": "^4.10.7",
-    "tslib": "^2.4.0",
-    "typescript": "~4.8.2",
-    "vite": "^3.1.0"
-  },
-  "type": "module",
-  "dependencies": {
-    "cookie": "0.5.0",
-    "next-auth": "latest"
-  },
-  "prettier": {
-    "semi": false,
-    "singleQuote": false
-  }
+	"name": "sveltekit-nextauth",
+	"private": true,
+	"version": "0.0.1",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build",
+		"preview": "vite preview",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
+	},
+	"devDependencies": {
+		"@fontsource/fira-mono": "^4.5.10",
+		"@neoconfetti/svelte": "^1.0.0",
+		"@sveltejs/adapter-auto": "next",
+		"@sveltejs/kit": "next",
+		"@types/cookie": "^0.5.1",
+		"@typescript-eslint/eslint-plugin": "^5.45.0",
+		"@typescript-eslint/parser": "^5.45.0",
+		"eslint": "^8.28.0",
+		"eslint-config-prettier": "^8.5.0",
+		"eslint-plugin-svelte3": "^4.0.0",
+		"prettier": "^2.8.0",
+		"prettier-plugin-svelte": "^2.8.1",
+		"svelte": "^3.54.0",
+		"svelte-check": "^2.9.2",
+		"tslib": "^2.4.1",
+		"typescript": "^4.9.3",
+		"vite": "^4.0.0"
+	},
+	"dependencies": {
+		"cookie": "0.5.0",
+		"@auth/core": "workspace:*",
+		"@auth/sveltekit": "workspace:^"
+	},
+	"type": "module"
 }

apps/playground-sveltekit/src/app.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="@sveltejs/kit" />
+/// <reference types="next-auth-sveltekit" />
 import type {
   User as NextAuthUser,
   Session as NextAuthSession,
@@ -18,7 +19,8 @@ interface AppSession extends NextAuthSession {
 declare global {
   declare namespace App {
     interface Locals {
-      session: AppSession
+      // session: AppSession
+      getSession: () => Promise<AppSession>
     }
 
     interface Platform {}

apps/playground-sveltekit/src/app.html

@@ -1,12 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%sveltekit.assets%/favicon.png" />
-    <meta name="viewport" content="width=device-width" />
-    %sveltekit.head%
-  </head>
-  <body>
-    <div>%sveltekit.body%</div>
-  </body>
-</html>
+
+<head>
+  <meta charset="utf-8" />
+  <link rel="icon" href="%sveltekit.assets%/favicon.ico" />
+  <meta name="viewport" content="width=device-width" />
+  %sveltekit.head%
+</head>
+
+<body>
+  <div>%sveltekit.body%</div>
+</body>
+
+</html>

apps/playground-sveltekit/src/hooks.server.ts

@@ -1,14 +1,25 @@
-import type { Handle } from "@sveltejs/kit"
-import { getServerSession, options as nextAuthOptions } from "$lib/next-auth"
+import SvelteKitAuth from "@auth/sveltekit"
+import GitHub from '@auth/core/providers/github';
+import Google from '@auth/core/providers/google';
+import Credentials from '@auth/core/providers/credentials';
+import {
+  GITHUB_CLIENT_ID,
+  GITHUB_CLIENT_SECRET,
+  GOOGLE_CLIENT_ID,
+  GOOGLE_CLIENT_SECRET,
+} from "$env/static/private"
 
-export const handle: Handle = async function handle({
-  event,
-  resolve,
-}): Promise<Response> {
-  const session = await getServerSession(event.request, nextAuthOptions)
-  if (session) {
-    event.locals.session = session
-  }
-
-  return resolve(event)
-}
+export const handle = SvelteKitAuth({
+  providers: [
+    GitHub({ clientId: GITHUB_CLIENT_ID, clientSecret: GITHUB_CLIENT_SECRET }),
+    Google({ clientId: GOOGLE_CLIENT_ID, clientSecret: GOOGLE_CLIENT_SECRET }),
+    Credentials({
+      credentials: { password: { label: "Password", type: "password" } },
+      async authorize(credentials) {
+        if (credentials.password !== "pw") return null
+        return { name: "Fill Murray", email: "bill@fillmurray.com", image: "https://www.fillmurray.com/64/64", id: "1", foo: "" }
+      },
+    }),
+  ],
+  debug: true,
+});

apps/playground-sveltekit/src/lib/SignInButton.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+	export let provider: any;
+</script>
+
+<form action={provider.signinUrl} method="POST">
+	{#if provider.callbackUrl}
+		<input type="hidden" name="callbackUrl" value={provider.callbackUrl} />
+	{/if}
+	<button type="submit" class="button">
+		<slot>Sign in with {provider.name}</slot>
+	</button>
+</form>