sveltekit-auth-example 1.0.6 → 1.0.9

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+# 1.0.9
+* Bump dependencies
+* Adjust for changes to SvelteKit with respect to vite
+
+# 1.0.7
+* Bump dependencies and verify against latest SvelteKit
+* Additional changes for register PostgreSQL function
+
 # 1.0.5
 * Bump dependencies
 * [Fix] Flaw in register allowing user to register over top of an existing account

package/README.md

@@ -30,9 +30,9 @@ Pages use the session.user.role to determine whether they are authorized. While
 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.
 
 ## Prerequisites
-- PostgreSQL 13 or higher
-- Node.js 16.13.0 or higher
-- npm 8.1.0 or higher
+- PostgreSQL 14 or higher
+- Node.js 16.16.0 or higher
+- npm 8.14.0 or higher
 - Google API client
 - SendInBlue account (only used for emailing password reset link - the sample can run without it but forgot password will not work)
 
@@ -53,7 +53,7 @@ npm install
 psql -d postgres -f db_create.sql
 ```
 
-2. Create a **Google API client ID** per [these instructions](https://developers.google.com/identity/gsi/web/guides/get-google-api-clientid).
+2. Create a **Google API client ID** per [these instructions](https://developers.google.com/identity/gsi/web/guides/get-google-api-clientid). Make sure you include `http://localhost:3000`, `http://localhost` in the Authorized JavaScript origins and `http://localhost:3000/auth/google/callback` in the Authorized redirect URIs for your Client ID for Web application. ** Do not access the site using http://127.0.0.1:3000 ** - use `http://localhost:3000` or it will not work.
 
 3. Create an **.env** file at the top level of the project with the following values (substituting your own id and PostgreSQL username and password):
 ```bash
@@ -83,4 +83,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. I am still learning Svelte and SvelteKit. All feedback is appreciated.
+Please report any issues or areas where the code can be optimized.

package/db_create.sql

@@ -182,15 +182,17 @@ DECLARE
   input_phone varchar(23) := TRIM((input->>'phone')::varchar);
   input_password varchar(80) := (input->>'password')::varchar;
 BEGIN
-  SELECT json_build_object('id', create_session(users.id), 'user', json_build_object('id', users.id, 'role', users.role, 'email', input_email, 'firstName', users.first_name, 'lastName', users.last_name, 'phone', users.phone)) INTO user_session FROM users WHERE email = input_email;
+  PERFORM id FROM users WHERE email = input_email;
   IF NOT FOUND THEN
     INSERT INTO users(role, password, email, first_name, last_name, phone)
-      VALUES('student', crypt(input_password, input_password), input_email, input_first_name, input_last_name, input_phone)
+      VALUES('student', crypt(input_password, gen_salt('bf', 8)), input_email, input_first_name, input_last_name, input_phone)
       RETURNING
         json_build_object(
           'sessionId', create_session(users.id),
-          'user', json_build_object('id', users.id, 'role', 'student', 'email', input_email, 'firstName', input_first_name, 'lastName', input_last_name, 'phone', input_phone)
+          'user', json_build_object('id', users.id, 'role', 'student', 'email', input_email, 'firstName', input_first_name, 'lastName', input_last_name, 'phone', input_phone, 'optOut', false)
         ) INTO user_session;
+  ELSE -- user is registering account that already exists so set sessionId and user to null so client can let them know
+  	SELECT authenticate(input) INTO user_session;
   END IF;
 END;
 $BODY$;
@@ -210,7 +212,7 @@ DECLARE
   input_first_name varchar(20) := TRIM((input->>'firstName')::varchar);
   input_last_name varchar(20) := TRIM((input->>'lastName')::varchar);
 BEGIN
-  PERFORM id FROM users WHERE email = input_email;
+  SELECT json_build_object('id', create_session(users.id), 'user', json_build_object('id', users.id, 'role', users.role, 'email', input_email, 'firstName', users.first_name, 'lastName', users.last_name, 'phone', users.phone)) INTO user_session FROM users WHERE email = input_email;
   IF NOT FOUND THEN
     INSERT INTO users(role, email, first_name, last_name)
       VALUES('student', input_email, input_first_name, input_last_name)
@@ -219,8 +221,6 @@ BEGIN
           'id', create_session(users.id),
           'user', json_build_object('id', users.id, 'role', 'student', 'email', input_email, 'firstName', input_first_name, 'lastName', input_last_name, 'phone', null)
         ) INTO user_session;
-  ELSE
-    SELECT authenticate(input) INTO user_session;
   END IF;
 END;
 $BODY$;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sveltekit-auth-example",
   "description": "SvelteKit Authentication Example",
-  "version": "1.0.6",
+  "version": "1.0.9",
   "private": false,
   "author": "Nate Stuyvesant",
   "license": "https://github.com/nstuyvesant/sveltekit-auth-example/blob/master/LICENSE",
@@ -22,24 +22,25 @@
     "example"
   ],
   "scripts": {
-    "dev": "svelte-kit dev",
+    "start": "node build",
+    "dev": "vite dev",
     "serve": "npm run dev -- --open",
-    "build": "svelte-kit build",
-    "preview": "svelte-kit preview",
+    "build": "vite build",
+    "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=. ."
   },
   "engines": {
-    "node": "~16.14.2",
-    "npm": "^8.8.0"
+    "node": "~16.16.0",
+    "npm": "^8.14.0"
   },
   "type": "module",
   "dependencies": {
     "cookie": "^0.5.0",
-    "dotenv": "^16.0.0",
-    "google-auth-library": "^8.0.1",
+    "dotenv": "^16.0.1",
+    "google-auth-library": "^8.1.1",
     "jsonwebtoken": "^8.5.1",
     "pg": "^8.7.3",
     "pg-native": "^3.0.0"
@@ -47,22 +48,24 @@
   "devDependencies": {
     "@sveltejs/adapter-node": "latest",
     "@sveltejs/kit": "latest",
+    "@types/cookie": "^0.5.1",
     "@types/jsonwebtoken": "^8.5.8",
     "@types/pg": "^8.6.5",
-    "@typescript-eslint/eslint-plugin": "^5.21.0",
-    "@typescript-eslint/parser": "^5.21.0",
+    "@typescript-eslint/eslint-plugin": "^5.30.6",
+    "@typescript-eslint/parser": "^5.30.6",
     "bootstrap": "^5.1.3",
-    "bootstrap-icons": "^1.8.1",
-    "eslint": "^8.14.0",
+    "bootstrap-icons": "^1.9.0",
+    "eslint": "^8.19.0",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-svelte3": "^3.4.1",
-    "prettier": "^2.6.2",
+    "eslint-plugin-svelte3": "^4.0.0",
+    "prettier": "^2.7.1",
     "prettier-plugin-svelte": "^2.7.0",
-    "sass": "^1.51.0",
-    "svelte": "^3.47.0",
-    "svelte-check": "^2.7.0",
-    "svelte-preprocess": "^4.10.6",
+    "sass": "^1.53.0",
+    "svelte": "^3.49.0",
+    "svelte-check": "^2.8.0",
+    "svelte-preprocess": "^4.10.7",
     "tslib": "^2.4.0",
-    "typescript": "^4.6.3"
+    "typescript": "^4.7.4",
+    "vite": "^3.0.0"
   }
 }

package/src/app.html

@@ -4,9 +4,9 @@
 		<meta charset="utf-8" />
 		<link rel="icon" href="/favicon.png" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
-		%svelte.head%
+		%sveltekit.head%
 	</head>
 	<body>
-		<div id="svelte">%svelte.body%</div>
+		<div id="svelte">%sveltekit.body%</div>
 	</body>
-</html>
+</html>

package/svelte.config.js

@@ -5,6 +5,7 @@ const production = process.env.NODE_ENV === 'production'
 
 const baseCsp = [
 	'self',
+	'ws://127.0.0.1:3000/',
 	// 'strict-dynamic', // issues with datepicker on classes, add to calendar scripts
 	'https://www.gstatic.com/recaptcha/', // recaptcha
 	'https://accounts.google.com/gsi/', // sign-in w/google
@@ -33,11 +34,6 @@ const config = {
 				'base-uri': ['self'],
 				// 'require-trusted-types-for': ["'script'"] // will require effort to get this working
 			}
-		},
-		vite: {
-			serviceWorker: {
-				files: (filepath) => !/\.DS_Store/.test(filepath)
-			}
 		}
 	}
 }

package/tsconfig.json

@@ -1,32 +1,13 @@
 {
 	"extends": "./.svelte-kit/tsconfig.json",
 	"compilerOptions": {
-		"moduleResolution": "node",
-		"module": "es2020",
-		"lib": ["es2020", "DOM"],
-		"target": "es2019",
-		/**
-			svelte-preprocess cannot figure out whether you have a value or a type, so tell TypeScript
-			to enforce using \`import type\` instead of \`import\` for Types.
-			*/
-		"importsNotUsedAsValues": "error",
-		"isolatedModules": true,
-		"resolveJsonModule": true,
-		/**
-			To have warnings/errors of the Svelte compiler at the correct position,
-			enable source maps by default.
-			*/
-		"sourceMap": true,
-		"esModuleInterop": true,
-		"skipLibCheck": true,
-		"forceConsistentCasingInFileNames": true,
-		"baseUrl": ".",
 		"allowJs": true,
 		"checkJs": true,
-		"paths": {
-			"$lib": ["src/lib"],
-			"$lib/*": ["src/lib/*"]
-		}
-	},
-	"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.ts", "src/**/*.svelte"]
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true
+	}
 }

package/vite.config.js

@@ -0,0 +1,16 @@
+import { sveltekit } from '@sveltejs/kit/vite'
+
+/** @type {import('vite').UserConfig} */
+const config = {
+	plugins: [sveltekit()],
+	serviceWorker: {
+		files: (filepath) => !/\.DS_Store/.test(filepath)
+	},
+	server: {
+		host: 'localhost',
+		port: 3000,
+		open: 'http://localhost:3000'
+	}
+}
+
+export default config