CHANGELOG.md

@@ -17,16 +17,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 - Possibility to set a default account
 - Dark mode
-- Use the browser's preferred language if available
 
 ### Changed
 - The style has been entirely reworked using Bootstrap instead of Bulma
 - It is now impossible to include the separator in the dedicated name
-- When adding a new account, error messages are displayed alongside each affected elements whenever possible
-
-## Fixed
-- Invalid preferences are now automatically corrected
-- It is now impossible to add the same account twice
 
 
 ## [0.3.0] - 2023-08-25

src/const.js

@@ -1,8 +0,0 @@
-export const allowedColorModes = [
-	'light',
-	'dark',
-];
-export const allowedLocales = [
-	'en',
-	'fr',
-];

src/locales/en.json

@@ -35,7 +35,6 @@
 		"addAccount": "Add account",
 		"cancel": "@:invariants.controls.cancel",
 		"error": {
-			"accountAlreadyExists": "You already have an account on this domain that uses this local part.",
 			"invalidBase64": "The key must be a valid base64 string.",
 			"invalidKeyLength": "The key's length must be either 128 bits (16 bytes) or 256 bits (32 bytes).",
 			"invalidSeparator": "The separator must be a single character.",

src/locales/fr.json

@@ -35,10 +35,9 @@
 		"addAccount": "Ajouter",
 		"cancel": "@:invariants.controls.cancel",
 		"error": {
-			"accountAlreadyExists": "Vous avez déjà un compte sur ce nom de domaine qui utilise cette partie locale.",
 			"invalidBase64": "La clé doit être une chaîne de caractère en base64.",
 			"invalidKeyLength": "La longueur de la clé doit être de 128 bits (16 bytes) ou de 256 bits (32 bytes).",
-			"invalidSeparator": "Le séparateur doit être un unique caractère.",
+			"invalidSeparator": "La séparateur doit être un unique caractère.",
 			"cameraNotAllowed": "L'accès à la caméra n'a pas été autorisé.",
 			"cameraNotFound": "Aucune caméra détectée.",
 			"cameraInsecureContext": "Impossible d'accéder à la caméra depuis une liaison non-sécurisée.",

src/locales_utils.js

@@ -1,19 +0,0 @@
-import { allowedLocales } from './const';
-
-const fallBackValue = 'en';
-
-const getShortLanguageCode = (language) => {
-	language = language.split('-')[0];
-	language = language.split('_')[0];
-	return language;
-};
-
-export const getDefaultLocale = () => {
-	for (const lang of navigator.languages) {
-		const lang_short = getShortLanguageCode(lang);
-		if (allowedLocales.includes(lang_short)) {
-			return lang_short;
-		}
-	}
-	return fallBackValue;
-};

src/main.js

@@ -1,7 +1,5 @@
 import './assets/main.sass';
 
-import { allowedColorModes, allowedLocales } from './const';
-import { getDefaultLocale } from './locales_utils';
 import { createApp } from 'vue';
 import { createI18n } from 'vue-i18n';
 import { useStorage } from '@vueuse/core';
@@ -9,22 +7,19 @@ import App from './App.vue';
 import router from './router';
 import messages from '@intlify/unplugin-vue-i18n/messages';
 
-const setGlobalAttribute = (attrName, storageName, defaultValue, allowedValues) => {
+const setGlobalAttribute = (attrName, storageName, defaultValue) => {
 	const stored_value = useStorage(storageName, '');
 	if (!stored_value.value) {
 		stored_value.value = defaultValue;
 	}
 	document.documentElement.setAttribute(attrName, stored_value.value);
-	if (!allowedValues.includes(stored_value.value)) {
-		stored_value.value = defaultValue;
-	}
 	return {
 		'stored': stored_value,
 		'defaultValue': defaultValue,
 	};
 };
-const locale = setGlobalAttribute('lang', 'sake-locale', getDefaultLocale(), allowedLocales);
+const locale = setGlobalAttribute('lang', 'sake-locale', 'en');
-const colorMode = setGlobalAttribute('data-bs-theme', 'sake-color-mode', 'light', allowedColorModes);
+const colorMode = setGlobalAttribute('data-bs-theme', 'sake-color-mode', 'light');
 
 const i18n = createI18n({
 	legacy: false,

src/views/AddAccountView.vue

@@ -15,12 +15,8 @@ const localPart = ref('');
 const separator = ref('+');
 const domainName = ref('');
 const privateKey = ref('');
-const authorizedKeyLengths = [16, 32];
-
 const errorMessageId = ref('');
-const separatorErrorMessageId = ref('');
+const authorizedKeyLengths = [16, 32];
-const localPartErrorMessageId = ref('');
-const addrKeyErrorMessageId = ref('');
 
 const base64Decode = (str_b64) => {
 	try {
@@ -48,38 +44,18 @@ const addDisabled = computed(() => {
 });
 const addAccount = () => {
 	if (!addDisabled.value) {
-		resetErrorMessage();
-		var hasError = false;
-		var key = null;
-		var accountId = null;
-		if (separator.value.length != 1) {
-			hasError = setErrorMessage('addAccount.error.invalidSeparator', separatorErrorMessageId);
-		}
 		try {
+			if (separator.value.length != 1) {
+				throw new Error('addAccount.error.invalidSeparator');
+			}
 			if (localPart.value.includes(separator.value)) {
 				throw new Error('addAccount.error.localPartSeparator');
 			}
-			accountId = `${localPart.value}@${domainName.value}`;
+			const key = base64Decode(privateKey.value);
-			for (const acc of accounts.value) {
-				const comp = `${acc.localPart}@${acc.domain}`;
-				if (accountId == comp) {
-					throw new Error('addAccount.error.accountAlreadyExists');
-				}
-			}
-		} catch (e) {
-			console.log(e);
-			hasError = setErrorMessage(e.message, localPartErrorMessageId);
-		}
-		try {
-			key = base64Decode(privateKey.value);
 			if (!authorizedKeyLengths.includes(key.length)) {
 				throw new Error('addAccount.error.invalidKeyLength');
 			}
-		} catch (e) {
+			const hash = sha256(`${localPart.value}@${domainName.value}`);
-			hasError = setErrorMessage(e.message, addrKeyErrorMessageId);
-		}
-		if (!hasError && key && accountId) {
-			const hash = sha256(accountId);
 			const newAccount = {
 				id: base32Encode(hash, 'RFC4648', { padding: false }).toLowerCase(),
 				localPart: localPart.value,
@@ -90,6 +66,8 @@ const addAccount = () => {
 			};
 			accounts.value.push(newAccount);
 			return toMainView();
+		} catch (e) {
+			errorMessageId.value = e.message;
 		}
 	}
 };
@@ -141,21 +119,15 @@ const toMainView = () => {
 };
 
 // Error message
-const setErrorMessage = (messageId, messageType) => {
+const setErrorMessage = (messageId) => {
-	const messageIdClean = messageId.startsWith('addAccount.error.') ? messageId : 'addAccount.error.unknown';
+	if (messageId.startsWith('addAccount.error.')) {
-	if (messageType) {
+		errorMessageId.value = messageId;
-		messageType.value = messageIdClean;
 	} else {
-		errorMessageId.value = messageIdClean;
+		errorMessageId.value = 'addAccount.error.unknown';
 	}
-	return true;
 };
 const resetErrorMessage = () => {
 	errorMessageId.value = '';
-
-	separatorErrorMessageId.value = '';
-	localPartErrorMessageId.value = '';
-	addrKeyErrorMessageId.value = '';
 };
 </script>
 
@@ -170,13 +142,11 @@ const resetErrorMessage = () => {
 
 		<div class="mb-3">
 			<label class="form-label" for="new-addr-local-part">{{ $t("addAccount.localPart") }}</label>
-			<input :class="{ 'form-control': true, 'is-invalid': localPartErrorMessageId}" type="text" id="new-addr-local-part" v-model="localPart">
+			<input class="form-control" type="text" id="new-addr-local-part" v-model="localPart">
-			<div class="invalid-feedback" v-if="localPartErrorMessageId">{{ $t(localPartErrorMessageId) }}</div>
 		</div>
 		<div class="mb-3">
 			<label class="form-label" for="new-addr-separator">{{ $t("addAccount.separator") }}</label>
-			<input :class="{ 'form-control': true, 'is-invalid': separatorErrorMessageId}" type="text" id="new-addr-separator" v-model="separator">
+			<input class="form-control" type="text" id="new-addr-separator" v-model="separator">
-			<div class="invalid-feedback" v-if="separatorErrorMessageId">{{ $t(separatorErrorMessageId) }}</div>
 		</div>
 		<div class="mb-3">
 			<label class="form-label" for="new-addr-domain">{{ $t("addAccount.domainName") }}</label>
@@ -185,9 +155,8 @@ const resetErrorMessage = () => {
 		<div class="mb-3">
 			<label class="form-label" for="new-addr-key">{{ $t("addAccount.privateKey") }}</label>
 			<div class="input-group">
-				<input :class="{ 'form-control': true, 'is-invalid': addrKeyErrorMessageId}" type="text" id="new-addr-key" v-model="privateKey">
+				<input class="form-control" type="text" id="new-addr-key" v-model="privateKey">
 				<button class="btn btn-primary" type="button" @click="showQrCodeScanner">{{ $t("addAccount.scan") }}</button>
-				<div class="invalid-feedback" v-if="addrKeyErrorMessageId">{{ $t(addrKeyErrorMessageId) }}</div>
 			</div>
 		</div>