This commit is contained in:
Danil Kovtonyuk 2022-04-22 13:05:56 +10:00
commit 44f31f8b9f
No known key found for this signature in database
GPG key ID: E72A919BF08C3746
402 changed files with 47865 additions and 0 deletions

View file

@ -0,0 +1,84 @@
<template>
<div class="modal-card box box-modal">
<header class="box-modal-header is-spaced">
<div class="box-modal-title">{{ $parent.$t('account.modals.decryptInfo.title') }}</div>
<button type="button" class="delete" @click="$emit('close')" />
</header>
<div class="note">{{ $parent.$t('account.modals.decryptInfo.description') }}</div>
<div class="account-decrypt-info">
<div class="item">
{{ $parent.$t('account.modals.decryptInfo.spent') }}
<span class="has-text-weight-bold mr-3">{{ spent }}</span>
</div>
<div class="item">
{{ $parent.$t('account.modals.decryptInfo.unSpent') }}
<span class="has-text-weight-bold mr-3">{{ unSpent }}</span>
</div>
<template v-for="(instances, currency) in getStatistic">
<div v-for="(amount, instance) in instances" :key="`${amount}_${currency}_${instance}`" class="item">
{{ instance }} {{ getSymbol(currency) }}:
<span class="has-text-weight-bold mr-3">{{ amount }}</span>
</div>
</template>
</div>
<div class="buttons buttons__halfwidth mt-3">
<b-button type="is-primary" outlined @click="onClose">
{{ $parent.$t('account.modals.decryptInfo.close') }}
</b-button>
<b-button type="is-primary" @click="handleRedirect">
{{ $parent.$t('account.modals.decryptInfo.redirect') }}
</b-button>
</div>
</div>
</template>
<script>
import { statisticComputed } from '../injectors'
export default {
props: {
all: {
type: Number,
required: true
},
spent: {
type: Number,
required: true
},
unSpent: {
type: Number,
required: true
}
},
data() {
return {}
},
computed: {
...statisticComputed,
getStatistic() {
const balance = this.statistic.reduce((acc, { currency, amount }) => {
if (acc[currency] && acc[currency][amount]) {
acc[currency][amount] += 1
} else {
acc[currency] = {
...acc[currency],
[amount]: 1
}
}
return acc
}, {})
return balance
}
},
methods: {
onClose() {
this.$emit('close')
},
handleRedirect() {
this.$router.push('/')
this.$emit('close')
}
}
}
</script>

View file

@ -0,0 +1,90 @@
<template>
<div class="modal-card box box-modal">
<header class="box-modal-header is-spaced">
<div class="box-modal-title">{{ $t('account.modals.recoverAccount.title') }}</div>
<button type="button" class="delete" @click="$emit('close')" />
</header>
<div class="note">
{{ $t('account.modals.recoverAccount.description') }}
</div>
<div class="field">
<b-input
v-model="recoveryKey"
type="textarea"
class="is-disabled-resize"
rows="2"
:placeholder="$t('enterRecoveryKey')"
:class="{ 'is-warning': hasAndValidKey }"
@input="onInput"
></b-input>
<p v-show="hasAndValidKey" class="help is-warning">
{{ $t('account.modals.recoverAccount.warning') }}
</p>
</div>
<b-notification
v-if="recoverAccountFromKeyRequest.isError"
class="main-notification"
type="is-warning"
:closable="false"
>
{{ recoverAccountFromKeyRequest.errorMessage }}
</b-notification>
<b-button
type="is-primary is-fullwidth"
:disabled="hasAndValidKey"
:loading="recoverAccountFromKeyRequest.isFetching"
@click="handleRecoverAccount"
>
{{ $t('account.modals.recoverAccount.connect') }}
</b-button>
</div>
</template>
<script>
import { recoverAccountComputed, recoverAccountMethods } from '../injectors'
import { debounce } from '@/utils'
export default {
props: {
getNotes: {
required: true,
type: Function
}
},
data() {
return {
recoveryKey: '',
isValidRecoveryKey: true
}
},
computed: {
...recoverAccountComputed,
hasAndValidKey() {
return this.recoveryKey && !this.isValidRecoveryKey
}
},
beforeDestroy() {
this.clearState({ key: 'recoverAccountFromKey' })
},
methods: {
...recoverAccountMethods,
async handleRecoverAccount() {
await this.recoverAccountFromKey({ recoveryKey: this.recoveryKey })
this.$emit('close')
await this.getNotes()
},
onInput(recoveryKey) {
this.clearState({ key: 'recoverAccountFromKey' })
debounce(this.checkPrivateKey, recoveryKey)
},
checkPrivateKey(recoveryKey) {
try {
this.$provider.web3.eth.accounts.privateKeyToAccount(recoveryKey)
this.isValidRecoveryKey = true
} catch {
this.isValidRecoveryKey = false
}
}
}
}
</script>

View file

@ -0,0 +1,71 @@
<template>
<div class="modal-card">
<header class="modal-card-head">
<div class="modal-card-title">{{ $parent.$t('account.modals.checkRecoveryKey.title') }}</div>
</header>
<section class="modal-card-body">
<div class="media">
<div class="media-content">
{{
isShow
? $parent.$t('account.modals.checkRecoveryKey.inactiveDescription')
: $parent.$t('account.modals.checkRecoveryKey.description')
}}
</div>
</div>
</section>
<footer v-if="isShow" class="modal-card-foot">
<b-button type="is-primary" outlined @click="$emit('close')">
{{ $parent.$t('close') }}
</b-button>
</footer>
<footer v-else class="modal-card-foot">
<b-button type="is-primary" outlined @click="_onCancel">
{{ $parent.$t('account.modals.checkRecoveryKey.no') }}
</b-button>
<b-button type="is-primary" @click="_onConfirm">
{{ $parent.$t('account.modals.checkRecoveryKey.yes') }}
</b-button>
</footer>
</div>
</template>
<script>
export default {
props: {
onCancel: {
type: Function,
required: true
},
onConfirm: {
type: Function,
required: true
}
},
data() {
return {
timer: null,
isShow: false
}
},
beforeDestroy() {
clearTimeout(this.timer)
},
mounted() {
this.timer = setTimeout(() => {
this.onCancel()
this.isShow = true
}, 1000 * 60)
},
methods: {
_onCancel() {
this.onCancel()
this.$emit('close')
},
_onConfirm() {
this.onConfirm()
this.$emit('close')
}
}
}
</script>

View file

@ -0,0 +1,134 @@
<template>
<div class="modal-card box box-modal">
<header class="box-modal-header is-spaced">
<div class="box-modal-title">{{ $t('account.modals.setupAccount.title') }}</div>
<button type="button" class="delete" @click="$emit('close')" />
</header>
<div class="note">{{ $t('account.modals.setupAccount.description') }}</div>
<div class="field">
<div class="label-with-buttons">
<div class="label">{{ $t('account.modals.setupAccount.label') }}</div>
<b-button v-clipboard:copy="recoveryKey" v-clipboard:success="onCopy" type="is-primary-text">
{{ $t('copy') }}
</b-button>
</div>
<div class="notice is-recovery-key">
<div class="notice__p">{{ recoveryKey }}</div>
</div>
</div>
<b-notification class="main-notification" type="is-info" :closable="false">
{{ $t('account.modals.setupAccount.isNotSupportedWithHw') }}
</b-notification>
<b-checkbox v-model="isSaveOnChain" :disabled="isPartialSupport">{{
$t('account.modals.setupAccount.saveOnChain')
}}</b-checkbox>
<b-checkbox v-if="!isSaveOnChain" v-model="isBackuped">{{
$t('account.modals.setupAccount.backedUp')
}}</b-checkbox>
<b-notification
v-if="!isSaveOnChain && warningMessage"
class="main-notification"
type="is-warning"
:closable="false"
>
{{ warningMessage }}
</b-notification>
<b-notification
v-if="setupAccountRequest.isError"
class="main-notification"
type="is-warning"
:closable="false"
>
{{ setupAccountRequest.errorMessage }}
</b-notification>
<b-button
v-if="!isBackuped && isSaveOnChain"
type="is-primary is-fullwidth"
:loading="setupAccountRequest.isFetching"
@click="onSetupAccount"
>
{{ $t('account.modals.setupAccount.setupAccount') }}
</b-button>
<b-button v-else type="is-primary is-fullwidth" :disabled="!isBackuped" @click="setAccount">
{{ $t('account.modals.setupAccount.setAccount') }}
</b-button>
</div>
</template>
<script>
import { setupMethods, setupComputed } from '../injectors'
export default {
data() {
return {
timer: null,
recoveryKey: '',
isBackuped: false,
isSaveOnChain: true,
warningMessage: ''
}
},
computed: {
...setupComputed
},
watch: {
isSaveOnChain() {
if (this.isSaveOnChain) {
this.isBackuped = false
}
}
},
beforeUpdate() {
if (this.setupAccountRequest.isSuccess) {
this.$parent.close()
}
},
mounted() {
this.recoveryKey = this.$provider.web3.eth.accounts.create().privateKey.slice(2)
if (this.isPartialSupport) {
this.isSaveOnChain = false
}
this.timer = setTimeout(() => {
this.saveRecoveryKeyOnFile({ recoveryKey: this.recoveryKey })
}, 1500)
},
beforeDestroy() {
clearTimeout(this.timer)
this.clearState({ key: 'setupAccount' })
},
methods: {
...setupMethods,
onCopy() {
this.addNoticeWithInterval({
notice: {
title: 'copied',
type: 'info'
},
interval: 2000
})
},
async setAccount() {
try {
await this.recoverAccountFromKey({ recoveryKey: this.recoveryKey })
this.$emit('close')
} catch (err) {
this.warningMessage = err.message
}
},
async onSetupAccount() {
if (!this.isSaveOnChain) {
this.warningMessage = this.$t('account.modals.setupAccount.yourRecoveryKeyWontBeSaved')
return
}
try {
await this.setupAccount({ privateKey: this.recoveryKey })
} catch (err) {
this.warningMessage = err.message
}
}
}
}
</script>

View file

@ -0,0 +1,55 @@
<template>
<div class="modal-card box box-modal">
<header class="box-modal-header is-spaced">
<div class="box-modal-title">{{ $t('account.modals.showRecoveryKey.title') }}</div>
<button type="button" class="delete" @click="$emit('close')" />
</header>
<div class="note">{{ $t('account.modals.showRecoveryKey.description') }}</div>
<div class="field">
<div class="label-with-buttons">
<div class="label"></div>
<b-button v-clipboard:copy="recoveryKey" v-clipboard:success="onCopy" type="is-primary-text">
{{ $t('copy') }}
</b-button>
</div>
<div class="notice is-recovery-key">
<div class="notice__p">{{ recoveryKey }}</div>
</div>
</div>
<b-button type="is-primary" outlined @click="onClose">
{{ $t('account.modals.showRecoveryKey.close') }}
</b-button>
</div>
</template>
<script>
import { showRecoveryKeyMethods } from '../injectors'
export default {
props: {
recoveryKey: {
type: String,
required: true
}
},
data() {
return {}
},
computed: {},
methods: {
...showRecoveryKeyMethods,
onClose() {
this.$emit('close')
},
onCopy() {
this.addNoticeWithInterval({
notice: {
title: 'copied',
type: 'info'
},
interval: 2000
})
}
}
}
</script>

View file

@ -0,0 +1,66 @@
import { ModalProgrammatic, DialogProgrammatic } from 'buefy'
import { Settings } from '../dependencies'
import DecryptInfo from './DecryptInfo.vue'
import SetupAccount from './SetupAccount.vue'
import SessionUpdate from './SessionUpdate.vue'
import RecoverAccount from './RecoverAccount.vue'
import ShowRecoverKey from './ShowRecoverKey.vue'
const openSettingsModal = ({ parent, ...props }) => {
createModal({ props, parent, component: Settings })
}
const openSetupAccountModal = ({ parent, ...props }) => {
createModal({ props, parent, component: SetupAccount, canCancel: false })
}
const openDecryptModal = ({ parent, ...props }) => {
createModal({ props, parent, component: DecryptInfo })
}
const openRecoverAccountModal = ({ parent, ...props }) => {
createModal({ props, parent, component: RecoverAccount })
}
const openShowRecoverKeyModal = ({ parent, ...props }) => {
createModal({ props, parent, component: ShowRecoverKey })
}
function createModal({ component, props, parent, ...rest }) {
ModalProgrammatic.open({
props,
parent,
component,
width: 440,
hasModalCard: true,
customClass: 'is-pinned',
...rest
})
}
const openRemoveAccountModal = ({ i18n, onConfirm }) => {
DialogProgrammatic.confirm({
onConfirm,
title: i18n.t('account.modals.removeAccount.title'),
type: 'is-primary is-outlined',
message: i18n.t('account.modals.removeAccount.description'),
cancelText: i18n.t('account.modals.removeAccount.cancel'),
confirmText: i18n.t('account.modals.removeAccount.remove')
})
}
const openConfirmModal = ({ parent, ...props }) => {
createModal({ props, parent, component: SessionUpdate, customClass: 'dialog' })
}
export {
openDecryptModal,
openConfirmModal,
openSettingsModal,
openSetupAccountModal,
openRemoveAccountModal,
openShowRecoverKeyModal,
openRecoverAccountModal
}