Compare commits
No commits in common. "55ce44aebfda999741106f43ede3f6194831e0f0" and "78ea484a718611fc54881a30edd5b157948ebe86" have entirely different histories.
55ce44aebf
...
78ea484a71
7 changed files with 19 additions and 90 deletions
|
@ -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
|
||||
|
|
|
@ -1,8 +0,0 @@
|
|||
export const allowedColorModes = [
|
||||
'light',
|
||||
'dark',
|
||||
];
|
||||
export const allowedLocales = [
|
||||
'en',
|
||||
'fr',
|
||||
];
|
|
@ -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.",
|
||||
|
|
|
@ -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.",
|
||||
|
|
|
@ -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;
|
||||
};
|
11
src/main.js
11
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 colorMode = setGlobalAttribute('data-bs-theme', 'sake-color-mode', 'light', allowedColorModes);
|
||||
const locale = setGlobalAttribute('lang', 'sake-locale', 'en');
|
||||
const colorMode = setGlobalAttribute('data-bs-theme', 'sake-color-mode', 'light');
|
||||
|
||||
const i18n = createI18n({
|
||||
legacy: false,
|
||||
|
|
|
@ -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 localPartErrorMessageId = ref('');
|
||||
const addrKeyErrorMessageId = ref('');
|
||||
const authorizedKeyLengths = [16, 32];
|
||||
|
||||
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}`;
|
||||
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);
|
||||
const key = base64Decode(privateKey.value);
|
||||
if (!authorizedKeyLengths.includes(key.length)) {
|
||||
throw new Error('addAccount.error.invalidKeyLength');
|
||||
}
|
||||
} catch (e) {
|
||||
hasError = setErrorMessage(e.message, addrKeyErrorMessageId);
|
||||
}
|
||||
if (!hasError && key && accountId) {
|
||||
const hash = sha256(accountId);
|
||||
const hash = sha256(`${localPart.value}@${domainName.value}`);
|
||||
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 messageIdClean = messageId.startsWith('addAccount.error.') ? messageId : 'addAccount.error.unknown';
|
||||
if (messageType) {
|
||||
messageType.value = messageIdClean;
|
||||
const setErrorMessage = (messageId) => {
|
||||
if (messageId.startsWith('addAccount.error.')) {
|
||||
errorMessageId.value = messageId;
|
||||
} 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">
|
||||
<div class="invalid-feedback" v-if="localPartErrorMessageId">{{ $t(localPartErrorMessageId) }}</div>
|
||||
<input class="form-control" type="text" id="new-addr-local-part" v-model="localPart">
|
||||
</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">
|
||||
<div class="invalid-feedback" v-if="separatorErrorMessageId">{{ $t(separatorErrorMessageId) }}</div>
|
||||
<input class="form-control" type="text" id="new-addr-separator" v-model="separator">
|
||||
</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>
|
||||
|
||||
|
|
Loading…
Reference in a new issue