Add password reset confirm
continuous-integration/drone/push Build is failing Details

This commit is contained in:
philipp lang 2024-12-09 00:29:48 +01:00
parent 667fc4b731
commit 549c446430
5 changed files with 89 additions and 157 deletions

View File

@ -1,50 +0,0 @@
<?php
namespace App\Http\Controllers\Auth;
use App\Http\Controllers\Controller;
use App\Providers\RouteServiceProvider;
use Illuminate\Foundation\Auth\ResetsPasswords;
use Illuminate\Http\Request;
use Inertia\Inertia;
use Inertia\Response;
class ResetPasswordController extends Controller
{
/*
|--------------------------------------------------------------------------
| Password Reset Controller
|--------------------------------------------------------------------------
|
| This controller is responsible for handling password reset requests
| and uses a simple trait to include this behavior. You're free to
| explore this trait and override any methods you wish to tweak.
|
*/
use ResetsPasswords;
/**
* Where to redirect users after resetting their password.
*
* @var string
*/
protected $redirectTo = RouteServiceProvider::HOME;
/**
* Display the password reset view for the given token.
*
* If no token is present, display the link request form.
*
* @param \Illuminate\Http\Request $request
*/
public function showResetForm(Request $request): Response
{
$token = $request->route()->parameter('token');
return Inertia::render('authentication/PasswordResetConfirm', [
'token' => $token,
'email' => $request->email,
]);
}
}

View File

@ -6,6 +6,7 @@ use Illuminate\Routing\Router;
use Illuminate\Support\ServiceProvider; use Illuminate\Support\ServiceProvider;
use Modules\Auth\Components\LoginForm; use Modules\Auth\Components\LoginForm;
use Modules\Auth\Components\PasswordReset; use Modules\Auth\Components\PasswordReset;
use Modules\Auth\Components\PasswordResetConfirm;
class AuthServiceProvider extends ServiceProvider class AuthServiceProvider extends ServiceProvider
{ {
@ -28,7 +29,7 @@ class AuthServiceProvider extends ServiceProvider
app(Router::class)->middleware(['web', 'guest'])->group(function ($router) { app(Router::class)->middleware(['web', 'guest'])->group(function ($router) {
$router->get('/login', LoginForm::class)->name('login'); $router->get('/login', LoginForm::class)->name('login');
$router->get('/password/reset', PasswordReset::class)->name('password.request'); $router->get('/password/reset', PasswordReset::class)->name('password.request');
$router->get('/password/reseta', PasswordReset::class)->name('password.reset'); $router->get('/password/reset/{token}', PasswordResetConfirm::class)->name('password.reset');
}); });
} }
} }

View File

@ -0,0 +1,87 @@
<?php
namespace Modules\Auth\Components;
use Illuminate\Auth\Events\PasswordReset;
use Illuminate\Support\Str;
use Illuminate\Support\Facades\Hash;
use Illuminate\Support\Facades\Password;
use Illuminate\Validation\Rules\Password as PasswordRule;
use Illuminate\Validation\ValidationException;
use Livewire\Attributes\Layout;
use Livewire\Component;
class PasswordResetConfirm extends Component
{
public string $password = '';
public string $password_confirmation = '';
public string $token = '';
public string $email = '';
public function mount(string $token): void
{
$this->email = request()->query('email');
$this->token = $token;
}
public function submit()
{
$this->validate([
'token' => 'required',
'email' => 'required|email',
'password' => ['required', 'confirmed', PasswordRule::defaults()],
]);
$response = Password::broker()->reset([
'email' => $this->email,
'password' => $this->password,
'password_confirmation' => $this->password_confirmation,
'token' => $this->token
], fn ($user, $password) => $this->resetPassword($user, $password));
if ($response == Password::PASSWORD_RESET) {
$this->dispatch('success', 'Passwort erfolgreich geändert.');
return redirect()->route('home');
}
ValidationException::withMessages([
'password' => 'Passwort konnte nicht geändert werden.',
]);
}
protected function resetPassword($user, $password)
{
$user->password = Hash::make($password);
$user->setRememberToken(Str::random(60));
$user->save();
event(new PasswordReset($user));
auth()->login($user);
}
#[Layout('components.layouts.full')]
public function render(): string
{
return <<<'HTML'
<x-page::full heading="Passwort vergessen" title="Passwort vergessen">
<form wire:submit.prevent="submit">
<div class="grid gap-5">
<span class="text-gray-500 text-sm">
Hier kannst du dein Passwort zurücksetzen.<br />
Gebe dafür ein neues Passwort ein.<br />
Merke oder notiere dir dieses Passwort, bevor du das Formular absendest.<br />
Danach wirst du zum Dashboard weitergeleitet.
</span>
<x-form::text type="password" name="password" wire:model="password" label="Neues Passwort"></x-form::text>
<x-form::text type="password" name="password_confirmation" wire:model="password_confirmation" label="Neues Passwort widerholen"></x-form::text>
<x-ui::button type="submit">Passwort zurücksetzen</x-ui::button>
<div class="flex justify-center">
<a href="/login" class="text-gray-500 text-sm hover:text-gray-300">Zurück zum Login</a>
</div>
</div>
</form>
</x-page::full>
HTML;
}
}

View File

@ -1,44 +0,0 @@
<template>
<page-full-layout banner>
<template #heading>
<page-full-heading-banner>Passwort vergessen</page-full-heading-banner>
</template>
<form @submit.prevent="submit">
<div class="grid gap-5">
<span class="text-gray-500 text-sm"
>Hier kannst du dein Passwort zurücksetzen.<br />
Gebe dafür die E-Mail-Adresse deines Benutzerkontos ein.<br />
Anschließend bekommst du eine E-Mail<br />
mit weiteren Anweisungen.</span
>
<f-text id="email" v-model="values.email" name="email" label="E-Mail-Adresse"></f-text>
<button type="submit" class="btn btn-primary">Passwort zurücksetzen</button>
<div class="flex justify-center">
<button type="button" class="text-gray-500 text-sm hover:text-gray-300" @click.prevent="$inertia.visit('/login')">Zurück zum Login</button>
</div>
</div>
</form>
</page-full-layout>
</template>
<script>
import FullLayout from '../../layouts/FullLayout.vue';
export default {
layout: FullLayout,
data: function () {
return {
values: {
email: '',
},
};
},
methods: {
async submit() {
await this.axios.post('/password/email', this.values);
this.$success('Du hast weitere Instruktionen per E-Mail erhalten.');
},
},
};
</script>

View File

@ -1,62 +0,0 @@
<template>
<page-full-layout banner>
<template #heading>
<page-full-heading-banner>Passwort vergessen</page-full-heading-banner>
</template>
<form @submit.prevent="submit">
<div class="grid gap-5">
<span class="text-gray-500 text-sm"
>Hier kannst du dein Passwort zurücksetzen.<br />
Gebe dafür ein neues Passwort ein.<br />
Merke oder notiere dir dieses Passwort, bevor du das Formular absendest.<br />
Danach wirst du zum Dashboard weitergeleitet.</span
>
<f-text id="password" v-model="values.password" type="password" label="Neues Passwort"></f-text>
<f-text id="password_confirmation" v-model="values.password_confirmation" type="password" label="Neues Passwort widerholen"></f-text>
<button type="submit" class="btn btn-primary">Passwort zurücksetzen</button>
<div class="flex justify-center">
<button type="button" class="text-gray-500 text-sm hover:text-gray-300" @click.prevent="$inertia.visit('/login')">Zurück zum Login</button>
</div>
</div>
</form>
</page-full-layout>
</template>
<script>
import FullLayout from '../../layouts/FullLayout.vue';
export default {
layout: FullLayout,
props: {
token: {
type: String,
required: true,
},
email: {
type: String,
required: true,
},
},
data: function () {
return {
values: {
password: '',
password_confirmation: '',
},
};
},
methods: {
async submit() {
await this.axios.post('/password/reset', {
...this.values,
email: this.email,
token: this.token,
});
this.$success('Dein Passwort wurde zurückgesetzt.');
this.$inertia.visit('/');
},
},
};
</script>