Merge pull request #144 from thedevdojo/allow-autocomplete

Allow autocompletion for email and password inputs
thedevdojo · Dec 4, 2024 · e020161 · e020161
2 parents 026eb95 + d2f4843
commit e020161
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 14 deletions.
diff --git a/resources/views/pages/auth/login.blade.php b/resources/views/pages/auth/login.blade.php
@@ -156,7 +156,7 @@ public function authenticate()
                     </x-auth::elements.input-placeholder>
                 @else
                     @if($showIdentifierInput)
-                        <x-auth::elements.input :label="config('devdojo.auth.language.login.email_address')" type="email" wire:model="email" autofocus="true" data-auth="email-input" id="email" required />
+                        <x-auth::elements.input :label="config('devdojo.auth.language.login.email_address')" type="email" wire:model="email" autofocus="true" data-auth="email-input" id="email" name="email" autocomplete="email" required />
                     @endif
                 @endif
 
@@ -174,13 +174,17 @@ public function authenticate()
                     @endif
                 @endif
 
-                @if($showPasswordField)
-                    <x-auth::elements.input :label="config('devdojo.auth.language.login.password')" type="password" wire:model="password" id="password" data-auth="password-input" />
-					<x-auth::elements.checkbox :label="config('devdojo.auth.language.login.remember_me')" wire:model="rememberMe" id="remember-me" data-auth="remember-me-input" />
-					<div class="flex items-center justify-between mt-6 text-sm leading-5">
+                @php
+                    $passwordFieldClasses = $showPasswordField ? 'flex flex-col gap-6' : 'hidden';
+                @endphp
+
+                <div class="{{ $passwordFieldClasses }}">
+                    <x-auth::elements.input :label="config('devdojo.auth.language.login.password')" type="password" wire:model="password" data-auth="password-input" id="password" name="password" autocomplete="current-password" />
+                    <x-auth::elements.checkbox :label="config('devdojo.auth.language.login.remember_me')" wire:model="rememberMe" id="remember-me" data-auth="remember-me-input" />
+                    <div class="flex items-center justify-between text-sm leading-5">
                         <x-auth::elements.text-link href="{{ route('auth.password.request') }}" data-auth="forgot-password-link">{{ config('devdojo.auth.language.login.forget_password') }}</x-auth::elements.text-link>
                     </div>
-                @endif
+                </div>
 
                 <x-auth::elements.button type="primary" data-auth="submit-button" rounded="md" size="md" submit="true">
                     {{ config('devdojo.auth.language.login.button') }}

diff --git a/resources/views/pages/auth/password/[token].blade.php b/resources/views/pages/auth/password/[token].blade.php
@@ -77,8 +77,8 @@ function ($user, $password) {
 
             <form wire:submit="resetPassword" class="space-y-5">
                 <x-auth::elements.input :label="config('devdojo.auth.language.passwordReset.email')" type="email" id="email" name="email" data-auth="email-input" wire:model="email" autofocus="true" />
-                <x-auth::elements.input :label="config('devdojo.auth.language.passwordReset.password')" type="password" id="password" name="password" data-auth="password-input" wire:model="password" />
-                <x-auth::elements.input :label="config('devdojo.auth.language.passwordReset.password_confirm')" type="password" id="password_confirmation" name="password_confirmation" data-auth="password-confirm-input" wire:model="passwordConfirmation" />
+                <x-auth::elements.input :label="config('devdojo.auth.language.passwordReset.password')" type="password" id="password" name="password" data-auth="password-input" wire:model="password" autocomplete="new-password" />
+                <x-auth::elements.input :label="config('devdojo.auth.language.passwordReset.password_confirm')" type="password" id="password_confirmation" name="password_confirmation" data-auth="password-confirm-input" wire:model="passwordConfirmation" autocomplete="new-password" />
                 <x-auth::elements.button type="primary" data-auth="submit-button" rounded="md" submit="true">{{config('devdojo.auth.language.passwordReset.button')}}</x-auth::elements.button>
             </form>
         </x-auth::elements.container>

diff --git a/resources/views/pages/auth/password/confirm.blade.php b/resources/views/pages/auth/password/confirm.blade.php
@@ -44,7 +44,7 @@ public function confirm()
                 :show_subheadline="($language->passwordConfirm->show_subheadline ?? false)"
             />
             <form wire:submit="confirm" class="space-y-5">
-                <x-auth::elements.input :label="config('devdojo.auth.language.passwordConfirm.password')" type="password" id="password" name="password" data-auth="password-input" autofocus="true" wire:model="password" />
+                <x-auth::elements.input :label="config('devdojo.auth.language.passwordConfirm.password')" type="password" id="password" name="password" data-auth="password-input" autofocus="true" wire:model="password" autocomplete="current-password" />
                 <x-auth::elements.button type="primary" rounded="md" data-auth="submit-button" submit="true">{{config('devdojo.auth.language.passwordConfirm.button')}}</x-auth::elements.button>
             </form>
         </x-auth::elements.container>

diff --git a/resources/views/pages/auth/password/reset.blade.php b/resources/views/pages/auth/password/reset.blade.php
@@ -67,7 +67,7 @@ public function sendResetPasswordLink()
             </div>
         @else
             <form wire:submit="sendResetPasswordLink" class="space-y-5">
-                <x-auth::elements.input :label="config('devdojo.auth.language.passwordResetRequest.email')" type="email" id="email" name="email" data-auth="email-input" wire:model="email" autofocus="true" />
+                <x-auth::elements.input :label="config('devdojo.auth.language.passwordResetRequest.email')" type="email" id="email" name="email" data-auth="email-input" wire:model="email" autofocus="true" autocomplete="email" />
                 <x-auth::elements.button type="primary" data-auth="submit-button" rounded="md" submit="true">{{config('devdojo.auth.language.passwordResetRequest.button')}}</x-auth::elements.button>
             </form>
         @endif

diff --git a/resources/views/pages/auth/register.blade.php b/resources/views/pages/auth/register.blade.php
@@ -139,15 +139,15 @@ public function register()
             @php
             $autofocusEmail = ($showNameField) ? false : true;
             @endphp
-            <x-auth::elements.input :label="config('devdojo.auth.language.register.email_address')" id="email" type="email" wire:model="email" data-auth="email-input" :autofocus="$autofocusEmail" required />
+            <x-auth::elements.input :label="config('devdojo.auth.language.register.email_address')" id="email" name="email" type="email" wire:model="email" data-auth="email-input" :autofocus="$autofocusEmail" autocomplete="email" required />
             @endif
 
             @if($showPasswordField)
-            <x-auth::elements.input :label="config('devdojo.auth.language.register.password')" type="password" wire:model="password" id="password" data-auth="password-input" required />
+            <x-auth::elements.input :label="config('devdojo.auth.language.register.password')" type="password" wire:model="password" id="password" name="password" data-auth="password-input" autocomplete="new-password" required />
             @endif
 
             @if($showPasswordConfirmationField)
-            <x-auth::elements.input :label="config('devdojo.auth.language.register.password_confirmation')" type="password" wire:model="password_confirmation" id="password_confirmation" data-auth="password-confirmation-input" required />
+            <x-auth::elements.input :label="config('devdojo.auth.language.register.password_confirmation')" type="password" wire:model="password_confirmation" id="password_confirmation" name="password_confirmation" data-auth="password-confirmation-input" autocomplete="new-password" required />
             @endif
 
             <x-auth::elements.button data-auth="submit-button" rounded="md" submit="true">{{config('devdojo.auth.language.register.button')}}</x-auth::elements.button>
@@ -166,4 +166,4 @@ public function register()
     </x-auth::elements.container>
     @endvolt
 
-</x-auth::layouts.app>
+</x-auth::layouts.app>