Hardware auth

interface/libraries/encryption.ts

@@ -107,11 +107,8 @@ export const createWebAuthnLogin = async () => {
 		})
 
 		settings.security.hardwareAuthentication = true
+		settings.security.hardwareKey = res.id
 		setSettings(settings)
-
-		console.log(res)
-
-		return "ok"
 	} catch (error) {
 		dialog.message(`Failed to register your authenticator! This feature might not be supported on your machine. \n\n${error}`, { type: "error" })
 
@@ -124,7 +121,7 @@ export const createWebAuthnLogin = async () => {
 /**
  * Get an existing WebAuthn credential
  */
-export const getWebAuthnLogin = async () => {
+export const verifyWebAuthnLogin = async () => {
 	try {
 		const res = await navigator.credentials.get({
 			publicKey: {
@@ -134,9 +131,11 @@ export const getWebAuthnLogin = async () => {
 			},
 		})
 
-		console.log(res)
+		if (res.id !== settings.security.hardwareKey) {
+			dialog.message("Failed to login with your authenticator. The selected hardware key ID does not match the saved key ID.", { type: "error" })
 
-		return "ok"
+			return "error"
+		}
 	} catch (error) {
 		dialog.message(`Failed to login with your authenticator. Please try again! \n\n${error}`, { type: "error" })
 

interface/libraries/types.d.ts

@@ -48,6 +48,7 @@ declare global {
 			requireAuthentication: null | boolean
 			hardwareAuthentication: boolean
 			password: null | string
+			hardwareKey: null | string
 		}
 
 		settings: {

interface/stores/settings.ts

@@ -13,6 +13,7 @@ const defaultSettings: LibSettings = {
 		requireAuthentication: null,
 		hardwareAuthentication: false,
 		password: null,
+		hardwareKey: null,
 	},
 
 	settings: {

interface/styles/index.css

@@ -210,11 +210,11 @@ dialog.hide {
 	cursor: default;
 }
 
-ol {
+.instructions {
 	list-style-type: decimal;
 }
 
-li {
+.instructions > li {
 	padding: 0.3rem;
 	font-size: 18px;
 	margin-left: 20px;

interface/windows/confirm/index.ts

@@ -2,16 +2,23 @@ import { navigate } from "../../libraries/navigate"
 import { getSettings } from "../../stores/settings"
 import { dialog, invoke } from "@tauri-apps/api"
 import { getState, setState } from "../../stores/state"
-import { sendEncryptionKey } from "interface/libraries/encryption"
+import { sendEncryptionKey, verifyWebAuthnLogin } from "interface/libraries/encryption"
 
 export const confirmPassword = async () => {
 	const settings = getSettings()
+	const state = getState()
 	const input = document.querySelector(".passwordInput").value
 
 	const result = await invoke("verify_password", { password: input, hash: Buffer.from(settings.security.password, "base64").toString() })
 
 	if (result === true) {
-		const state = getState()
+		if (settings.security.hardwareAuthentication === true) {
+			const res = await verifyWebAuthnLogin()
+
+			if (res === "error") {
+				return
+			}
+		}
 
 		await sendEncryptionKey(input)
 

interface/windows/export/index.ts

@@ -3,8 +3,7 @@ import { generateTimestamp } from "../../libraries/time"
 import { textConverter } from "../../libraries/convert"
 import { getSettings } from "../../stores/settings"
 import qrcode from "qrcode-generator"
-import { getState } from "interface/stores/state"
-import { decryptData } from "interface/libraries/encryption"
+import { decryptData, verifyWebAuthnLogin } from "interface/libraries/encryption"
 
 let codesArray: LibImportFile
 let codesText: string
@@ -18,6 +17,14 @@ export const exportCodes = async () => {
 	const codes = settings.vault.codes
 
 	if (codes !== null) {
+		if (settings.security.hardwareAuthentication === true) {
+			const res = await verifyWebAuthnLogin()
+
+			if (res === "error") {
+				return
+			}
+		}
+
 		document.querySelector(".saveExportedCodes").style.display = "block"
 		document.querySelector(".exportCodes").style.display = "none"
 

interface/windows/import/import.svelte

@@ -191,7 +191,7 @@
 	<h3>Short tutorial on how to import your codes to Authme from Google Authenticator.</h3>
 
 	<div class="mt-10 flex flex-row space-x-5">
-		<ol>
+		<ol class="instructions">
 			<li>Export the QR codes from the Google Authenticator app: Tap on the three dots on the top right of the screen > Transfer Accounts > Export Accounts</li>
 			<li>Save the two or more QR code with a screenshot or take a picture of them from another phone. Then transfer the pictures to your computer</li>
 			<li>Back to Authme, go to the Import page: Sidebar > Import</li>
@@ -216,7 +216,7 @@
 	<h3>Short tutorial on how to import your codes to Authme from any TOTP 2FA QR code.</h3>
 
 	<div class="mt-10 flex flex-row space-x-5">
-		<ol>
+		<ol class="instructions">
 			<li>Go to the website(s) you want to get the QR codes from</li>
 			<li>Take screenshots (Windows key + Shift + S key combination on Windows) of the QR codes, and save the pictures</li>
 			<li>Back to Authme, go to the Import page: Sidebar > Import</li>

interface/windows/landing/index.ts

@@ -2,13 +2,27 @@ import { navigate } from "../../libraries/navigate"
 import { getSettings, setSettings } from "../../stores/settings"
 import { getState, setState } from "../../stores/state"
 import { dialog, invoke } from "@tauri-apps/api"
-import { setEntry, generateRandomKey, setEncryptionKey } from "interface/libraries/encryption"
+import { setEntry, generateRandomKey, setEncryptionKey, createWebAuthnLogin, verifyWebAuthnLogin } from "interface/libraries/encryption"
 import { search } from "interface/libraries/password"
 
 export const noPassword = async () => {
 	const settings = getSettings()
 	const state = getState()
 
+	if (settings.security.hardwareAuthentication === true) {
+		const createRes = await createWebAuthnLogin()
+
+		if (createRes === "error") {
+			return
+		}
+
+		const loginRes = await verifyWebAuthnLogin()
+
+		if (loginRes === "error") {
+			return
+		}
+	}
+
 	const key = await generateRandomKey()
 
 	await setEntry("encryptionKey", key.toString("base64"))
@@ -48,6 +62,20 @@ export const createPassword = async () => {
 		return dialog.message("This password is on the list of the top 1000 most common passwords. Please choose a more secure password!", { type: "error" })
 	}
 
+	if (settings.security.hardwareAuthentication === true) {
+		const createRes = await createWebAuthnLogin()
+
+		if (createRes === "error") {
+			return
+		}
+
+		const loginRes = await verifyWebAuthnLogin()
+
+		if (loginRes === "error") {
+			return
+		}
+	}
+
 	const password = Buffer.from(await invoke("encrypt_password", { password: input0.value }))
 
 	settings.security.password = password.toString("base64")

interface/windows/settings/settings.svelte

@@ -73,16 +73,6 @@
 			</div>
 		</div>
 
-		<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
-			<div>
-				<h2>Search history</h2>
-				<h3>Save the latest code you searched for. Works even after restart.</h3>
-			</div>
-			<div class="ml-20 flex gap-3">
-				<Toggle bind:checked={$settings.settings.searchHistory} />
-			</div>
-		</div>
-
 		<div class="transparent-800 mb-5 flex w-full flex-row items-center justify-between rounded-xl p-5 text-left">
 			<div>
 				<h2>Codes layout</h2>