84 lines
7.2 KiB
PHP
84 lines
7.2 KiB
PHP
@php
|
|
$label = 'mb-1.5 block font-mono text-[11px] uppercase tracking-wider text-ink-3';
|
|
$field = 'h-11 w-full rounded-md border border-line bg-inset px-3 text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none';
|
|
$err = 'mt-1.5 flex items-center gap-1.5 font-mono text-[11px] text-offline';
|
|
$mail = $this->mailEnabled();
|
|
// With SMTP the inline 2FA form is the secondary path (revealed via toggle); without it, it is the only path.
|
|
$showCode = $mail ? $showCodeReset : true;
|
|
@endphp
|
|
<div class="space-y-5">
|
|
<div>
|
|
<p class="font-mono text-[11px] uppercase tracking-[0.2em] text-accent-text">{{ __('auth.security') }}</p>
|
|
<h1 class="mt-1 font-display text-2xl font-semibold text-ink">{{ __('auth.forgot_heading') }}</h1>
|
|
<p class="mt-1.5 text-sm text-ink-2">{{ $mail ? __('auth.forgot_subtitle_mail') : __('auth.forgot_subtitle') }}</p>
|
|
</div>
|
|
|
|
@if ($mail)
|
|
{{-- SMTP configured: e-mail reset link is the default path. --}}
|
|
<form wire:submit="sendResetLink" class="space-y-4">
|
|
<div>
|
|
<label for="email_link" class="{{ $label }}">{{ __('auth.email') }}</label>
|
|
<input wire:model="email" id="email_link" type="text" autocomplete="username" class="{{ $field }}" placeholder="admin@clusev.local" />
|
|
@error('email') <p class="{{ $err }}"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p> @enderror
|
|
</div>
|
|
<x-btn variant="primary" size="lg" type="submit" class="w-full" wire:loading.attr="disabled" wire:target="sendResetLink">
|
|
<span wire:loading.remove wire:target="sendResetLink">{{ __('auth.forgot_send_email') }}</span>
|
|
<span wire:loading wire:target="sendResetLink">{{ __('auth.saving') }}</span>
|
|
</x-btn>
|
|
</form>
|
|
|
|
@unless ($showCode)
|
|
<button type="button" wire:click="$set('showCodeReset', true)"
|
|
class="block w-full text-center font-mono text-[11px] text-ink-3 transition-colors hover:text-accent-text focus:text-accent-text focus:outline-none">
|
|
{{ __('auth.forgot_use_code_toggle') }}
|
|
</button>
|
|
@endunless
|
|
@endif
|
|
|
|
@if ($showCode)
|
|
{{-- Inline 2FA-proof reset (email + TOTP/backup code + new password). --}}
|
|
<form wire:submit="resetPassword" class="space-y-4">
|
|
<div>
|
|
<label for="email" class="{{ $label }}">{{ __('auth.email') }}</label>
|
|
<input wire:model="email" id="email" type="text" autocomplete="username" class="{{ $field }}" placeholder="admin@clusev.local" />
|
|
@error('email') <p class="{{ $err }}"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p> @enderror
|
|
</div>
|
|
<div>
|
|
<label for="code" class="{{ $label }}">{{ __('auth.forgot_code') }}</label>
|
|
<input wire:model="code" id="code" type="text" inputmode="text" autocomplete="one-time-code" class="{{ $field }} font-mono" placeholder="123456 / xxxxxxxxxx-xxxxxxxxxx" />
|
|
@error('code') <p class="{{ $err }}"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p> @enderror
|
|
<p class="mt-1.5 font-mono text-[11px] text-ink-4">{{ __('auth.forgot_code_hint') }}</p>
|
|
</div>
|
|
<div>
|
|
<label for="password" class="{{ $label }}">{{ __('auth.new_password') }}</label>
|
|
<div class="relative" x-data="{ show: false }">
|
|
<input wire:model="password" id="password" :type="show ? 'text' : 'password'" autocomplete="new-password" class="{{ $field }} pr-11" placeholder="••••••••" />
|
|
<button type="button" @click="show = !show" :aria-label="show ? '{{ __('auth.hide_password') }}' : '{{ __('auth.toggle_password') }}'"
|
|
class="absolute inset-y-0 right-0 flex w-11 items-center justify-center text-ink-3 transition-colors hover:text-accent-text focus:text-accent-text focus:outline-none">
|
|
<svg x-show="!show" class="h-4 w-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></svg>
|
|
<svg x-show="show" x-cloak class="h-4 w-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"/><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"/><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"/><path d="m2 2 20 20"/></svg>
|
|
</button>
|
|
</div>
|
|
@error('password') <p class="{{ $err }}"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p> @enderror
|
|
</div>
|
|
<div>
|
|
<label for="password_confirmation" class="{{ $label }}">{{ __('auth.confirm_new_password') }}</label>
|
|
<div class="relative" x-data="{ show: false }">
|
|
<input wire:model="password_confirmation" id="password_confirmation" :type="show ? 'text' : 'password'" autocomplete="new-password" class="{{ $field }} pr-11" placeholder="••••••••" />
|
|
<button type="button" @click="show = !show" :aria-label="show ? '{{ __('auth.hide_password') }}' : '{{ __('auth.toggle_password') }}'"
|
|
class="absolute inset-y-0 right-0 flex w-11 items-center justify-center text-ink-3 transition-colors hover:text-accent-text focus:text-accent-text focus:outline-none">
|
|
<svg x-show="!show" class="h-4 w-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></svg>
|
|
<svg x-show="show" x-cloak class="h-4 w-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"/><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"/><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"/><path d="m2 2 20 20"/></svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<x-btn variant="primary" size="lg" type="submit" class="w-full" wire:loading.attr="disabled" wire:target="resetPassword">
|
|
<span wire:loading.remove wire:target="resetPassword">{{ __('auth.forgot_submit') }}</span>
|
|
<span wire:loading wire:target="resetPassword">{{ __('auth.saving') }}</span>
|
|
</x-btn>
|
|
</form>
|
|
@endif
|
|
|
|
<a href="{{ route('login') }}" wire:navigate class="block text-center font-mono text-[11px] text-ink-3 transition-colors hover:text-ink-2">{{ __('auth.back_to_login') }}</a>
|
|
</div>
|