sveltekit-auth-example 1.0.13 → 1.0.16

package/.eslintrc.cjs

@@ -17,4 +17,4 @@ module.exports = {
 		es2017: true,
 		node: true
 	}
-};
+}

package/.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

package/.prettierrc

@@ -1,6 +1,9 @@
 {
 	"useTabs": true,
+	"semi": false,
 	"singleQuote": true,
 	"trailingComma": "none",
-	"printWidth": 100
+	"printWidth": 100,
+	"pluginSearchDirs": ["."],
+	"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
 }

package/CHANGELOG.md

@@ -1,5 +1,18 @@
-# Backlog for 1.0.14
+# Backlog
+* Consider not setting defaultUser in loginSession as it would simplify +layout.svelte.
+* Refactor $env/dynamic/private and public
+* Add password complexity checking on /register and /profile pages (only checks for length currently despite what the pages say)
+
+# 1.0.16
+* [Bug] Fixed LayoutServerLoad typing
+
+# 1.0.15
+* [Bug] Replaced use of Action type in +server.ts files (only works for +page.server.ts)
+
+# 1.0.14
 * Refactor routing to be folder, not file-based - https://github.com/sveltejs/kit/discussions/5774 (file system router). More info: https://github.com/sveltejs/kit/discussions/5774#discussioncomment-3294867
+* Move bootstrap SCSS import to JavaScript in +layout.svelte
+* Refactor as session was removed in https://github.com/sveltejs/kit/discussions/5883
 
 # 1.0.13
 * Bump dependencies

package/README.md

@@ -3,31 +3,28 @@
 This is an example of how to register, authenticate, and update users and limit their access to
 areas of the website by role (admin, teacher, student).
 
-It's an SPA built with SvelteKit and a PostgreSQL database back-end. Code is TypeScript and the website is styled using Bootstrap. PostgreSQL functions handle password hashing and UUID generation for the session ID. 
-
-Unlike most authentication examples, this SPA does not use callbacks that redirect back to the site (causing the website to be reloaded with a visual flash). Because of that, **getSession()** in hooks.ts is not useful. Instead, the client makes REST calls, gets the user in the body of the response (if successful) and adds the user to the client-side session store.
+It's a Single Page App (SPA) built with SvelteKit and a PostgreSQL database back-end. Code is TypeScript and the website is styled using Bootstrap. PostgreSQL functions handle password hashing and UUID generation for the session ID. Unlike most authentication examples, this SPA does not use callbacks that redirect back to the site (causing the website to be reloaded with a visual flash).
 
 The website supports two types of authentication:
 1. **Local accounts** via username (email) and password
-   - The login form (/src/routes/login.svelte) sends the login info as JSON to endpoint /auth/login
+   - The login form (/src/routes/login/+page.svelte) sends the login info as JSON to endpoint /auth/login
    - The endpoint passes the JSON to PostgreSQL function authenticate(json) which hashes the password and compares it to the stored hashed password in the users table. The function returns JSON containing a session ID (v4 UUID) and user object (sans password).
-   - The endpoint sends session ID as an httpOnly SameSite cookie and the user object in the body of the response.
-   - The client stores the user object in SvelteKit's session store.
+   - The endpoint sends this session ID as an httpOnly SameSite cookie and the user object in the body of the response.
+   - The client stores the user object in the loginSession store.
+   - Further requests to the server include the session cookie. The hooks.ts handle() method extracts the session cookie, looks up the user and attaches it to RequestEvent.locals so server-side code can check locals.user.role to see if the request is authorized and return an HTTP 401 status if not.
 2. **Sign in with Google**
-   - **Sign in with Google** is initialized in /src/routes/__layout.svelte.
-   - **One Tap** "dialog" is displayed on the Home page (/src/routes/index.svelte) while the **Sign in with Google** button is on the login page (/src/routes/login.svelte).
-   - Clicking either button opens a new window asking the user to authorize this website. If they OK it, a JWT is sent to a callback function.
+   - **Sign in with Google** is initialized in /src/routes/+layout.svelte.
+   - **Google One Tap** prompt is displayed on the initially loaded page unless [Intelligent Tracking Prevention is enabled in the browser](https://developers.google.com/identity/gsi/web/guides/features#upgraded_ux_on_itp_browsers).
+   - **Sign in with Google** button is on the login page (/src/routes/login/+page.svelte) and register page (/src/routes/register/+page.svelte).
+   - Clicking either button opens a new window asking the user to authorize this website. If the user OKs it, a JSON Web Token (JWT) is sent to a callback function.
    - The callback function (in /src/lib/auth.ts) sends the JWT to an endpoint on this server /auth/google.
    - The endpoint decodes and validates the user information then calls the PostgreSQL function start_gmail_user_session to upsert the user to the database returing a session id in an httpOnly SameSite cookie and user in the body of the response.
-   - The client stores the user object in SvelteKit's session store.
-
-As the client calls endpoints, each request to the server includes the session ID in the httpOnly cookie. The handle() function in hooks.ts checks the database for this session ID. If it exists and is not expired, it attaches the user (including role) to request.locals. Each endpoint can then examine request.locals.user.role to determine whether to respond or return a 401.
-
-> There is some overhead to checking the user session in a database each time versus using a JSON web token; however, validating each request avoids problems discussed in [this article](https://redis.com/blog/json-web-tokens-jwt-are-dangerous-for-user-sessions/) and [this one](https://scotch.io/bar-talk/why-jwts-suck-as-session-tokens). For a high-volume website, I would use Redis or the equivalent.
+   - The client stores the user object in the loginSession store.
+   - Further requests to the server work identically to local accounts above.
 
-Pages use the session.user.role to determine whether they are authorized. While a malicious user could alter the client-side session store to see pages they should not, the dynamic data in those restricted pages is served via endpoints which check request.locals.user to determine whether to grant access.
+> There is some overhead to checking the user session in a database each time versus using a JWT; however, validating each request avoids problems discussed in [this article](https://redis.com/blog/json-web-tokens-jwt-are-dangerous-for-user-sessions/) and [this one](https://scotch.io/bar-talk/why-jwts-suck-as-session-tokens). For a high-volume website, I would use Redis or the equivalent.
 
-The forgot password functionality uses SendInBlue to send the email. You would need to have a SendInBlue account and set three environmental variables. Email sending is in /src/routes/auth/forgot.ts. This code could easily be replaced by nodemailer or something similar.
+The forgot password functionality uses [**SendInBlue**](https://www.sendinblue.com) to send the email. You would need to have a **SendInBlue** account and set three environmental variables. Email sending is in /src/routes/auth/forgot.ts. This code could easily be replaced by nodemailer or something similar. Note: I have no affliation with **SendInBlue** (just happen to be familiar with their API because of another project).
 
 ## Prerequisites
 - PostgreSQL 14 or higher
@@ -38,7 +35,7 @@ The forgot password functionality uses SendInBlue to send the email. You would n
 
 ## Setting up the project
 
-Here are the steps using a macOS, Linux or UNIX command-line:
+Here are the steps:
 
 1. Get the project and setup the database
 ```bash
@@ -49,7 +46,7 @@ git clone https://github.com/nstuyvesant/sveltekit-auth-example.git
 cd /sveltekit-auth-example
 npm install
 
-# Create PostgreSQL database
+# Create PostgreSQL database (only works if you installed PostgreSQL)
 psql -d postgres -f db_create.sql
 ```
 
@@ -83,4 +80,4 @@ The db_create.sql script adds three users to the database with obvious roles:
 
 ## My ask of you
 
-Please report any issues or areas where the code can be optimized.
+Please report any issues [here](https://github.com/nstuyvesant/sveltekit-auth-example/issues). [Pull requests](https://github.com/nstuyvesant/sveltekit-auth-example/pulls) are encouraged especially as SvelteKit is evolving rapidly.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sveltekit-auth-example",
   "description": "SvelteKit Authentication Example",
-  "version": "1.0.13",
+  "version": "1.0.16",
   "private": false,
   "author": "Nate Stuyvesant",
   "license": "https://github.com/nstuyvesant/sveltekit-auth-example/blob/master/LICENSE",
@@ -24,48 +24,49 @@
   "scripts": {
     "start": "node build",
     "dev": "vite dev",
-    "serve": "npm run dev -- --open",
     "build": "vite build",
+    "package": "svelte-kit package",
     "preview": "vite preview",
-    "check": "svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. . && eslint --ignore-path .gitignore .",
-    "format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
+		"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 ."
   },
   "engines": {
-    "node": "~18.7.0",
+    "node": "~18.8.0",
     "npm": "^8.18.0"
   },
   "type": "module",
   "dependencies": {
     "cookie": "^0.5.0",
     "dotenv": "^16.0.1",
-    "google-auth-library": "^8.2.0",
+    "google-auth-library": "^8.4.0",
     "jsonwebtoken": "^8.5.1",
-    "pg": "^8.7.3"
+    "pg": "^8.8.0"
   },
   "devDependencies": {
     "@sveltejs/adapter-node": "latest",
-    "@sveltejs/kit": "1.0.0-next.405",
-    "@types/bootstrap": "5.2.2",
+    "@sveltejs/kit": "latest",
+    "@types/bootstrap": "5.2.3",
     "@types/cookie": "^0.5.1",
-    "@types/jsonwebtoken": "^8.5.8",
+    "@types/google.accounts": "0.0.2",
+    "@types/jsonwebtoken": "^8.5.9",
     "@types/pg": "^8.6.5",
-    "@typescript-eslint/eslint-plugin": "^5.33.1",
-    "@typescript-eslint/parser": "^5.33.1",
+    "@typescript-eslint/eslint-plugin": "^5.35.0",
+    "@typescript-eslint/parser": "^5.35.0",
     "bootstrap": "^5.2.0",
     "bootstrap-icons": "^1.9.1",
-    "eslint": "^8.22.0",
+    "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-svelte3": "^4.0.0",
     "prettier": "^2.7.1",
     "prettier-plugin-svelte": "^2.7.0",
-    "sass": "^1.54.4",
+    "sass": "^1.54.5",
     "svelte": "^3.49.0",
-    "svelte-check": "^2.8.1",
+    "svelte-check": "^2.9.0",
     "svelte-preprocess": "^4.10.7",
     "tslib": "^2.4.0",
     "typescript": "^4.7.4",
-    "vite": "^3.0.8"
+    "vite": "^3.0.9"
   }
 }

package/src/app.d.ts

@@ -1,7 +1,9 @@
 /// <reference types="bootstrap" />
+/// <reference types="google.accounts" />
 
-// See https://kit.svelte.dev/docs/typescript
+// See https://kit.svelte.dev/docs/types#app
 // for information about these interfaces
+// and what to do when importing types
 declare namespace App {
 	interface Locals {
     user: User
@@ -9,11 +11,9 @@ declare namespace App {
 
 	// interface Platform {}
 
-	interface Session {
-    user?: User
-  }
+  // interface PrivateEnv {} // $env/dynamic/private
 
-	// interface Stuff {}
+	// interface PublicEnv {} // $env/dynamic/public
 }
 
 type AuthenticationResult = {

package/src/app.html

@@ -4,6 +4,7 @@
 		<meta charset="utf-8" />
 		<link rel="icon" href="/favicon.png" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<script src="https://accounts.google.com/gsi/client" async defer></script>
 		%sveltekit.head%
 	</head>
 	<body>

package/src/hooks.ts

@@ -1,5 +1,5 @@
 import * as cookie from 'cookie'
-import type { Handle, GetSession, RequestEvent } from '@sveltejs/kit'
+import type { Handle, RequestEvent } from '@sveltejs/kit'
 import { query } from './routes/_db'
 
 // Attach authorization to each server request (role may have changed)
@@ -8,7 +8,7 @@ async function attachUserToRequest(sessionId: string, event: RequestEvent) {
     SELECT * FROM get_session($1);`
   const { rows } = await query(sql, [sessionId])
   if (rows?.length > 0) {
-    event.locals.user = rows[0].get_session
+    event.locals.user = <User> rows[0].get_session
   }
 }
 
@@ -27,19 +27,9 @@ export const handle: Handle = async ({ event, resolve }) => {
     await attachUserToRequest(cookies.session, event)
   }
 
-  const response = await resolve(event, {
-		ssr: !event.request.url.includes('/admin')
-	})
+  const response = await resolve(event)
 
   // after endpoint or page is called
   deleteCookieIfNoUser(event, response)
   return response
 }
-
-// Only useful for authentication schemes that redirect back to the website - not
-// an SPA with client-side routing that handles authentication seamlessly
-export const getSession: GetSession = event => {
-  return event.locals.user ?
-    { user: event.locals.user }
-    : {}
-}

package/src/lib/auth.ts

@@ -1,21 +1,13 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
+import type { Page } from '@sveltejs/kit' 
 import type { Readable, Writable } from 'svelte/store'
 import { config } from '$lib/config'
+import { defaultUser } from '../stores'
 
-type Page = Readable<{
-  url: URL;
-  params: Record<string, string>;
-  stuff: App.Stuff;
-  status: number;
-  error: Error | null;
-}>
-
-export default function useAuth(page: Page, session: Writable<any>, goto: (url: string | URL, opts?: { replaceState?: boolean; noscroll?: boolean; keepfocus?: boolean; state?: any; }) => Promise<any>) {
-
-  // Required to use session.set()
-  let sessionValue: App.Session
-  session.subscribe(value => {
-    sessionValue = value
+// eslint-disable-next-line  @typescript-eslint/no-explicit-any
+export default function useAuth(page: Readable<Page>, loginSession: Writable<User>, goto: (url: string | URL, opts?: { replaceState?: boolean; noscroll?: boolean; keepfocus?: boolean; state?: any; }) => Promise<any>) {
+  let user: User
+  loginSession.subscribe(value => {
+    user = value
   })
 
   let referrer: string | null
@@ -23,50 +15,6 @@ export default function useAuth(page: Page, session: Writable<any>, goto: (url:
 		referrer = value.url.searchParams.get('referrer')
 	})
 
-  const loadScript = () => new Promise( (resolve, reject) => {
-    const script = document.createElement('script')
-    script.id = 'gsiScript'
-    script.async = true
-    script.src = 'https://accounts.google.com/gsi/client'
-    script.onerror = (error) => reject(error)
-    script.onload = () => resolve(script)
-    document.body.appendChild(script)
-  })
-
-  function googleAccountsIdInitialize() {
-    return window.google.accounts.id.initialize({
-      client_id: config.googleClientId,
-      callback: googleCallback
-    })
-  }
-
-  function googleAccountsIdRenderButton(htmlId: string) {
-    return window.google.accounts.id.renderButton(
-      document.getElementById(htmlId), {
-        theme: 'filled_blue',
-        size: 'large',
-        width: '367'
-      }
-    )
-  }
-
-  function initializeSignInWithGoogle(htmlId?: string) {
-    googleAccountsIdInitialize()
-
-    if (htmlId) {
-      return googleAccountsIdRenderButton(htmlId)
-    }
-
-    if (!sessionValue.user) window.google.accounts.id.prompt()
-  }
-
-  function setSessionUser(user: User | null) {
-    session.update(s => ({
-      ...s,
-      user
-    }))
-  }
-
   async function googleCallback(response: GoogleCredentialResponse) {
     const res = await fetch('/auth/google', {
       method: 'POST',
@@ -75,38 +23,64 @@ export default function useAuth(page: Page, session: Writable<any>, goto: (url:
       },
       body: JSON.stringify({ token: response.credential })
     })
-    const fromEndpoint = await res.json()
 
     if (res.ok) {
-      session.set({ user: fromEndpoint.user })
+      const fromEndpoint = await res.json()
+      loginSession.set(fromEndpoint.user) // update loginSession store
       const { role } = fromEndpoint.user
       if (referrer) return goto(referrer)
       if (role === 'teacher') return goto('/teachers')
       if (role === 'admin') return goto('/admin')
-      // Don't stay on login if successfully authenticated
-      if (window.location.pathname === '/login') goto('/')
+      if (location.pathname === '/login') goto('/') // logged in so go home
+    }
+  }
+
+  function initializeSignInWithGoogle(htmlId?: string) {
+    const { id } = window.google.accounts // assumes <script src="https://accounts.google.com/gsi/client" async defer></script> is in app.html
+    id.initialize({ client_id: config.googleClientId, callback: googleCallback })
+
+    if (htmlId) { // render button instead of prompt
+      return id.renderButton(
+        document.getElementById(htmlId), {
+          theme: 'filled_blue',
+          size: 'large',
+          width: '367'
+        }
+      )
     }
+
+    if (!user) id.prompt()
+  }
+
+  function setloginSession(user: User | null) {
+    loginSession.update(s => ({
+      ...s,
+      user
+    }))
   }
 
   async function registerLocal(user: User) {
     try {
       const res = await fetch('/auth/register', {
         method: 'POST',
-        body: JSON.stringify(user),
+        body: JSON.stringify(user), // server needs to ignore user.role and always set it to 'student'
         headers: {
           'Content-Type': 'application/json'
         }
       })
-      const fromEndpoint = await res.json()
-      if (res.ok) {
-        session.set({ user: fromEndpoint.user })
-        goto('/')
-      } else {
-        throw new Error(fromEndpoint.message)
+      if (!res.ok)  {
+        if (res.status == 401) // user already existed and passwords didn't match (otherwise, we login the user)
+          throw new Error('Sorry, that username is already in use.')
+        throw new Error(res.statusText) // should only occur if there's a database error
       }
+
+      // res.ok
+      const fromEndpoint = await res.json()
+      loginSession.set(fromEndpoint.user) // update store so user is logged in
+      goto('/')
     } catch (err) {
+      console.error('Register error', err)
       if (err instanceof Error) {
-        console.error('Login error', err)
         throw new Error(err.message)
       }
     }
@@ -123,7 +97,7 @@ export default function useAuth(page: Page, session: Writable<any>, goto: (url:
       })
       const fromEndpoint = await res.json()
       if (res.ok) {
-        setSessionUser(fromEndpoint.user)
+        setloginSession(fromEndpoint.user)
         const { role } = fromEndpoint.user
         if (referrer) return goto(referrer)
         if (role === 'teacher') return goto('/teachers')
@@ -141,16 +115,16 @@ export default function useAuth(page: Page, session: Writable<any>, goto: (url:
   }
 
   async function logout() {
-    // Request server delete httpOnly cookie called session
+    // Request server delete httpOnly cookie called loginSession
     const url = '/auth/logout'
     const res = await fetch(url, {
       method: 'POST'
     })
     if (res.ok) {
-      session.set({}) // delete session.user from 
+      loginSession.set(defaultUser) // delete loginSession.user from 
       goto('/login')
     } else console.error(`Logout not successful: ${res.statusText} (${res.status})`)
   }
 
-  return { loadScript, initializeSignInWithGoogle, registerLocal, loginLocal, logout }
+  return { initializeSignInWithGoogle, registerLocal, loginLocal, logout }
 }

package/src/routes/+error.svelte

@@ -0,0 +1,6 @@
+<script lang="ts" context="module">
+  import { page } from '$app/stores'
+</script>
+
+<h1>{$page.status}</h1>
+<h4>{$page.error?.message}</h4>

package/src/routes/+layout.server.ts

@@ -0,0 +1,9 @@
+import type { LayoutServerLoad } from './$types'
+
+export const load: LayoutServerLoad = (event) => {
+  const locals = event.locals
+  const { user }: { user: User } = locals // locals.user set by hooks.ts/handle(), undefined if not logged in
+  return {
+    user
+  }
+}

package/src/routes/{__layout.svelte → +layout.svelte}

@@ -1,19 +1,26 @@
 <script lang="ts">
   import { onMount } from 'svelte'
+  import type { LayoutServerData } from './$types'
   import { goto } from '$app/navigation'
-  import { page, session } from '$app/stores'
-  import { toast } from '../stores'
+  import { page } from '$app/stores'
+  import { loginSession, toast } from '../stores'
   import useAuth from '$lib/auth'
+  import 'bootstrap/scss/bootstrap.scss' // preferred way to load Bootstrap SCSS for hot module reloading
+
+	export let data: LayoutServerData
+
+  // If returning from different website, runs once (as it's an SPA) to restore user session if session cookie is still valid
+  const { user } = data
+  $loginSession = user
 
   // Vue.js Composition API style
-	const { loadScript, initializeSignInWithGoogle, logout } = useAuth(page, session, goto)
+	const { initializeSignInWithGoogle, logout } = useAuth(page, loginSession, goto)
 
   let Toast: any
 
-  onMount(async() => {
-    await import('bootstrap/js/dist/collapse')
+  onMount(async () => {
+    await import('bootstrap/js/dist/collapse') // lots of ways to load Bootstrap but prefer this approach to avoid SSR issues
     Toast = (await import('bootstrap/js/dist/toast')).default
-		await loadScript()
 		initializeSignInWithGoogle()
 	})
 
@@ -38,11 +45,11 @@
       <div class="navbar-nav">
         <a class="nav-link active" aria-current="page" href="/">Home</a>
         <a class="nav-link" href="/info">Info</a>
-        <a class="nav-link" class:d-none={!$session.user} href="/profile">Profile</a>
-        <a class="nav-link" class:d-none={!$session.user || $session.user?.role !== 'admin'} href="/admin">Admin</a>
-        <a class="nav-link" class:d-none={!$session.user || $session.user?.role === 'student'} href="/teachers">Teachers</a>
-        <a class="nav-link" class:d-none={!!$session.user} href="/login">Login</a>
-        <a on:click|preventDefault={logout} class="nav-link" class:d-none={!$session.user} href={'#'}>Logout</a>
+        <a class="nav-link" class:d-none={!$loginSession || $loginSession.id === 0} href="/profile">Profile</a>
+        <a class="nav-link" class:d-none={!$loginSession || $loginSession?.role !== 'admin'} href="/admin">Admin</a>
+        <a class="nav-link" class:d-none={!$loginSession || $loginSession?.role === 'student'} href="/teachers">Teachers</a>
+        <a class="nav-link" class:d-none={!!$loginSession} href="/login">Login</a>
+        <a on:click|preventDefault={logout} class="nav-link" class:d-none={!$loginSession || $loginSession.id === 0} href={'#'}>Logout</a>
       </div>
     </div>
   </div>
@@ -64,9 +71,6 @@
 </main>
 
 <style lang="scss" global>
-  // Load Bootstrap's SCSS
-  @import 'bootstrap/scss/bootstrap';
-
   // Make Retina displays crisper
   * {
     -webkit-font-smoothing: antialiased;

package/src/routes/admin/+page.server.ts

@@ -0,0 +1,14 @@
+import { redirect } from '@sveltejs/kit'
+import type { PageServerLoad } from './$types'
+
+export const load: PageServerLoad = async ({locals})=> {
+	const { user } = locals
+	const authorized = ['admin']
+	if (user && !authorized.includes(user.role)) {
+		throw redirect(302, '/login?referrer=/admin');
+	}
+
+	return {
+    message: 'Admin-only content from endpoint.'
+  }
+}

package/src/routes/admin/+page.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+	import type { PageData } from './$types'
+	export let data: PageData
+</script>
+
+<svelte:head>
+  <title>Administration</title>
+</svelte:head>
+
+<h1>Admin</h1>
+<h4>Admin Role</h4>
+<p>{data.message}</p>

package/src/routes/api/v1/user/+server.ts

@@ -0,0 +1,21 @@
+import { error, json} from '@sveltejs/kit'
+import type { RequestHandler } from './$types'
+import { query } from '../../../_db'
+
+export const PUT: RequestHandler = async event => {
+  const { user } = event.locals
+
+  if (!user)
+    throw error(401, 'Unauthorized - must be logged-in.')
+
+  try {
+    const userUpdate = await event.request.json()
+    await query(`CALL update_user($1, $2);`, [user.id, JSON.stringify(userUpdate)])
+  } catch (err) {
+    throw error(503, 'Could not communicate with database.')
+  }
+
+  return json({
+    message: 'Successfully updated user profile.'
+  })
+}