mirror of
https://github.com/nikdoof/pocket-id.git
synced 2025-12-25 07:19:23 +00:00
feat: allow sign in with email (#100)
This commit is contained in:
@@ -16,7 +16,7 @@
|
||||
const appConfigService = new AppConfigService();
|
||||
|
||||
async function updateAppConfig(updatedAppConfig: Partial<AllAppConfig>) {
|
||||
await appConfigService
|
||||
appConfig = await appConfigService
|
||||
.update({
|
||||
...appConfig,
|
||||
...updatedAppConfig
|
||||
|
||||
@@ -19,17 +19,17 @@
|
||||
const appConfigService = new AppConfigService();
|
||||
|
||||
let isSendingTestEmail = $state(false);
|
||||
let emailEnabled = $state(appConfig.emailEnabled);
|
||||
|
||||
const updatedAppConfig = {
|
||||
emailEnabled: appConfig.emailEnabled,
|
||||
smtpHost: appConfig.smtpHost,
|
||||
smtpPort: appConfig.smtpPort,
|
||||
smtpUser: appConfig.smtpUser,
|
||||
smtpPassword: appConfig.smtpPassword,
|
||||
smtpFrom: appConfig.smtpFrom,
|
||||
smtpTls: appConfig.smtpTls,
|
||||
smtpSkipCertVerify: appConfig.smtpSkipCertVerify
|
||||
smtpSkipCertVerify: appConfig.smtpSkipCertVerify,
|
||||
emailOneTimeAccessEnabled: appConfig.emailOneTimeAccessEnabled,
|
||||
emailLoginNotificationEnabled: appConfig.emailLoginNotificationEnabled
|
||||
};
|
||||
|
||||
const formSchema = z.object({
|
||||
@@ -39,7 +39,9 @@
|
||||
smtpPassword: z.string(),
|
||||
smtpFrom: z.string().email(),
|
||||
smtpTls: z.boolean(),
|
||||
smtpSkipCertVerify: z.boolean()
|
||||
smtpSkipCertVerify: z.boolean(),
|
||||
emailOneTimeAccessEnabled: z.boolean(),
|
||||
emailLoginNotificationEnabled: z.boolean()
|
||||
});
|
||||
|
||||
const { inputs, ...form } = createForm<typeof formSchema>(formSchema, updatedAppConfig);
|
||||
@@ -47,26 +49,11 @@
|
||||
async function onSubmit() {
|
||||
const data = form.validate();
|
||||
if (!data) return false;
|
||||
await callback({
|
||||
...data,
|
||||
emailEnabled: true
|
||||
});
|
||||
await callback(data);
|
||||
toast.success('Email configuration updated successfully');
|
||||
return true;
|
||||
}
|
||||
|
||||
async function onDisable() {
|
||||
emailEnabled = false;
|
||||
await callback({ emailEnabled });
|
||||
toast.success('Email disabled successfully');
|
||||
}
|
||||
|
||||
async function onEnable() {
|
||||
if (await onSubmit()) {
|
||||
emailEnabled = true;
|
||||
}
|
||||
}
|
||||
|
||||
async function onTestEmail() {
|
||||
isSendingTestEmail = true;
|
||||
await appConfigService
|
||||
@@ -80,7 +67,8 @@
|
||||
</script>
|
||||
|
||||
<form onsubmit={onSubmit}>
|
||||
<div class="mt-5 grid grid-cols-1 items-start gap-5 md:grid-cols-2">
|
||||
<h4 class="text-lg font-semibold">SMTP Configuration</h4>
|
||||
<div class="mt-4 grid grid-cols-1 items-start gap-5 md:grid-cols-2">
|
||||
<FormInput label="SMTP Host" bind:input={$inputs.smtpHost} />
|
||||
<FormInput label="SMTP Port" type="number" bind:input={$inputs.smtpPort} />
|
||||
<FormInput label="SMTP User" bind:input={$inputs.smtpUser} />
|
||||
@@ -99,15 +87,26 @@
|
||||
bind:checked={$inputs.smtpSkipCertVerify.value}
|
||||
/>
|
||||
</div>
|
||||
<h4 class="mt-10 text-lg font-semibold">Enabled Emails</h4>
|
||||
<div class="mt-4 flex flex-col gap-3">
|
||||
<CheckboxWithLabel
|
||||
id="email-login-notification"
|
||||
label="Email Login Notification"
|
||||
description="Send an email to the user when they log in from a new device."
|
||||
bind:checked={$inputs.emailLoginNotificationEnabled.value}
|
||||
/>
|
||||
<CheckboxWithLabel
|
||||
id="email-one-time-access"
|
||||
label="Email One Time Access"
|
||||
description="Allows users to sign in with a link sent to their email. This reduces the security significantly as anyone with access to the user's email can gain entry."
|
||||
bind:checked={$inputs.emailOneTimeAccessEnabled.value}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="mt-8 flex flex-wrap justify-end gap-3">
|
||||
{#if emailEnabled}
|
||||
<Button variant="secondary" onclick={onDisable}>Disable</Button>
|
||||
<Button isLoading={isSendingTestEmail} variant="secondary" onclick={onTestEmail}
|
||||
>Send Test Email</Button
|
||||
>
|
||||
<Button type="submit">Save</Button>
|
||||
{:else}
|
||||
<Button onclick={onEnable}>Enable</Button>
|
||||
{/if}
|
||||
<Button isLoading={isSendingTestEmail} variant="secondary" onclick={onTestEmail}
|
||||
>Send Test Email</Button
|
||||
>
|
||||
<Button type="submit">Save</Button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -2,8 +2,6 @@
|
||||
import CheckboxWithLabel from '$lib/components/checkbox-with-label.svelte';
|
||||
import FormInput from '$lib/components/form-input.svelte';
|
||||
import { Button } from '$lib/components/ui/button';
|
||||
import { Checkbox } from '$lib/components/ui/checkbox';
|
||||
import { Label } from '$lib/components/ui/label';
|
||||
import type { AllAppConfig } from '$lib/types/application-configuration';
|
||||
import { createForm } from '$lib/utils/form-util';
|
||||
import { toast } from 'svelte-sonner';
|
||||
@@ -23,14 +21,14 @@
|
||||
appName: appConfig.appName,
|
||||
sessionDuration: appConfig.sessionDuration,
|
||||
emailsVerified: appConfig.emailsVerified,
|
||||
allowOwnAccountEdit: appConfig.allowOwnAccountEdit
|
||||
allowOwnAccountEdit: appConfig.allowOwnAccountEdit,
|
||||
};
|
||||
|
||||
const formSchema = z.object({
|
||||
appName: z.string().min(2).max(30),
|
||||
sessionDuration: z.number().min(1).max(43200),
|
||||
emailsVerified: z.boolean(),
|
||||
allowOwnAccountEdit: z.boolean()
|
||||
allowOwnAccountEdit: z.boolean(),
|
||||
});
|
||||
|
||||
const { inputs, ...form } = createForm<typeof formSchema>(formSchema, updatedAppConfig);
|
||||
@@ -63,7 +61,7 @@
|
||||
label="Emails Verified"
|
||||
description="Whether the user's email should be marked as verified for the OIDC clients."
|
||||
bind:checked={$inputs.emailsVerified.value}
|
||||
/>
|
||||
/>
|
||||
</div>
|
||||
<div class="mt-5 flex justify-end">
|
||||
<Button {isLoading} type="submit">Save</Button>
|
||||
|
||||
@@ -88,7 +88,6 @@
|
||||
label="Public Client"
|
||||
description="Public clients do not have a client secret and use PKCE instead. Enable this if your client is a SPA or mobile app."
|
||||
onCheckedChange={(v) => {
|
||||
console.log(v)
|
||||
if (v == true) form.setValue('pkceEnabled', true);
|
||||
}}
|
||||
bind:checked={$inputs.isPublic.value}
|
||||
|
||||
Reference in New Issue
Block a user