From ee5017d517f5aeb6a237046fec1a65e43ed2705c Mon Sep 17 00:00:00 2001
From: aeddaqqa <achrafeddaqqaq@gmail.com>
Date: Fri, 9 Aug 2024 01:28:55 +0100
Subject: [PATCH 1/3] fix(style): fix Wallet Switcher Name Shrinks Despite
 Available Space

---
 src/components/wallet/manage/KeyRow.vue       | 40 ++++++++++++++++++-
 src/components/wallet/manage/MyKeys.vue       |  5 ++-
 .../wallet/manage/mountKyesComponent.ts       |  2 +-
 3 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/src/components/wallet/manage/KeyRow.vue b/src/components/wallet/manage/KeyRow.vue
index 494161d05..6c8b5c451 100644
--- a/src/components/wallet/manage/KeyRow.vue
+++ b/src/components/wallet/manage/KeyRow.vue
@@ -29,7 +29,11 @@
                 <div class="header_cols">
                     <div class="detail">
                         <div class="edit-wallet-name-container">
-                            <h3 v-show="!isEditable" class="addressVal" style="max-width: 300px">
+                            <h3
+                                v-show="!isEditable"
+                                class="addressVal"
+                                :style="isSuite ? { maxWidth: '395px' } : { maxWidth: 'none' }"
+                            >
                                 {{ walletName }}
                             </h3>
                             <input
@@ -166,6 +170,7 @@ import { privateToPublic } from '@ethereumjs/util'
     },
 })
 export default class KeyRow extends Vue {
+    @Prop() isSuite?: boolean
     @Prop() wallet!: WalletType
     @Prop({ default: false }) is_default?: boolean
 
@@ -514,12 +519,45 @@ export default class KeyRow extends Vue {
     margin-right: 6px;
 }
 
+@include mixins.medium-device {
+    .addressVal {
+        max-width: 395px !important;
+    }
+}
+
+@include mixins.large-device {
+    .addressVal {
+        max-width: 395px !important;
+    }
+}
+
+@include mixins.large-device {
+    .addressVal {
+        max-width: 500px !important;
+    }
+}
+
+@include mixins.xl-device {
+    .addressVal {
+        max-width: 500px !important;
+    }
+}
+
+@include mixins.largest-device {
+    .addressVal {
+        max-width: 800px !important;
+    }
+}
+
 @include mixins.mobile-device {
     .addressVal-value {
         white-space: normal;
         word-break: break-all;
         text-align: left;
     }
+    .addressVal {
+        max-width: 395px !important;
+    }
     .header_cols {
         display: flex;
         flex-direction: column;
diff --git a/src/components/wallet/manage/MyKeys.vue b/src/components/wallet/manage/MyKeys.vue
index da649efb3..5bc39f3ee 100644
--- a/src/components/wallet/manage/MyKeys.vue
+++ b/src/components/wallet/manage/MyKeys.vue
@@ -6,6 +6,7 @@
             :wallet="activeWallet"
             class="key_row"
             :is_default="true"
+            :isSuite="isSuite"
         ></key-row>
         <hr v-if="inactiveWallets.length > 0" />
         <p class="label" v-if="hasOtherKeys">
@@ -30,6 +31,7 @@
         </div>
         <transition-group name="fade" class="other-keys">
             <key-row
+                :isSuite="isSuite"
                 v-for="wallet in inactiveWallets"
                 :wallet="wallet"
                 :key="wallet.id"
@@ -43,7 +45,7 @@
 
 <script lang="ts">
 import 'reflect-metadata'
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch, Prop } from 'vue-property-decorator'
 
 import { bintools } from '@/AVA'
 import RememberKey from '@/components/misc/RememberKey.vue'
@@ -62,6 +64,7 @@ import Alert from '@/components/Alert.vue'
     },
 })
 export default class MyKeys extends Vue {
+    @Prop() isSuite?: boolean
     error: string = ''
     isLoading: boolean = false
     imported: boolean = false
diff --git a/src/components/wallet/manage/mountKyesComponent.ts b/src/components/wallet/manage/mountKyesComponent.ts
index a302bf4c0..db5225d04 100644
--- a/src/components/wallet/manage/mountKyesComponent.ts
+++ b/src/components/wallet/manage/mountKyesComponent.ts
@@ -14,7 +14,7 @@ Vue.use(BootstrapVue)
 Vue.component('datetime', Datetime)
 
 export const mountKyesComponent = (el: string, props: any) => {
-    const { dispatchNotification, dispatchSetNewName, setAccount } = props
+    const { dispatchNotification, dispatchSetNewName, setAccount, isSuite: boolean } = props
     const MyPlugin = {
         install(Vue) {
             Vue.prototype.globalHelper = () => {

From b5e7799b0117dae3914734ba78ab931bdf2e70f3 Mon Sep 17 00:00:00 2001
From: aeddaqqa <achrafeddaqqaq@gmail.com>
Date: Fri, 9 Aug 2024 01:29:56 +0100
Subject: [PATCH 2/3] feat(save-account): add error handling to save account

---
 .../modals/SaveAccount/SaveAccountModal.vue   | 30 +++++++++++++------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/src/components/modals/SaveAccount/SaveAccountModal.vue b/src/components/modals/SaveAccount/SaveAccountModal.vue
index 54c5c7268..1416e1863 100644
--- a/src/components/modals/SaveAccount/SaveAccountModal.vue
+++ b/src/components/modals/SaveAccount/SaveAccountModal.vue
@@ -33,6 +33,12 @@
                         <b>private key</b>
                         saved.
                     </p>
+                    <Alert
+                        v-for="(error, index) in errors"
+                        variant="negative"
+                        :title="error"
+                        :key="index"
+                    ></Alert>
                     <CamBtn
                         variant="primary"
                         :disabled="!canSubmit"
@@ -48,7 +54,7 @@
 </template>
 <script lang="ts">
 import 'reflect-metadata'
-import { Vue, Component, Prop } from 'vue-property-decorator'
+import { Vue, Component, Prop, Watch } from 'vue-property-decorator'
 
 import Modal from '../Modal.vue'
 import { SaveAccountInput } from '@/store/types'
@@ -77,23 +83,29 @@ export default class SaveAccountModal extends Vue {
     accountName = ''
     existsInLocalStorage: boolean = false
     index: number = 0
+    errors: string[] = []
     foundAccount: iUserAccountEncrypted | null = null
     $refs!: {
         modal: Modal
     }
 
     get canSubmit() {
-        if (this.error !== null) return false
+        if (this.errors.length !== 0) return false
         return true
     }
 
-    get error() {
-        if (!this.password) return this.$t('keys.password_validation')
-        if (!this.password_confirm) return this.$t('keys.password_validation2')
-        if (this.accountName.length < 1) return this.$t('keys.account_name_required')
-        if (this.password.length < 9) return this.$t('keys.password_validation')
-        if (this.password !== this.password_confirm) return this.$t('keys.password_validation2')
-
+    @Watch('password_confirm')
+    @Watch('accountName')
+    @Watch('password')
+    checkError() {
+        this.errors = []
+        if (this.password && this.password !== this.password_confirm)
+            this.errors.push(this.$t('keys.password_validation2') as string)
+        if (!this.password || this.password.length < 9)
+            this.errors.push(this.$t('keys.password_validation') as string)
+
+        if (this.accountName.length < 1)
+            this.errors.push(this.$t('keys.account_name_required') as string)
         return null
     }
 

From cc0e470ca720780a3e380c5e0973623401fa882d Mon Sep 17 00:00:00 2001
From: Ysrbolles <ysrbolles@gmail.com>
Date: Tue, 3 Sep 2024 17:03:39 +0100
Subject: [PATCH 3/3] fix: Update docker-compose commands to use 'docker
 compose'

---
 .github/workflows/cypress.yml | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/cypress.yml b/.github/workflows/cypress.yml
index 6b58169d8..184ccd0a1 100644
--- a/.github/workflows/cypress.yml
+++ b/.github/workflows/cypress.yml
@@ -47,10 +47,10 @@ jobs:
 
       - name: build local image
         run: |
-          docker-compose build --build-arg SUITE_IMAGE=${{ env.suite_image }}:${{ steps.setBranch.outputs.branch }} --build-arg EXPLORER_IMAGE=${{ env.explorer_image }}:${{ steps.setBranch.outputs.branch }}
+          docker compose build --build-arg SUITE_IMAGE=${{ env.suite_image }}:${{ steps.setBranch.outputs.branch }} --build-arg EXPLORER_IMAGE=${{ env.explorer_image }}:${{ steps.setBranch.outputs.branch }}
           export SUITE_IMAGE=${{ env.suite_image }}:${{ steps.setBranch.outputs.branch }}
           export EXPLORER_IMAGE=${{ env.explorer_image }}:${{ steps.setBranch.outputs.branch }}
-          docker-compose up -d
+          docker compose up -d
           docker cp camino-suite-host-container:/app/camino-suite ./
           mkdir -p /home/runner/.cache
           docker cp camino-suite-host-container:/root/.cache/Cypress  /home/runner/.cache/
@@ -120,10 +120,10 @@ jobs:
 
       - name: build local image
         run: |
-          docker-compose build --build-arg SUITE_IMAGE=${{ env.suite_image }}:${{ steps.setBranch.outputs.branch }} --build-arg EXPLORER_IMAGE=${{ env.explorer_image }}:${{ steps.setBranch.outputs.branch }}
+          docker compose build --build-arg SUITE_IMAGE=${{ env.suite_image }}:${{ steps.setBranch.outputs.branch }} --build-arg EXPLORER_IMAGE=${{ env.explorer_image }}:${{ steps.setBranch.outputs.branch }}
           export SUITE_IMAGE=${{ env.suite_image }}:${{ steps.setBranch.outputs.branch }}
           export EXPLORER_IMAGE=${{ env.explorer_image }}:${{ steps.setBranch.outputs.branch }}
-          docker-compose up -d
+          docker compose up -d
           docker cp camino-suite-host-container:/app/camino-suite ./
           mkdir -p /home/runner/.cache
           docker cp camino-suite-host-container:/root/.cache/Cypress  /home/runner/.cache/