From 0bdb4d20211eaaefab4872bffb900afbdd35423c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A2u=20Cao?= Date: Sat, 21 Jan 2023 12:39:14 +0800 Subject: [PATCH] Connect wallet and fill in address during signup In case there's a wallet available, ask the user to connect it and fill in their account address in the form field. Also, check the status code when submitting it to the back-end and show an error message instead of the success/completion page in case the contributor could not be created. --- app/controllers/signup/account.js | 82 ++++++++++++++++--------------- app/routes/signup/account.js | 18 ++++--- 2 files changed, 55 insertions(+), 45 deletions(-) diff --git a/app/controllers/signup/account.js b/app/controllers/signup/account.js index 5bc6863..f22097d 100644 --- a/app/controllers/signup/account.js +++ b/app/controllers/signup/account.js @@ -1,49 +1,53 @@ import Controller from '@ember/controller'; -import { computed } from '@ember/object'; -import { alias, not } from '@ember/object/computed'; -import { isAddress } from 'web3-utils'; import { inject as service } from '@ember/service'; +import { action } from '@ember/object'; +import { alias } from '@ember/object/computed'; +import { tracked } from '@glimmer/tracking'; import config from 'kredits-web/config/environment'; +import { isAddress } from 'web3-utils'; -export default Controller.extend({ +export default class BudgetController extends Controller { + @service kredits; - kredits: service(), + @tracked accountAddress = null; - accountAddress: null, - githubAccessToken: alias('kredits.githubAccessToken'), + @alias('kredits.githubAccessToken') githubAccessToken; - isValidEthAccount: computed('accountAddress', function() { + get isValidEthAccount () { return isAddress(this.accountAddress); - }), - - signupButtonDisabled: not('isValidEthAccount'), - - actions: { - - completeSignup () { - const payload = { - accessToken: this.githubAccessToken, - account: this.accountAddress - } - - fetch(config.githubSignupUrl, { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify(payload) - }) - .then(res => res.json()) - .then(data => { - console.log('Created contributor:', data); - - this.setProperties({ - githubAccessToken: null, - accountAddress: null - }); - - this.transitionToRoute('signup.complete'); - }); - } - } -}); + get signupButtonDisabled () { + return !this.isValidEthAccount; + } + + @action + completeSignup () { + const payload = { + accessToken: this.githubAccessToken, + account: this.accountAddress + } + + fetch(config.githubSignupUrl, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(payload) + }) + .then(res => res.json()) + .then(data => { + if (data.error) { + alert('Creating profile failed. We have been notified about this error and will take a look soon. Sorry!'); + console.warn('Creating contributor profile failed:', + JSON.parse(data.error.body).error.message) + return false; + } else { + console.log('[signup/account] Created contributor:', data); + + this.githubAccessToken = null; + this.accountAddress = null; + + this.transitionToRoute('signup.complete'); + } + }) + } +} diff --git a/app/routes/signup/account.js b/app/routes/signup/account.js index 078a109..9c5d2d3 100644 --- a/app/routes/signup/account.js +++ b/app/routes/signup/account.js @@ -2,16 +2,22 @@ import Route from '@ember/routing/route'; import { inject as service } from '@ember/service'; import { isEmpty } from '@ember/utils'; -export default Route.extend({ +export default class SignupAccountRoute extends Route { + @service kredits; - kredits: service(), + async setupController (controller) { + if (!window.ethereum) return; + + if (this.kredits.hasAccounts) { + controller.accountAddress = this.kredits.currentUserAccounts.firstObject; + } else { + return this.kredits.connectWallet(); + } + } redirect () { - this._super(...arguments); - if (isEmpty(this.kredits.githubAccessToken)) { this.transitionTo('signup.index'); } } - -}); +}