From 2b760e39959efca4af3317fba26d922d9b8c768a Mon Sep 17 00:00:00 2001
From: Michael Mayer <michael@lastzero.net>
Date: Sat, 20 Feb 2021 13:06:02 +0100
Subject: [PATCH] UX: Set autofocus for input fields and confirm on enter #1078

---
 frontend/src/dialog/account/add.vue     | 3 +--
 frontend/src/dialog/account/edit.vue    | 4 ++--
 frontend/src/dialog/album/edit.vue      | 3 ++-
 frontend/src/dialog/photo/album.vue     | 2 ++
 frontend/src/pages/settings/account.vue | 2 +-
 frontend/src/pages/settings/sync.vue    | 2 +-
 6 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/frontend/src/dialog/account/add.vue b/frontend/src/dialog/account/add.vue
index 862c9d94a..5cbe7345c 100644
--- a/frontend/src/dialog/account/add.vue
+++ b/frontend/src/dialog/account/add.vue
@@ -13,8 +13,7 @@
           <v-flex xs12 class="pa-2">
             <v-text-field
                 v-model="model.AccURL"
-                hide-details
-                browser-autocomplete="off"
+                hide-details autofocus
                 :label="$gettext('Service URL')"
                 placeholder="https://www.example.com/"
                 color="secondary-dark"
diff --git a/frontend/src/dialog/account/edit.vue b/frontend/src/dialog/account/edit.vue
index 870815bc5..44c6da600 100644
--- a/frontend/src/dialog/account/edit.vue
+++ b/frontend/src/dialog/account/edit.vue
@@ -73,7 +73,7 @@
             <v-autocomplete
                 v-model="model.SharePath"
                 color="secondary-dark" hide-details hide-no-data
-                flat
+                flat autofocus
                 browser-autocomplete="off"
                 hint="Folder"
                 :search-input.sync="search"
@@ -185,7 +185,7 @@
           <v-flex xs12 class="pa-2">
             <v-text-field
                 v-model="model.AccName"
-                hide-details
+                hide-details autofocus
                 browser-autocomplete="off"
                 :label="$gettext('Name')"
                 placeholder=""
diff --git a/frontend/src/dialog/album/edit.vue b/frontend/src/dialog/album/edit.vue
index d6743a16e..c7a02856c 100644
--- a/frontend/src/dialog/album/edit.vue
+++ b/frontend/src/dialog/album/edit.vue
@@ -20,11 +20,12 @@
             <v-layout row wrap>
               <v-flex v-if="album.Type !== 'month'" xs12 pa-2>
                 <v-text-field v-model="model.Title"
-                              hide-details
+                              hide-details autofocus
                               :rules="[titleRule]"
                               :label="$gettext('Name')"
                               color="secondary-dark"
                               class="input-title"
+                              @keyup.enter.native="confirm"
                 ></v-text-field>
               </v-flex>
               <v-flex xs12 pa-2>
diff --git a/frontend/src/dialog/photo/album.vue b/frontend/src/dialog/photo/album.vue
index 1deaa3629..d01213f35 100644
--- a/frontend/src/dialog/photo/album.vue
+++ b/frontend/src/dialog/photo/album.vue
@@ -16,12 +16,14 @@
                 :loading="loading"
                 hide-details
                 hide-no-data
+                autofocus
                 item-text="Title"
                 item-value="UID"
                 :label="$gettext('Album Name')"
                 color="secondary-dark"
                 flat solo
                 class="input-album"
+                @keyup.enter.native="confirm"
             >
             </v-autocomplete>
           </v-flex>
diff --git a/frontend/src/pages/settings/account.vue b/frontend/src/pages/settings/account.vue
index 92db8c2a0..c5a1387f5 100644
--- a/frontend/src/pages/settings/account.vue
+++ b/frontend/src/pages/settings/account.vue
@@ -7,7 +7,7 @@
             <v-flex xs12 class="pa-2">
               <v-text-field
                   v-model="oldPassword"
-                  hide-details required
+                  hide-details required autofocus
                   type="password"
                   :disabled="busy"
                   browser-autocomplete="off"
diff --git a/frontend/src/pages/settings/sync.vue b/frontend/src/pages/settings/sync.vue
index d4f34d629..98f214091 100644
--- a/frontend/src/pages/settings/sync.vue
+++ b/frontend/src/pages/settings/sync.vue
@@ -10,7 +10,7 @@
         item-key="ID"
         :no-data-text="$gettext('No servers configured.')"
     >
-      <template v-slot:items="props" class="p-account">
+      <template #items="props" class="p-account">
         <td>
           <button class="secondary-dark--text" @click.stop.prevent="edit(props.item)">
             {{ props.item.AccName }}