No password auth

interface/windows/landing/index.ts

@@ -0,0 +1,23 @@
+import { navigate } from "../../../libraries/navigate"
+import { generateRandomKey, generateSalt } from "../../../libraries/auth"
+import { getSettings, setSettings } from "../../stores/settings"
+import { getState, setState } from "../../stores/state"
+
+export const noPassword = async () => {
+	const settings = getSettings()
+	const state = getState()
+
+	const key = generateSalt()
+	const password = await generateRandomKey(key)
+
+	settings.security.key = key.toString("base64")
+	settings.security.password = password.toString("base64")
+	settings.security.requireAuthentication = false
+
+	state.authenticated = true
+
+	setSettings(settings)
+	setState(state)
+
+	navigate("codes")
+}

interface/windows/landing.svelte → interface/windows/landing/landing.svelte

@@ -23,7 +23,7 @@
 				<h4 data-loc class="mb-3">No password</h4>
 				<h5 data-loc class="mb-3">If you don't want to type in your password every time you launch Authme.</h5>
 
-				<button class="button">
+				<button class="button" on:click={noPassword}>
 					<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
 						<path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
 					</svg>
@@ -50,7 +50,7 @@
 	</div>
 </div>
 
-<div class="transparent-900 m-auto mt-40 mb-60 w-3/5 rounded-2xl p-10 text-center">
+<div class="transparent-900 m-auto mt-40 mb-60 hidden w-3/5 rounded-2xl p-10 text-center">
 	<h1>Require password</h1>
 
 	<div class="mx-auto flex w-4/5 flex-col items-center justify-center rounded-2xl p-10">
@@ -158,7 +158,9 @@
 </div>
 
 <script lang="ts">
-	import Details from "../components/details.svelte"
+	import { noPassword } from "./index"
+
+	import Details from "../../components/details.svelte"
 
 	const showPassword = (id: number) => {
 		const inputState = document.querySelector(`.passwordInput${id}`).getAttribute("type")

libraries/crypto.ts → libraries/auth.ts

@@ -1,4 +1,5 @@
 import crypto from "crypto"
+import { scrypt } from "scrypt-js"
 
 const ALGORITHM = {
 	BLOCK_CIPHER: "aes-256-gcm",
@@ -21,9 +22,9 @@ export const generateSalt = (): Buffer => {
  * @param {Buffer|string} salt
  * @return {Buffer} key
  */
-export const generateRandomKey = (salt: Buffer | string): Buffer => {
+export const generateRandomKey = async (salt: Buffer): Promise<Buffer> => {
 	const key = crypto.randomBytes(ALGORITHM.KEY_BYTE_LEN)
-	return crypto.scryptSync(key, salt, ALGORITHM.KEY_BYTE_LEN)
+	return Buffer.from(await scrypt(key, salt, 16384, 8, 1, ALGORITHM.KEY_BYTE_LEN))
 }
 
 /**
@@ -32,8 +33,8 @@ export const generateRandomKey = (salt: Buffer | string): Buffer => {
  * @param {Buffer} salt
  * @return {Buffer} key
  */
-export const generateKey = (password: Buffer, salt: Buffer): Buffer => {
-	return crypto.scryptSync(password, salt, ALGORITHM.KEY_BYTE_LEN)
+export const generateKey = async (password: Buffer, salt: Buffer): Promise<Buffer> => {
+	return Buffer.from(await scrypt(password, salt, 16384, 8, 1, ALGORITHM.KEY_BYTE_LEN))
 }
 
 /**

libraries/types.d.ts

@@ -26,6 +26,19 @@ declare global {
 		type?: string
 	}
 
+	interface LibState {
+		authenticated: boolean
+		importData: null | boolean
+	}
+
+	interface LibSettings {
+		security: {
+			requireAuthentication: null | boolean
+			password: null | string
+			key: null | string
+		}
+	}
+
 	/** Query selector element types */
 	interface Element {
 		/** Element styles */

package.json

@@ -47,6 +47,7 @@
 		"otpauth": "^8.0.1",
 		"protocol-buffers": "^5.0.0",
 		"qrcode-decoder": "^0.2.2",
+		"scrypt-js": "^3.0.1",
 		"svelte": "^3.49.0"
 	}
 }