mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-07-19 04:49:37 +02:00
Update email verification and password reset flows; refactor Docker Compose and enhance email management
This commit is contained in:
Sean Morley
parent
0272c6b076
commit
2ccbf4be83
13 changed files with 197 additions and 137 deletions
|
|
@ -178,11 +178,15 @@ SESSION_SAVE_EVERY_REQUEST = True
|
|||
|
||||
FRONTEND_URL = getenv('FRONTEND_URL', 'http://localhost:3000')
|
||||
|
||||
# HEADLESS_FRONTEND_URLS = {
|
||||
# "account_confirm_email": "https://app.project.org/account/verify-email/{key}",
|
||||
# "account_reset_password_from_key": "https://app.org/account/password/reset/key/{key}",
|
||||
# "account_signup": "https://app.org/account/signup",
|
||||
# }
|
||||
HEADLESS_FRONTEND_URLS = {
|
||||
"account_confirm_email": f"{FRONTEND_URL}/user/verify-email/{{key}}",
|
||||
"account_reset_password": f"{FRONTEND_URL}/user/reset-password",
|
||||
"account_reset_password_from_key": f"{FRONTEND_URL}/user/reset-password/{{key}}",
|
||||
"account_signup": f"{FRONTEND_URL}/signup",
|
||||
# Fallback in case the state containing the `next` URL is lost and the handshake
|
||||
# with the third-party provider fails.
|
||||
"socialaccount_login_error": f"{FRONTEND_URL}/account/provider/callback",
|
||||
}
|
||||
|
||||
EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'
|
||||
SITE_ID = 1
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ services:
|
|||
- server
|
||||
|
||||
db:
|
||||
image: postgis/postgis:16-3.4
|
||||
image: postgis/postgis:15-3.3
|
||||
container_name: adventurelog-db
|
||||
restart: unless-stopped
|
||||
environment:
|
||||
|
|
|
|||
10
frontend/pnpm-lock.yaml
generated
10
frontend/pnpm-lock.yaml
generated
|
|
@ -831,8 +831,8 @@ packages:
|
|||
resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
|
||||
engines: {node: '>= 6'}
|
||||
|
||||
caniuse-lite@1.0.30001636:
|
||||
resolution: {integrity: sha512-bMg2vmr8XBsbL6Lr0UHXy/21m84FTxDLWn2FSqMd5PrlbMxwJlQnC2YWYxVgp66PZE+BBNF2jYQUBKCo1FDeZg==}
|
||||
caniuse-lite@1.0.30001688:
|
||||
resolution: {integrity: sha512-Nmqpru91cuABu/DTCXbM2NSRHzM2uVHfPnhJ/1zEAJx/ILBRVmz3pzH4N7DZqbdG0gWClsCC05Oj0mJ/1AWMbA==}
|
||||
|
||||
chokidar@3.6.0:
|
||||
resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
|
||||
|
|
@ -2610,7 +2610,7 @@ snapshots:
|
|||
autoprefixer@10.4.19(postcss@8.4.38):
|
||||
dependencies:
|
||||
browserslist: 4.23.1
|
||||
caniuse-lite: 1.0.30001636
|
||||
caniuse-lite: 1.0.30001688
|
||||
fraction.js: 4.3.7
|
||||
normalize-range: 0.1.2
|
||||
picocolors: 1.0.1
|
||||
|
|
@ -2644,7 +2644,7 @@ snapshots:
|
|||
|
||||
browserslist@4.23.1:
|
||||
dependencies:
|
||||
caniuse-lite: 1.0.30001636
|
||||
caniuse-lite: 1.0.30001688
|
||||
electron-to-chromium: 1.4.810
|
||||
node-releases: 2.0.14
|
||||
update-browserslist-db: 1.0.16(browserslist@4.23.1)
|
||||
|
|
@ -2668,7 +2668,7 @@ snapshots:
|
|||
|
||||
camelcase-css@2.0.1: {}
|
||||
|
||||
caniuse-lite@1.0.30001636: {}
|
||||
caniuse-lite@1.0.30001688: {}
|
||||
|
||||
chokidar@3.6.0:
|
||||
dependencies:
|
||||
|
|
|
|||
|
|
@ -17,8 +17,8 @@ export async function POST({ url, params, request, fetch, cookies }) {
|
|||
}
|
||||
|
||||
export async function PATCH({ url, params, request, fetch, cookies }) {
|
||||
const searchParam = url.search ? `${url.search}&format=json` : '?format=json';
|
||||
return handleRequest(url, params, request, fetch, cookies, searchParam, true);
|
||||
const searchParam = url.search ? `${url.search}` : '';
|
||||
return handleRequest(url, params, request, fetch, cookies, searchParam, false);
|
||||
}
|
||||
|
||||
export async function PUT({ url, params, request, fetch, cookies }) {
|
||||
|
|
|
|||
|
|
@ -100,6 +100,30 @@
|
|||
addToast('error', 'Error adding email');
|
||||
}
|
||||
}
|
||||
|
||||
async function primaryEmail(email: { email: any; verified?: boolean; primary?: boolean }) {
|
||||
let res = await fetch('/_allauth/browser/v1/account/email/', {
|
||||
method: 'PATCH',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({ email: email.email, primary: true })
|
||||
});
|
||||
if (res.ok) {
|
||||
addToast('success', 'Email set as primary');
|
||||
// remove primary from all other emails and set this one as primary
|
||||
emails = emails.map((e) => {
|
||||
if (e.email === email.email) {
|
||||
e.primary = true;
|
||||
} else {
|
||||
e.primary = false;
|
||||
}
|
||||
return e;
|
||||
});
|
||||
} else {
|
||||
addToast('error', 'Error setting email as primary');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<h1 class="text-center font-extrabold text-4xl mb-6">{$t('settings.settings_page')}</h1>
|
||||
|
|
@ -225,14 +249,19 @@
|
|||
{#if email.primary}
|
||||
<div class="badge badge-primary">Primary</div>
|
||||
{/if}
|
||||
<button class="btn btn-sm btn-warning ml-2" on:click={() => removeEmail(email)}
|
||||
>Remove</button
|
||||
>
|
||||
{#if !email.verified}
|
||||
<button class="btn btn-sm btn-secondary ml-2" on:click={() => verifyEmail(email)}
|
||||
>Verify</button
|
||||
>
|
||||
{/if}
|
||||
{#if !email.primary}
|
||||
<button class="btn btn-sm btn-secondary ml-2" on:click={() => primaryEmail(email)}
|
||||
>Make Primary</button
|
||||
>
|
||||
{/if}
|
||||
<button class="btn btn-sm btn-warning ml-2" on:click={() => removeEmail(email)}
|
||||
>Remove</button
|
||||
>
|
||||
</p>
|
||||
{/each}
|
||||
{#if emails.length === 0}
|
||||
|
|
|
|||
|
|
@ -1,57 +0,0 @@
|
|||
import { fail, redirect, type Actions } from '@sveltejs/kit';
|
||||
import type { PageServerLoad } from './$types';
|
||||
const PUBLIC_SERVER_URL = process.env['PUBLIC_SERVER_URL'];
|
||||
const serverEndpoint = PUBLIC_SERVER_URL || 'http://localhost:8000';
|
||||
|
||||
export const load = (async (event) => {
|
||||
const token = event.url.searchParams.get('token');
|
||||
const uid = event.url.searchParams.get('uid');
|
||||
|
||||
return {
|
||||
props: {
|
||||
token,
|
||||
uid
|
||||
}
|
||||
};
|
||||
}) satisfies PageServerLoad;
|
||||
|
||||
export const actions: Actions = {
|
||||
reset: async (event) => {
|
||||
const formData = await event.request.formData();
|
||||
|
||||
const new_password1 = formData.get('new_password1') as string;
|
||||
const new_password2 = formData.get('new_password2') as string;
|
||||
const token = formData.get('token') as string;
|
||||
const uid = formData.get('uid') as string;
|
||||
|
||||
if (!new_password1 || !new_password2) {
|
||||
return fail(400, { message: 'settings.password_is_required' });
|
||||
}
|
||||
|
||||
if (new_password1 !== new_password2) {
|
||||
return fail(400, { message: 'settings.password_does_not_match' });
|
||||
}
|
||||
|
||||
if (!token || !uid) {
|
||||
return redirect(302, '/settings/forgot-password');
|
||||
} else {
|
||||
let response = await fetch(`${serverEndpoint}/auth/password/reset/confirm/`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
token: token,
|
||||
uid: uid,
|
||||
new_password1,
|
||||
new_password2
|
||||
})
|
||||
});
|
||||
if (!response.ok) {
|
||||
return fail(response.status, { message: 'settings.invalid_token' });
|
||||
} else {
|
||||
return redirect(302, '/login');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -1,64 +0,0 @@
|
|||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import { goto } from '$app/navigation';
|
||||
import { page } from '$app/stores';
|
||||
import type { PageData } from './$types';
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
export let data: PageData;
|
||||
</script>
|
||||
|
||||
<h1 class="text-center font-bold text-4xl mb-4">{$t('settings.change_password')}</h1>
|
||||
|
||||
{#if data.props.token && data.props.uid}
|
||||
<p class="text-center">{$t('settings.login_redir')}</p>
|
||||
<div
|
||||
class="modal-action items-center"
|
||||
style="display: flex; flex-direction: column; align-items: center; width: 100%;"
|
||||
>
|
||||
<form action="?/reset" method="post" use:enhance>
|
||||
<input type="hidden" name="uid" value={data.props.uid} />
|
||||
<input type="hidden" name="token" value={data.props.token} />
|
||||
|
||||
<div class="mb-2 w-full">
|
||||
<input
|
||||
type="password"
|
||||
class="input input-bordered w-full"
|
||||
id="new_password1"
|
||||
name="new_password1"
|
||||
placeholder={$t('settings.new_password')}
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-2 w-full">
|
||||
<input
|
||||
type="password"
|
||||
class="input input-bordered w-full"
|
||||
id="new_password2"
|
||||
name="new_password2"
|
||||
placeholder={$t('settings.confirm_new_password')}
|
||||
/>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary w-full">{$t('settings.submit')}</button>
|
||||
{#if $page.form?.message}
|
||||
<div class="text-center text-error mt-4">
|
||||
{$t($page.form?.message)}
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex justify-center">
|
||||
<div class="items-center justify-center">
|
||||
<p class="text-center">{$t('settings.token_required')}</p>
|
||||
|
||||
<button class="btn btn-neutral" on:click={() => goto('/settings/forgot-password')}>
|
||||
{$t('settings.reset_password')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<svelte:head>
|
||||
<title>Password Reset Confirm</title>
|
||||
<meta name="description" content="Confirm your password reset and make a new password." />
|
||||
</svelte:head>
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
import { fail, redirect } from '@sveltejs/kit';
|
||||
import { fetchCSRFToken } from '$lib/index.server';
|
||||
import type { PageServerLoad, Actions } from './$types';
|
||||
|
||||
export const load = (async ({ params }) => {
|
||||
const key = params.key;
|
||||
if (!key) {
|
||||
throw redirect(302, '/');
|
||||
}
|
||||
return { key };
|
||||
}) satisfies PageServerLoad;
|
||||
|
||||
export const actions: Actions = {
|
||||
default: async (event) => {
|
||||
const formData = await event.request.formData();
|
||||
const password = formData.get('password');
|
||||
const confirm_password = formData.get('confirm_password');
|
||||
const key = event.params.key;
|
||||
|
||||
if (!password || !confirm_password) {
|
||||
return fail(400, { message: 'both_passwords_required' });
|
||||
}
|
||||
|
||||
if (password !== confirm_password) {
|
||||
return fail(400, { message: 'passwords_not_match' });
|
||||
}
|
||||
|
||||
const PUBLIC_SERVER_URL = process.env['PUBLIC_SERVER_URL'];
|
||||
const serverEndpoint = PUBLIC_SERVER_URL || 'http://localhost:8000';
|
||||
const csrfToken = await fetchCSRFToken();
|
||||
|
||||
const response = await event.fetch(
|
||||
`${serverEndpoint}/_allauth/browser/v1/auth/password/reset`,
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
Cookie: `csrftoken=${csrfToken}`,
|
||||
'X-CSRFToken': csrfToken
|
||||
},
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
body: JSON.stringify({ key: key, password: password })
|
||||
}
|
||||
);
|
||||
|
||||
if (response.status !== 401) {
|
||||
const error_message = await response.json();
|
||||
console.error(error_message);
|
||||
console.log(response);
|
||||
return fail(response.status, { message: 'reset_failed' });
|
||||
}
|
||||
|
||||
return redirect(302, '/login');
|
||||
}
|
||||
};
|
||||
47
frontend/src/routes/user/reset-password/[key]/+page.svelte
Normal file
47
frontend/src/routes/user/reset-password/[key]/+page.svelte
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import { page } from '$app/stores';
|
||||
import type { PageData } from '../../../$types';
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
export let data: PageData;
|
||||
</script>
|
||||
|
||||
<h1 class="text-center font-bold text-4xl mb-4">{$t('settings.change_password')}</h1>
|
||||
|
||||
<form method="POST" use:enhance>
|
||||
<div class="mb-4">
|
||||
<label for="password" class="block mb-2">{$t('auth.new_password')}</label>
|
||||
<input
|
||||
type="password"
|
||||
id="password"
|
||||
name="password"
|
||||
required
|
||||
class="w-full p-2 border rounded"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="confirm_password" class="block mb-2">{$t('auth.confirm_password')}</label>
|
||||
<input
|
||||
type="password"
|
||||
id="confirm_password"
|
||||
name="confirm_password"
|
||||
required
|
||||
class="w-full p-2 border rounded"
|
||||
/>
|
||||
</div>
|
||||
<button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded"
|
||||
>{$t('auth.reset_password')}</button
|
||||
>
|
||||
|
||||
{#if $page.form?.message}
|
||||
<div class="text-center text-error mt-4">
|
||||
{$page.form?.message}
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
|
||||
<svelte:head>
|
||||
<title>Password Reset Confirm</title>
|
||||
<meta name="description" content="Confirm your password reset and make a new password." />
|
||||
</svelte:head>
|
||||
33
frontend/src/routes/user/verify-email/[key]/+page.server.ts
Normal file
33
frontend/src/routes/user/verify-email/[key]/+page.server.ts
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
import { fetchCSRFToken } from '$lib/index.server';
|
||||
import type { PageServerLoad } from './$types';
|
||||
|
||||
export const load = (async (event) => {
|
||||
// get key from route params
|
||||
const key = event.params.key;
|
||||
if (!key) {
|
||||
return { status: 404 };
|
||||
}
|
||||
const PUBLIC_SERVER_URL = process.env['PUBLIC_SERVER_URL'];
|
||||
const serverEndpoint = PUBLIC_SERVER_URL || 'http://localhost:8000';
|
||||
const csrfToken = await fetchCSRFToken();
|
||||
|
||||
let verifyFetch = await event.fetch(`${serverEndpoint}/_allauth/browser/v1/auth/email/verify`, {
|
||||
headers: {
|
||||
Cookie: `csrftoken=${csrfToken}`,
|
||||
'X-CSRFToken': csrfToken
|
||||
},
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
|
||||
body: JSON.stringify({ key: key })
|
||||
});
|
||||
if (!verifyFetch.ok) {
|
||||
let error_message = await verifyFetch.json();
|
||||
console.error(error_message);
|
||||
console.error('Failed to verify email');
|
||||
return { status: 404 };
|
||||
}
|
||||
return {
|
||||
verified: true
|
||||
};
|
||||
}) satisfies PageServerLoad;
|
||||
13
frontend/src/routes/user/verify-email/[key]/+page.svelte
Normal file
13
frontend/src/routes/user/verify-email/[key]/+page.svelte
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<script lang="ts">
|
||||
import type { PageData } from '../$types';
|
||||
|
||||
export let data: PageData;
|
||||
</script>
|
||||
|
||||
{#if data.verified}
|
||||
<h1>Email verified</h1>
|
||||
<p>Your email has been verified. You can now log in.</p>
|
||||
{:else}
|
||||
<h1>Email verification failed</h1>
|
||||
<p>Your email could not be verified. Please try again.</p>
|
||||
{/if}
|
||||
Loading…
Add table
Add a link
Reference in a new issue