From 1d8174e9239173a990148d1ad1662bd67cf140bc Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Tue, 22 Nov 2022 11:31:26 +0530
Subject: [PATCH] feat: autofocus password field in protected shared view

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 packages/nc-gui/components/shared-view/AskPassword.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/shared-view/AskPassword.vue b/packages/nc-gui/components/shared-view/AskPassword.vue
index ab9680cc88..3edce49ca7 100644
--- a/packages/nc-gui/components/shared-view/AskPassword.vue
+++ b/packages/nc-gui/components/shared-view/AskPassword.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { VNodeRef } from '@vue/runtime-core'
+import type { InputPassword } from 'ant-design-vue'
 import { extractSdkResponseErrorMsg, message, ref, useRoute, useSharedView, useVModel } from '#imports'
 
 const props = defineProps<{
@@ -24,6 +26,8 @@ const onFinish = async () => {
     message.error(await extractSdkResponseErrorMsg(e))
   }
 }
+
+const focus: VNodeRef = (el: typeof InputPassword) => el?.$el?.querySelector('input').focus()
 </script>
 
 <template>
@@ -42,7 +46,7 @@ const onFinish = async () => {
 
       <a-form ref="formRef" :model="formState" class="mt-2" @finish="onFinish">
         <a-form-item name="password" :rules="[{ required: true, message: 'Password is required' }]">
-          <a-input-password v-model:value="formState.password" placeholder="Enter password" />
+          <a-input-password :ref="focus" v-model:value="formState.password" placeholder="Enter password" />
         </a-form-item>
 
         <a-button type="primary" html-type="submit">Unlock</a-button>