Ability to add external accounts via QR

[vikiival]

Having compatibility with Parity Signer adds huge UX improvement for users.

Easiest lib for reading QR

whole impl

<template>
  <div>
    <p class="error">{{ error }}</p>
    <qrcode-stream @decode="onDecode" @init="onInit" />
  </div>
</template>

<script lang="ts">
import { Component, Prop, PropSync, Vue, Watch, Emit } from 'vue-property-decorator';
// @ts-ignore
import { QrcodeStream } from 'vue-qrcode-reader'
const components = {
 QrcodeStream
}
@Component({
    components
})
export default class QRScanner extends Vue {
    private result: string = '';
    private error: string = '';
    @Emit('decode')
    private onDecode(result: string) {
      return result
    }
    @Emit('error')
    private handleError(error: Error) {
      return error;
    }
    private async onInit(promise: Promise<any>) {
      try {
        await promise
      } catch (error) {
          this.handleError(error);
        if (error.name === 'NotAllowedError') {
          this.error = "ERROR: you need to grant camera access permisson"
        } else if (error.name === 'NotFoundError') {
          this.error = "ERROR: no camera on this device"
        } else if (error.name === 'NotSupportedError') {
          this.error = "ERROR: secure context required (HTTPS, localhost)"
        } else if (error.name === 'NotReadableError') {
          this.error = "ERROR: is the camera already in use?"
        } else if (error.name === 'OverconstrainedError') {
          this.error = "ERROR: installed cameras are not suitable"
        } else if (error.name === 'StreamApiNotSupportedError') {
          this.error = "ERROR: Stream API is not supported in this browser"
        }
      }
    }
}
</script>