refactor: adjust business transaction form validation

__tests__/unit/components/Transaction/TransactionForm/TransactionFormBridgechain/mixin.spec.js

@@ -774,17 +774,17 @@ describe.each([
         expect(wrapper.vm.bridgechainAssetRepositoryError).toBe(null)
       })
 
-      it('should return null if not dirty', () => {
-        wrapper.vm.$v.form.asset.bridgechainAssetRepository.$model = ''
-        wrapper.vm.$v.form.asset.bridgechainAssetRepository.$reset()
-
-        expect(wrapper.vm.$v.form.asset.bridgechainAssetRepository.$dirty).toBe(false)
-        expect(wrapper.vm.$v.form.asset.bridgechainAssetRepository.$invalid).toBe(false)
-        expect(wrapper.vm.bridgechainAssetRepositoryError).toBe(null)
-      })
-
       if (componentName === 'TransactionFormBridgechainRegistration') {
         describe('TransactionFormBridgechainRegistration', () => {
+          it('should return null if not dirty', () => {
+            wrapper.vm.$v.form.asset.bridgechainAssetRepository.$model = ''
+            wrapper.vm.$v.form.asset.bridgechainAssetRepository.$reset()
+
+            expect(wrapper.vm.$v.form.asset.bridgechainAssetRepository.$dirty).toBe(false)
+            expect(wrapper.vm.$v.form.asset.bridgechainAssetRepository.$invalid).toBe(false)
+            expect(wrapper.vm.bridgechainAssetRepositoryError).toBe(null)
+          })
+
           it('should not return error if valid', () => {
             wrapper.vm.$v.form.asset.bridgechainAssetRepository.$model = 'https://github.com/arkecosystem/desktop-wallet.git'
 

__tests__/unit/components/Transaction/TransactionForm/TransactionFormBusiness/TransactionFormBusinessUpdate.spec.js

@@ -153,7 +153,7 @@ describe('TransactionFormBusinessUpdate', () => {
       it('should be enabled if form is valid', async () => {
         wrapper.vm.$v.form.fee.$model = (0.1 * 1e8).toString()
         wrapper.vm.$v.form.passphrase.$model = 'passphrase'
-        wrapper.vm.$v.form.asset.name.$model = 'business'
+        wrapper.vm.$v.form.asset.name.$model = 'new business'
         wrapper.vm.$v.form.asset.website.$model = 'https://ark.io'
         wrapper.vm.$v.form.asset.vat.$model = 'GB12345678'
         wrapper.vm.$v.form.asset.repository.$model = 'https://github.com/arkecosystem/desktop-wallet.git'

__tests__/unit/components/Transaction/TransactionForm/TransactionFormBusiness/mixin.spec.js

@@ -5,6 +5,7 @@ import installI18n from '../../../../__utils__/i18n'
 import TransactionFormBusinessRegistration from '@/components/Transaction/TransactionForm/TransactionFormBusiness/TransactionFormBusinessRegistration'
 import TransactionFormBusinessUpdate from '@/components/Transaction/TransactionForm/TransactionFormBusiness/TransactionFormBusinessUpdate'
 import CurrencyMixin from '@/mixins/currency'
+import StringMixin from '@/mixins/strings'
 import BigNumber from '@/plugins/bignumber'
 
 const localVue = createLocalVue()
@@ -42,6 +43,7 @@ const createWrapper = (component, wallet_fromRoute) => {
     i18n,
     localVue,
     sync: false,
+    mixins: [StringMixin],
     mocks: {
       $client: {
         buildBusinessRegistration: jest.fn((transactionData) => transactionData),
@@ -195,7 +197,7 @@ describe.each([
       it('should be enabled if form is valid', async () => {
         wrapper.vm.$v.form.fee.$model = (0.1 * 1e8).toString()
         wrapper.vm.$v.form.passphrase.$model = 'passphrase'
-        wrapper.vm.$v.form.asset.name.$model = 'business'
+        wrapper.vm.$v.form.asset.name.$model = 'new business'
         wrapper.vm.$v.form.asset.website.$model = 'https://ark.io'
         wrapper.vm.$v.form.asset.vat.$model = 'GB12345678'
         wrapper.vm.$v.form.asset.repository.$model = 'https://github.com/arkecosystem/desktop-wallet.git'
@@ -348,20 +350,24 @@ describe.each([
       })
 
       it('should return null if not dirty', () => {
-        wrapper.vm.$v.form.asset.vat.$model = ''
-        wrapper.vm.$v.form.asset.vat.$reset()
+        if (componentName === 'TransactionFormBusinessRegistration') {
+          wrapper.vm.$v.form.asset.vat.$model = ''
+          wrapper.vm.$v.form.asset.vat.$reset()
 
-        expect(wrapper.vm.$v.form.asset.vat.$dirty).toBe(false)
-        expect(wrapper.vm.$v.form.asset.vat.$invalid).toBe(false)
-        expect(wrapper.vm.vatError).toBe(null)
+          expect(wrapper.vm.$v.form.asset.vat.$dirty).toBe(false)
+          expect(wrapper.vm.$v.form.asset.vat.$invalid).toBe(false)
+          expect(wrapper.vm.vatError).toBe(null)
+        }
       })
 
       it('should return null if empty as not required', () => {
-        wrapper.vm.$v.form.asset.vat.$model = ''
+        if (componentName === 'TransactionFormBusinessRegistration') {
+          wrapper.vm.$v.form.asset.vat.$model = ''
 
-        expect(wrapper.vm.$v.form.asset.vat.$dirty).toBe(true)
-        expect(wrapper.vm.$v.form.asset.vat.$invalid).toBe(false)
-        expect(wrapper.vm.vatError).toBe(null)
+          expect(wrapper.vm.$v.form.asset.vat.$dirty).toBe(true)
+          expect(wrapper.vm.$v.form.asset.vat.$invalid).toBe(false)
+          expect(wrapper.vm.vatError).toBe(null)
+        }
       })
 
       it('should not return error if shorter than max (15)', () => {
@@ -437,12 +443,14 @@ describe.each([
       })
 
       it('should return null if not dirty', () => {
-        wrapper.vm.$v.form.asset.repository.$model = ''
-        wrapper.vm.$v.form.asset.repository.$reset()
+        if (componentName === 'TransactionFormBusinessRegistration') {
+          wrapper.vm.$v.form.asset.repository.$model = ''
+          wrapper.vm.$v.form.asset.repository.$reset()
 
-        expect(wrapper.vm.$v.form.asset.repository.$dirty).toBe(false)
-        expect(wrapper.vm.$v.form.asset.repository.$invalid).toBe(false)
-        expect(wrapper.vm.repositoryError).toBe(null)
+          expect(wrapper.vm.$v.form.asset.repository.$dirty).toBe(false)
+          expect(wrapper.vm.$v.form.asset.repository.$invalid).toBe(false)
+          expect(wrapper.vm.repositoryError).toBe(null)
+        }
       })
 
       it('should not return error if longer than min (12)', () => {
@@ -497,14 +505,20 @@ describe.each([
         wrapper.vm.$v.form.asset.vat.$model = 'GB12345678'
         wrapper.vm.$v.form.asset.repository.$model = 'https://github.com/arkecosystem/desktop-wallet.git'
 
+        let expectedAsset = {
+          name: 'business',
+          website: 'https://ark.io',
+          vat: 'GB12345678',
+          repository: 'https://github.com/arkecosystem/desktop-wallet.git'
+        }
+
+        if (componentName === 'TransactionFormBusinessUpdate') {
+          expectedAsset = {}
+        }
+
         expect(wrapper.vm.getTransactionData()).toEqual({
           address: 'address-1',
-          asset: {
-            name: 'business',
-            website: 'https://ark.io',
-            vat: 'GB12345678',
-            repository: 'https://github.com/arkecosystem/desktop-wallet.git'
-          },
+          asset: expectedAsset,
           passphrase: 'passphrase',
           fee: new BigNumber(0.1 * 1e8),
           wif: undefined,
@@ -528,14 +542,20 @@ describe.each([
         wrapper.vm.$v.form.asset.vat.$model = 'GB12345678'
         wrapper.vm.$v.form.asset.repository.$model = 'https://github.com/arkecosystem/desktop-wallet.git'
 
+        let expectedAsset = {
+          name: 'business',
+          website: 'https://ark.io',
+          vat: 'GB12345678',
+          repository: 'https://github.com/arkecosystem/desktop-wallet.git'
+        }
+
+        if (componentName === 'TransactionFormBusinessUpdate') {
+          expectedAsset = {}
+        }
+
         expect(wrapper.vm.getTransactionData()).toEqual({
           address: 'address-1',
-          asset: {
-            name: 'business',
-            website: 'https://ark.io',
-            vat: 'GB12345678',
-            repository: 'https://github.com/arkecosystem/desktop-wallet.git'
-          },
+          asset: expectedAsset,
           passphrase: 'passphrase',
           secondPassphrase: 'second passphrase',
           fee: new BigNumber(0.1 * 1e8),

src/renderer/components/Transaction/TransactionConfirm/TransactionConfirmBusiness/TransactionConfirmBusinessUpdate.vue

@@ -17,13 +17,15 @@
     </ListDividedItem>
 
     <ListDividedItem
+      v-if="transaction.asset.businessUpdate.name"
       class="TransactionConfirmBusinessUpdate__name"
       :label="$t('WALLET_BUSINESS.NAME')"
     >
       {{ transaction.asset.businessUpdate.name }}
     </ListDividedItem>
 
     <ListDividedItem
+      v-if="transaction.asset.businessUpdate.website"
       class="TransactionConfirmBusinessUpdate__website"
       :label="$t('WALLET_BUSINESS.WEBSITE')"
     >

src/renderer/components/Transaction/TransactionForm/TransactionFormBridgechain/mixin.vue

@@ -266,7 +266,10 @@ export default {
     },
 
     hasSameAssetRepository () {
-      return this.form.asset.bridgechainAssetRepository === this.bridgechain.bridgechainAssetRepository
+      return (
+        this.form.asset.bridgechainAssetRepository === this.bridgechain.bridgechainAssetRepository ||
+        (!this.form.asset.bridgechainAssetRepository && (this.bridgechain.bridgechainAssetRepository === undefined))
+      )
     },
 
     hasSameSeedNodes () {
@@ -343,7 +346,9 @@ export default {
 
     bridgechainAssetRepositoryError () {
       if (this.$v.form.asset.bridgechainAssetRepository.$dirty && this.$v.form.asset.bridgechainAssetRepository.$invalid) {
-        if (!this.$v.form.asset.bridgechainAssetRepository.url) {
+        if (!this.$v.form.asset.bridgechainAssetRepository.required) {
+          return this.$t('VALIDATION.REQUIRED', [this.$t('TRANSACTION.BRIDGECHAIN.BRIDGECHAIN_ASSET_REPOSITORY')])
+        } else if (!this.$v.form.asset.bridgechainAssetRepository.url) {
           return this.$t('VALIDATION.INVALID_URL')
         }
       }
@@ -576,6 +581,9 @@ export default {
         },
 
         bridgechainAssetRepository: {
+          required (value) {
+            return (this.bridgechain && this.bridgechain.bridgechainAssetRepository) ? required(value) : true
+          },
           url (value) {
             return url(value)
           }

src/renderer/components/Transaction/TransactionForm/TransactionFormBusiness/mixin.vue

@@ -100,7 +100,7 @@
       />
 
       <button
-        :disabled="$v.form.$invalid"
+        :disabled="!isFormValid"
         class="TransactionFormBusiness__next blue-button mt-10 ml-0"
         @click="onSubmit"
       >
@@ -161,10 +161,53 @@ export default {
   }),
 
   computed: {
+    business () {
+      return this.wallet_fromRoute.business
+    },
+
+    isUpdate () {
+      return !!this.business
+    },
+
+    hasSameName () {
+      return this.form.asset.name === this.business.name
+    },
+
+    hasSameWebsite () {
+      return this.form.asset.website === this.business.website
+    },
+
+    hasSameVat () {
+      return (
+        this.form.asset.vat === this.business.vat ||
+        (!this.form.asset.vat && (this.business.vat === undefined))
+      )
+    },
+
+    hasSameRepository () {
+      return (
+        this.form.asset.repository === this.business.repository ||
+        (!this.form.asset.repository && (this.business.repository === undefined))
+      )
+    },
+
     nameLabel () {
       return `${this.$t('WALLET_BUSINESS.NAME')} - ${this.$t('VALIDATION.MAX_LENGTH', [maxNameLength])}`
     },
 
+    isFormValid () {
+      if (this.isUpdate) {
+        return !this.$v.form.$invalid && !(
+          this.hasSameName &&
+          this.hasSameWebsite &&
+          this.hasSameVat &&
+          this.hasSameRepository
+        )
+      }
+
+      return !this.$v.form.$invalid
+    },
+
     nameError () {
       if (this.$v.form.asset.name.$dirty && this.$v.form.asset.name.$invalid) {
         if (!this.$v.form.asset.name.required) {
@@ -197,7 +240,9 @@ export default {
 
     vatError () {
       if (this.$v.form.asset.vat.$dirty && this.$v.form.asset.vat.$invalid) {
-        if (!this.$v.form.asset.vat.tooShort) {
+        if (!this.$v.form.asset.vat.required) {
+          return this.$t('VALIDATION.REQUIRED', [this.$t('WALLET_BUSINESS.VAT')])
+        } else if (!this.$v.form.asset.vat.tooShort) {
           return this.$t('VALIDATION.TOO_SHORT', [this.$t('WALLET_BUSINESS.VAT')])
         } else if (!this.$v.form.asset.vat.tooLong) {
           return this.$t('VALIDATION.TOO_LONG', [this.$t('WALLET_BUSINESS.VAT')])
@@ -213,7 +258,9 @@ export default {
 
     repositoryError () {
       if (this.$v.form.asset.repository.$dirty && this.$v.form.asset.repository.$invalid) {
-        if (!this.$v.form.asset.repository.url) {
+        if (!this.$v.form.asset.repository.required) {
+          return this.$t('VALIDATION.REQUIRED', [this.$t('WALLET_BUSINESS.REPOSITORY')])
+        } else if (!this.$v.form.asset.repository.url) {
           return this.$t('VALIDATION.INVALID_URL')
         } else if (!this.$v.form.asset.repository.tooShort) {
           return this.$t('VALIDATION.TOO_SHORT', [this.$t('WALLET_BUSINESS.REPOSITORY')])
@@ -226,9 +273,20 @@ export default {
 
   methods: {
     getTransactionData () {
+      const businessAsset = Object.assign({}, this.form.asset)
+
+      for (const property of Object.keys(this.form.asset)) {
+        if (
+          (this.isUpdate && this[`hasSame${this.strings_capitalizeFirst(property)}`]) ||
+          !businessAsset[property].length
+        ) {
+          delete businessAsset[property]
+        }
+      }
+
       const transactionData = {
         address: this.currentWallet.address,
-        asset: this.form.asset,
+        asset: businessAsset,
         passphrase: this.form.passphrase,
         fee: this.getFee(),
         wif: this.form.wif,
@@ -266,11 +324,17 @@ export default {
         },
 
         vat: {
+          required (value) {
+            return (this.business && this.business.vat) ? required(value) : true
+          },
           tooShort: minLength(minVatLength),
           tooLong: maxLength(maxVatLength)
         },
 
         repository: {
+          required (value) {
+            return (this.business && this.business.repository) ? required(value) : true
+          },
           tooShort: minLength(minRepositoryLength),
           url
         }

src/renderer/components/Wallet/WalletBusiness/WalletBusinessShowBridgechain.vue

@@ -68,6 +68,35 @@
         </a>
       </ListDividedItem>
 
+      <ListDividedItem
+        v-if="bridgechain.bridgechainAssetRepository"
+        :label="$t('WALLET_BUSINESS.BRIDGECHAIN.BRIDGECHAIN_ASSET_REPOSITORY')"
+        class="WalletBusinessShowBridgechain__bridgechain-asset-repo"
+      >
+        <a
+          class="flex items-center whitespace-no-wrap"
+          href="#"
+          @click.stop="electron_openExternal(bridgechain.bridgechainAssetRepository)"
+        >
+          <span
+            v-tooltip="{
+              content: bridgechain.bridgechainAssetRepository,
+              classes: 'text-xs',
+              trigger: 'hover'
+            }"
+            class="WalletBusinessShowBridgechain__bridgechain-asset-repo__item mr-1"
+          >
+            {{ bridgechain.bridgechainAssetRepository }}
+          </span>
+
+          <SvgIcon
+            name="open-external"
+            view-box="0 0 12 12"
+            class="text-theme-page-text-light"
+          />
+        </a>
+      </ListDividedItem>
+
       <ListDividedItem
         :label="$t('WALLET_BUSINESS.BRIDGECHAIN.API_PORT')"
         :value="bridgechain.ports['@arkecosystem/core-api']"