web/satellite: submit passphrase inputs on enter press

This change submits passphrase inputs and access name inputs on enter
press, progressing to their next steps in the flow. As a result, an
issue where pressing enter in the access passphrase step will close the
access creation dialog.

Issue: #6918

Change-Id: I7748f59ac01954cf489959245a1fb7983982d484

web/satellite/src/components/dialogs/AccessSetupDialog.vue

@@ -41,6 +41,7 @@
                         :ref="stepInfos[SetupStep.ChooseAccessStep].ref"
                         @name-changed="newName => name = newName"
                         @typeChanged="newType => accessType = newType"
+                        @submit="nextStep"
                     />
                 </v-window-item>
 
@@ -61,6 +62,7 @@
                         :ref="stepInfos[SetupStep.AccessEncryption].ref"
                         @selectOption="val => passphraseOption = val"
                         @passphraseChanged="val => passphrase = val"
+                        @submit="nextStep"
                     />
                 </v-window-item>
 

web/satellite/src/components/dialogs/CreateAccessDialog.vue

@@ -46,6 +46,7 @@
                         :ref="stepInfos[CreateAccessStep.CreateNewAccess].ref"
                         @name-changed="newName => name = newName"
                         @types-changed="newTypes => accessTypes = newTypes"
+                        @submit="nextStep"
                     />
                 </v-window-item>
 
@@ -67,6 +68,7 @@
                         :ref="stepInfos[CreateAccessStep.AccessEncryption].ref"
                         @select-option="newOpt => passphraseOption = newOpt"
                         @passphrase-changed="newPass => passphrase = newPass"
+                        @submit="nextStep"
                     />
                 </v-window-item>
 

web/satellite/src/components/dialogs/ManagePassphraseDialog.vue

@@ -44,6 +44,7 @@
                         :ref="stepInfo[ManageProjectPassphraseStep.EnterPassphrase].ref"
                         ack-required
                         @passphrase-changed="newPass => passphrase = newPass"
+                        @submit="onNextClick"
                     >
                         Please note that Storj does not know or store your encryption passphrase.
                         If you lose it, you will not be able to recover your files.
@@ -74,6 +75,7 @@
                         :ref="stepInfo[ManageProjectPassphraseStep.Switch].ref"
                         title="Switch Passphrase"
                         set-on-next
+                        @submit="onNextClick"
                     >
                         Switch passphrase to view existing data that is uploaded with a different passphrase, or upload new data.
                         Please note that you won't see the previous data once you switch passphrases.

web/satellite/src/components/dialogs/accessSetupSteps/ChooseAccessStep.vue

@@ -2,7 +2,7 @@
 // See LICENSE for copying information.
 
 <template>
-    <v-form ref="form" class="pa-7" @submit.prevent>
+    <v-form ref="form" class="pa-7" @submit.prevent="emit('submit')">
         <v-row>
             <v-col cols="12">
                 <p class="text-subtitle-2 font-weight-bold mb-5">Enter Access Name</p>
@@ -91,6 +91,7 @@ const agStore = useAccessGrantsStore();
 const emit = defineEmits<{
     'nameChanged': [name: string];
     'typeChanged': [type: AccessType];
+    'submit': [];
 }>();
 
 const form = ref<VForm | null>(null);

web/satellite/src/components/dialogs/commonPassphraseSteps/EnterPassphraseStep.vue

@@ -2,7 +2,7 @@
 // See LICENSE for copying information.
 
 <template>
-    <v-form ref="form" class="pa-8" @submit.prevent>
+    <v-form ref="form" class="pa-8" @submit.prevent="emit('submit')">
         <v-row>
             <v-col v-if="$slots.default" cols="12">
                 <slot />
@@ -74,6 +74,7 @@ const props = withDefaults(defineProps<{
 
 const emit = defineEmits<{
     'passphraseChanged': [passphrase: string];
+    'submit': [];
 }>();
 
 watch(passphrase, value => emit('passphraseChanged', value));

web/satellite/src/components/dialogs/createAccessSteps/AccessEncryptionStep.vue

@@ -2,7 +2,7 @@
 // See LICENSE for copying information.
 
 <template>
-    <v-form ref="form" class="pa-7 pb-4">
+    <v-form ref="form" class="pa-7 pb-4" @submit.prevent="emit('submit')">
         <v-row>
             <v-col cols="12">
                 <!-- <p class="text-subtitle-2 font-weight-bold mb-2">Encryption Passphrase</p> -->
@@ -116,6 +116,7 @@ import PasswordInputEyeIcons from '@/components/PasswordInputEyeIcons.vue';
 const emit = defineEmits<{
     'selectOption': [option: PassphraseOption];
     'passphraseChanged': [passphrase: string];
+    'submit': [];
 }>();
 
 const form = ref<VForm | null>(null);

web/satellite/src/components/dialogs/createAccessSteps/CreateNewAccessStep.vue

@@ -2,7 +2,7 @@
 // See LICENSE for copying information.
 
 <template>
-    <v-form ref="form" class="pa-7 pb-4" @submit.prevent>
+    <v-form ref="form" class="pa-7 pb-4" @submit.prevent="emit('submit')">
         <v-row>
             <v-col cols="12">
                 <p class="text-subtitle-2 font-weight-bold mb-5">Enter Access Name</p>
@@ -117,6 +117,7 @@ watch(types, value => emit('typesChanged', value.slice()), { deep: true });
 const emit = defineEmits<{
     'nameChanged': [name: string];
     'typesChanged': [types: AccessType[]];
+    'submit': [];
 }>();
 
 const agStore = useAccessGrantsStore();