svelte-firekit 0.0.9 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/auth/reset-password.svelte +27 -15
- package/dist/auth/reset-password.svelte.d.ts +7 -17
- package/dist/auth/sign-in.svelte +51 -23
- package/dist/auth/sign-in.svelte.d.ts +11 -1
- package/dist/auth/sign-up.svelte +62 -23
- package/dist/auth/sign-up.svelte.d.ts +13 -0
- package/dist/components/app/nav/app-sidebar.svelte +35 -0
- package/dist/components/app/nav/app-sidebar.svelte.d.ts +8 -0
- package/dist/components/app/nav/breadcrumb.svelte +42 -0
- package/dist/components/app/nav/breadcrumb.svelte.d.ts +19 -0
- package/dist/components/auth/google-sign-in.svelte +55 -53
- package/dist/components/auth/reset-password-form.svelte +49 -47
- package/dist/components/auth/reset-password-form.svelte.d.ts +3 -17
- package/dist/components/auth/sign-in-form.svelte +21 -5
- package/dist/components/auth/sign-in-form.svelte.d.ts +7 -17
- package/dist/components/auth/sign-up-form.svelte +127 -110
- package/dist/components/auth/sign-up-form.svelte.d.ts +10 -17
- package/dist/components/auth/user-button/profile-section/avatar-user.svelte +107 -0
- package/dist/components/auth/user-button/profile-section/avatar-user.svelte.d.ts +2 -0
- package/dist/components/auth/user-button/profile-section/connect-user.svelte +45 -0
- package/dist/components/auth/user-button/profile-section/connect-user.svelte.d.ts +18 -0
- package/dist/components/auth/user-button/profile-section/email-user.svelte +81 -0
- package/dist/components/auth/user-button/profile-section/email-user.svelte.d.ts +2 -0
- package/dist/components/auth/user-button/profile-section/phone-user.svelte +122 -0
- package/dist/components/auth/user-button/profile-section/phone-user.svelte.d.ts +2 -0
- package/dist/components/auth/user-button/profile-section/profile-section.svelte +17 -0
- package/dist/components/auth/user-button/profile-section/profile-section.svelte.d.ts +18 -0
- package/dist/components/auth/user-button/settings-dialog.svelte +80 -87
- package/dist/components/auth/user-button/type-account.svelte +35 -0
- package/dist/components/auth/user-button/type-account.svelte.d.ts +4 -0
- package/dist/components/auth/user-button/user-button.svelte +122 -112
- package/dist/components/nav/nav-main.svelte +70 -0
- package/dist/components/nav/nav-main.svelte.d.ts +18 -0
- package/dist/components/ui/badge/badge.svelte +49 -0
- package/dist/components/ui/badge/badge.svelte.d.ts +59 -0
- package/dist/components/ui/badge/index.d.ts +2 -0
- package/dist/components/ui/badge/index.js +2 -0
- package/dist/components/ui/collapsible/index.d.ts +5 -0
- package/dist/components/ui/collapsible/index.js +7 -0
- package/dist/config.d.ts +2 -0
- package/dist/config.js +28 -0
- package/dist/firebase/auth/auth-guard.svelte.d.ts +0 -30
- package/dist/firebase/auth/auth-guard.svelte.js +119 -102
- package/dist/firebase/auth/auth-manager.svelte.d.ts +73 -0
- package/dist/firebase/auth/auth-manager.svelte.js +257 -0
- package/dist/firebase/auth/auth.js +2 -2
- package/dist/firebase/auth/user.svelte.d.ts +0 -49
- package/dist/firebase/auth/user.svelte.js +177 -115
- package/dist/firebase/firestore/document-mutations.svelte.js +14 -11
- package/dist/firebase/storage/upload-task.svelte.d.ts +1 -0
- package/dist/firebase/storage/upload-task.svelte.js +4 -2
- package/dist/index.d.ts +1 -3
- package/dist/index.js +3 -3
- package/dist/types/nav.d.ts +4 -0
- package/package.json +4 -2
|
@@ -1,20 +1,32 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
import ResetPasswordForm from "../components/auth/reset-password-form.svelte";
|
|
3
|
+
import Button from "../components/ui/button/button.svelte";
|
|
4
|
+
import * as Card from "../components/ui/card/index.js";
|
|
5
|
+
|
|
6
|
+
let {
|
|
7
|
+
title,
|
|
8
|
+
subtitle,
|
|
9
|
+
labelLink,
|
|
10
|
+
link,
|
|
11
|
+
redirect,
|
|
12
|
+
}: {
|
|
13
|
+
title: string;
|
|
14
|
+
subtitle: string;
|
|
15
|
+
labelLink: string;
|
|
16
|
+
link: string;
|
|
17
|
+
redirect: string;
|
|
18
|
+
} = $props();
|
|
5
19
|
</script>
|
|
6
20
|
|
|
7
21
|
<Card.Root class="sm:w-[448px]">
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
<ResetPasswordForm />
|
|
19
|
-
</Card.Content>
|
|
22
|
+
<Card.Header>
|
|
23
|
+
<Card.Title class="text-center text-2xl">{title}</Card.Title>
|
|
24
|
+
<Card.Description class="text-center">
|
|
25
|
+
{subtitle}
|
|
26
|
+
<Button variant="link" href={link} class="p-0">{labelLink}</Button>
|
|
27
|
+
</Card.Description>
|
|
28
|
+
</Card.Header>
|
|
29
|
+
<Card.Content>
|
|
30
|
+
<ResetPasswordForm {redirect} />
|
|
31
|
+
</Card.Content>
|
|
20
32
|
</Card.Root>
|
|
@@ -1,18 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
}): Exports & {
|
|
9
|
-
$set?: any;
|
|
10
|
-
$on?: any;
|
|
11
|
-
};
|
|
12
|
-
z_$$bindings?: Bindings;
|
|
13
|
-
}
|
|
14
|
-
declare const ResetPassword: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
|
|
15
|
-
[evt: string]: CustomEvent<any>;
|
|
16
|
-
}, {}, {}, string>;
|
|
17
|
-
type ResetPassword = InstanceType<typeof ResetPassword>;
|
|
1
|
+
declare const ResetPassword: import("svelte").Component<{
|
|
2
|
+
title: string;
|
|
3
|
+
subtitle: string;
|
|
4
|
+
labelLink: string;
|
|
5
|
+
link: string;
|
|
6
|
+
redirect: string;
|
|
7
|
+
}, {}, "">;
|
|
18
8
|
export default ResetPassword;
|
package/dist/auth/sign-in.svelte
CHANGED
|
@@ -1,30 +1,58 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
import SignInWithGoogle from "../components/auth/google-sign-in.svelte";
|
|
3
|
+
import SignInForm from "../components/auth/sign-in-form.svelte";
|
|
4
|
+
import Button from "../components/ui/button/button.svelte";
|
|
5
|
+
import * as Card from "../components/ui/card/index.js";
|
|
6
|
+
let {
|
|
7
|
+
title = "Sign in",
|
|
8
|
+
subtitle = "Don't have an account yet?",
|
|
9
|
+
textLink = "Sign up here",
|
|
10
|
+
link = "/sign-up",
|
|
11
|
+
labelBtnGoogle = "Sign in with",
|
|
12
|
+
labelEmail = "Email",
|
|
13
|
+
labelPassword = "Password",
|
|
14
|
+
labellLinkEmailForm = "I forgot my password",
|
|
15
|
+
linkForgetPassword = "/reset-password",
|
|
16
|
+
labelBtnFormEmail = "Sign",
|
|
17
|
+
labelDivider = "Or",
|
|
18
|
+
}: {
|
|
19
|
+
title: string;
|
|
20
|
+
subtitle: string;
|
|
21
|
+
textLink: string;
|
|
22
|
+
link: string;
|
|
23
|
+
labelBtnGoogle: string;
|
|
24
|
+
labelEmail: string;
|
|
25
|
+
labelPassword: string;
|
|
26
|
+
labellLinkEmailForm: string;
|
|
27
|
+
linkForgetPassword: string;
|
|
28
|
+
labelBtnFormEmail: string;
|
|
29
|
+
labelDivider: string;
|
|
30
|
+
} = $props();
|
|
7
31
|
</script>
|
|
8
32
|
|
|
9
33
|
<Card.Root class="sm:w-[448px]">
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
<Card.Content class="space-y-5">
|
|
20
|
-
<SignInWithGoogle label="Sign in" />
|
|
34
|
+
<Card.Header>
|
|
35
|
+
<Card.Title class="text-center text-2xl">{title}</Card.Title>
|
|
36
|
+
<Card.Description class="text-center">
|
|
37
|
+
{subtitle}
|
|
38
|
+
<Button variant="link" href={link} class="p-0">{textLink}</Button>
|
|
39
|
+
</Card.Description>
|
|
40
|
+
</Card.Header>
|
|
41
|
+
<Card.Content class="space-y-5">
|
|
42
|
+
<SignInWithGoogle label={labelBtnGoogle} />
|
|
21
43
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
44
|
+
<div
|
|
45
|
+
class="before:muted-foreground after:muted-foreground flex items-center text-xs uppercase text-muted-foreground before:me-6 before:flex-1 before:border-t after:ms-6 after:flex-1 after:border-t dark:before:border-muted-foreground dark:after:border-muted-foreground"
|
|
46
|
+
>
|
|
47
|
+
{labelDivider}
|
|
48
|
+
</div>
|
|
27
49
|
|
|
28
|
-
|
|
29
|
-
|
|
50
|
+
<SignInForm
|
|
51
|
+
{labelEmail}
|
|
52
|
+
{labelPassword}
|
|
53
|
+
{labellLinkEmailForm}
|
|
54
|
+
{linkForgetPassword}
|
|
55
|
+
{labelBtnFormEmail}
|
|
56
|
+
/>
|
|
57
|
+
</Card.Content>
|
|
30
58
|
</Card.Root>
|
|
@@ -1,4 +1,14 @@
|
|
|
1
1
|
declare const SignIn: import("svelte").Component<{
|
|
2
|
-
title
|
|
2
|
+
title: string;
|
|
3
|
+
subtitle: string;
|
|
4
|
+
textLink: string;
|
|
5
|
+
link: string;
|
|
6
|
+
labelBtnGoogle: string;
|
|
7
|
+
labelEmail: string;
|
|
8
|
+
labelPassword: string;
|
|
9
|
+
labellLinkEmailForm: string;
|
|
10
|
+
linkForgetPassword: string;
|
|
11
|
+
labelBtnFormEmail: string;
|
|
12
|
+
labelDivider: string;
|
|
3
13
|
}, {}, "">;
|
|
4
14
|
export default SignIn;
|
package/dist/auth/sign-up.svelte
CHANGED
|
@@ -1,30 +1,69 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
import SignInWithGoogle from "../components/auth/google-sign-in.svelte";
|
|
3
|
+
import SignUpForm from "../components/auth/sign-up-form.svelte";
|
|
4
|
+
import Button from "../components/ui/button/button.svelte";
|
|
5
|
+
import * as Card from "../components/ui/card/index.js";
|
|
6
|
+
// let { title = "Sign up" }: { title: string } = $props();
|
|
7
|
+
|
|
8
|
+
let {
|
|
9
|
+
title = "Sign up",
|
|
10
|
+
subtitle = "Already have an account?",
|
|
11
|
+
labelLink = "Sign in here",
|
|
12
|
+
link = "/sign-in",
|
|
13
|
+
labelBtnGoogle = "Sign up with",
|
|
14
|
+
labelFisrtName = "First Name",
|
|
15
|
+
labelLastName = "Last Name",
|
|
16
|
+
labelEmail = "Email",
|
|
17
|
+
labelPassword = "Password",
|
|
18
|
+
linkTerms = "/terms-and-conditions",
|
|
19
|
+
labelTerms = "I accept the",
|
|
20
|
+
labelLinkTerms = "Terms and Conditions",
|
|
21
|
+
labelBtnFormEmail = "Sign up",
|
|
22
|
+
labelDivider = "Or",
|
|
23
|
+
}: {
|
|
24
|
+
title: string;
|
|
25
|
+
subtitle: string;
|
|
26
|
+
labelLink: string;
|
|
27
|
+
link: string;
|
|
28
|
+
labelBtnGoogle: string;
|
|
29
|
+
labelFisrtName: string;
|
|
30
|
+
labelLastName: string;
|
|
31
|
+
labelEmail: string;
|
|
32
|
+
labelPassword: string;
|
|
33
|
+
linkTerms: string;
|
|
34
|
+
labelTerms: string;
|
|
35
|
+
labelLinkTerms: string;
|
|
36
|
+
labelBtnFormEmail: string;
|
|
37
|
+
labelDivider: string;
|
|
38
|
+
} = $props();
|
|
7
39
|
</script>
|
|
8
40
|
|
|
9
41
|
<Card.Root class="sm:w-[448px]">
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
<Card.Content class="space-y-5">
|
|
20
|
-
<SignInWithGoogle label="Sign up" />
|
|
42
|
+
<Card.Header>
|
|
43
|
+
<Card.Title class="text-center text-2xl">{title}</Card.Title>
|
|
44
|
+
<Card.Description class="text-center">
|
|
45
|
+
{subtitle}
|
|
46
|
+
<Button variant="link" href={link} class="p-0">{labelLink}</Button>
|
|
47
|
+
</Card.Description>
|
|
48
|
+
</Card.Header>
|
|
49
|
+
<Card.Content class="space-y-5">
|
|
50
|
+
<SignInWithGoogle label={labelBtnGoogle} />
|
|
21
51
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
52
|
+
<div
|
|
53
|
+
class="before:muted-foreground after:muted-foreground flex items-center text-xs uppercase text-muted-foreground before:me-6 before:flex-1 before:border-t after:ms-6 after:flex-1 after:border-t dark:before:border-muted-foreground dark:after:border-muted-foreground"
|
|
54
|
+
>
|
|
55
|
+
{labelDivider}
|
|
56
|
+
</div>
|
|
27
57
|
|
|
28
|
-
|
|
29
|
-
|
|
58
|
+
<SignUpForm
|
|
59
|
+
{labelFisrtName}
|
|
60
|
+
{labelLastName}
|
|
61
|
+
{labelEmail}
|
|
62
|
+
{labelPassword}
|
|
63
|
+
{linkTerms}
|
|
64
|
+
{labelTerms}
|
|
65
|
+
{labelLinkTerms}
|
|
66
|
+
{labelBtnFormEmail}
|
|
67
|
+
/>
|
|
68
|
+
</Card.Content>
|
|
30
69
|
</Card.Root>
|
|
@@ -1,4 +1,17 @@
|
|
|
1
1
|
declare const SignUp: import("svelte").Component<{
|
|
2
2
|
title: string;
|
|
3
|
+
subtitle: string;
|
|
4
|
+
labelLink: string;
|
|
5
|
+
link: string;
|
|
6
|
+
labelBtnGoogle: string;
|
|
7
|
+
labelFisrtName: string;
|
|
8
|
+
labelLastName: string;
|
|
9
|
+
labelEmail: string;
|
|
10
|
+
labelPassword: string;
|
|
11
|
+
linkTerms: string;
|
|
12
|
+
labelTerms: string;
|
|
13
|
+
labelLinkTerms: string;
|
|
14
|
+
labelBtnFormEmail: string;
|
|
15
|
+
labelDivider: string;
|
|
3
16
|
}, {}, "">;
|
|
4
17
|
export default SignUp;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import * as Sidebar from "../../ui/sidebar/index.js";
|
|
3
|
+
import type { ComponentProps } from "svelte";
|
|
4
|
+
// import SidebarOptInForm from "./sidebar-opt-in-form.svelte";
|
|
5
|
+
import { firekitAuthManager } from "../../../firebase/auth/auth-manager.svelte.js";
|
|
6
|
+
import UserButton from "../../auth/user-button/user-button.svelte";
|
|
7
|
+
import NavMain from "../../nav/nav-main.svelte";
|
|
8
|
+
|
|
9
|
+
let {
|
|
10
|
+
ref = $bindable(null),
|
|
11
|
+
collapsible = "icon",
|
|
12
|
+
...restProps
|
|
13
|
+
}: ComponentProps<typeof Sidebar.Root> = $props();
|
|
14
|
+
</script>
|
|
15
|
+
|
|
16
|
+
<Sidebar.Root bind:ref {collapsible} {...restProps}>
|
|
17
|
+
<Sidebar.Header>
|
|
18
|
+
<section class="flex justify-center items-center gap-2 my-4">
|
|
19
|
+
<UserButton></UserButton>
|
|
20
|
+
<div class="flex flex-col">
|
|
21
|
+
<small>{firekitAuthManager.data?.displayName}</small>
|
|
22
|
+
<small>{firekitAuthManager.data?.email}</small>
|
|
23
|
+
</div>
|
|
24
|
+
</section>
|
|
25
|
+
</Sidebar.Header>
|
|
26
|
+
<Sidebar.Content>
|
|
27
|
+
<NavMain />
|
|
28
|
+
</Sidebar.Content>
|
|
29
|
+
<Sidebar.Footer>
|
|
30
|
+
<div class="p-1">
|
|
31
|
+
<!-- <SidebarOptInForm /> -->
|
|
32
|
+
</div>
|
|
33
|
+
</Sidebar.Footer>
|
|
34
|
+
<Sidebar.Rail />
|
|
35
|
+
</Sidebar.Root>
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
declare const AppSidebar: import("svelte").Component<import("svelte/elements").HTMLAttributes<HTMLDivElement> & {
|
|
2
|
+
ref?: HTMLElement | null | undefined;
|
|
3
|
+
} & {
|
|
4
|
+
side?: "left" | "right";
|
|
5
|
+
variant?: "sidebar" | "floating" | "inset";
|
|
6
|
+
collapsible?: "offcanvas" | "icon" | "none";
|
|
7
|
+
}, {}, "ref">;
|
|
8
|
+
export default AppSidebar;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { page } from "$app/stores";
|
|
3
|
+
import { derived } from "svelte/store";
|
|
4
|
+
import * as Breadcrumb from "../../ui/breadcrumb/index.js";
|
|
5
|
+
|
|
6
|
+
// Create a derived store to get breadcrumb items from the URL
|
|
7
|
+
const breadcrumbs = derived(page, ($page) => {
|
|
8
|
+
const path = $page.url.pathname;
|
|
9
|
+
const segments = path.split("/").filter(Boolean); // split path and remove empty segments
|
|
10
|
+
const breadcrumbItems = segments.map((segment, index) => {
|
|
11
|
+
// Construct the path up to this segment
|
|
12
|
+
const href = "/" + segments.slice(0, index + 1).join("/");
|
|
13
|
+
return {
|
|
14
|
+
name: segment
|
|
15
|
+
.replace(/-/g, " ")
|
|
16
|
+
.replace(/\b\w/g, (char) => char.toUpperCase()),
|
|
17
|
+
href,
|
|
18
|
+
};
|
|
19
|
+
});
|
|
20
|
+
return breadcrumbItems;
|
|
21
|
+
});
|
|
22
|
+
</script>
|
|
23
|
+
|
|
24
|
+
<Breadcrumb.Root>
|
|
25
|
+
<Breadcrumb.List>
|
|
26
|
+
{#each $breadcrumbs as breadcrumb, i}
|
|
27
|
+
{#if i > 0}
|
|
28
|
+
<Breadcrumb.Separator class="hidden md:block" />
|
|
29
|
+
{/if}
|
|
30
|
+
<Breadcrumb.Item>
|
|
31
|
+
<!-- Check if it's the last breadcrumb item to render as Page instead of Link -->
|
|
32
|
+
{#if i === $breadcrumbs.length - 1}
|
|
33
|
+
<Breadcrumb.Page>{breadcrumb.name}</Breadcrumb.Page>
|
|
34
|
+
{:else}
|
|
35
|
+
<Breadcrumb.Link href={breadcrumb.href}
|
|
36
|
+
>{breadcrumb.name}</Breadcrumb.Link
|
|
37
|
+
>
|
|
38
|
+
{/if}
|
|
39
|
+
</Breadcrumb.Item>
|
|
40
|
+
{/each}
|
|
41
|
+
</Breadcrumb.List>
|
|
42
|
+
</Breadcrumb.Root>
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import * as Breadcrumb from "../../ui/breadcrumb/index.js";
|
|
2
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
|
3
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
|
4
|
+
$$bindings?: Bindings;
|
|
5
|
+
} & Exports;
|
|
6
|
+
(internal: unknown, props: {
|
|
7
|
+
$$events?: Events;
|
|
8
|
+
$$slots?: Slots;
|
|
9
|
+
}): Exports & {
|
|
10
|
+
$set?: any;
|
|
11
|
+
$on?: any;
|
|
12
|
+
};
|
|
13
|
+
z_$$bindings?: Bindings;
|
|
14
|
+
}
|
|
15
|
+
declare const Breadcrumb: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
|
|
16
|
+
[evt: string]: CustomEvent<any>;
|
|
17
|
+
}, {}, {}, string>;
|
|
18
|
+
type Breadcrumb = InstanceType<typeof Breadcrumb>;
|
|
19
|
+
export default Breadcrumb;
|
|
@@ -1,60 +1,62 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import { firekitAuth } from "../../firebase/auth/auth.js";
|
|
3
|
+
import { toast } from "svelte-sonner";
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
import Button from "../ui/button/button.svelte";
|
|
6
|
+
import { goto } from "$app/navigation";
|
|
7
|
+
let { label = "Sign in with" }: { label: string } = $props();
|
|
7
8
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
9
|
+
async function signInWithGoogle() {
|
|
10
|
+
try {
|
|
11
|
+
await firekitAuth.signInWithGoogle();
|
|
12
|
+
await goto("/dashboard");
|
|
13
|
+
} catch (error) {
|
|
14
|
+
if (error instanceof Error) {
|
|
15
|
+
toast.error(error.message);
|
|
16
|
+
} else {
|
|
17
|
+
toast.error("An error occurred");
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
19
21
|
</script>
|
|
20
22
|
|
|
21
23
|
<Button onclick={signInWithGoogle} class="w-full gap-2" variant="outline">
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
24
|
+
<svg
|
|
25
|
+
class="h-4 w-4 flex-shrink-0"
|
|
26
|
+
width="33"
|
|
27
|
+
height="32"
|
|
28
|
+
viewBox="0 0 33 32"
|
|
29
|
+
fill="none"
|
|
30
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
31
|
+
>
|
|
32
|
+
<g clip-path="url(#clip0_4132_5805)">
|
|
33
|
+
<path
|
|
34
|
+
d="M32.2566 16.36C32.2566 15.04 32.1567 14.08 31.9171 13.08H16.9166V19.02H25.7251C25.5454 20.5 24.5866 22.72 22.4494 24.22L22.4294 24.42L27.1633 28.1L27.4828 28.14C30.5189 25.34 32.2566 21.22 32.2566 16.36Z"
|
|
35
|
+
fill="#4285F4"
|
|
36
|
+
/>
|
|
37
|
+
<path
|
|
38
|
+
d="M16.9166 32C21.231 32 24.8463 30.58 27.5028 28.12L22.4694 24.2C21.1111 25.14 19.3135 25.8 16.9366 25.8C12.7021 25.8 9.12677 23 7.84844 19.16L7.66867 19.18L2.71513 23L2.65521 23.18C5.2718 28.4 10.6648 32 16.9166 32Z"
|
|
39
|
+
fill="#34A853"
|
|
40
|
+
/>
|
|
41
|
+
<path
|
|
42
|
+
d="M7.82845 19.16C7.48889 18.16 7.28915 17.1 7.28915 16C7.28915 14.9 7.48889 13.84 7.80848 12.84V12.62L2.81499 8.73999L2.6552 8.81999C1.55663 10.98 0.937439 13.42 0.937439 16C0.937439 18.58 1.55663 21.02 2.63522 23.18L7.82845 19.16Z"
|
|
43
|
+
fill="#FBBC05"
|
|
44
|
+
/>
|
|
45
|
+
<path
|
|
46
|
+
d="M16.9166 6.18C19.9127 6.18 21.9501 7.48 23.0886 8.56L27.6027 4.16C24.8263 1.58 21.231 0 16.9166 0C10.6648 0 5.27181 3.6 2.63525 8.82L7.80851 12.84C9.10681 8.98 12.6821 6.18 16.9166 6.18Z"
|
|
47
|
+
fill="#EB4335"
|
|
48
|
+
/>
|
|
49
|
+
</g>
|
|
50
|
+
<defs>
|
|
51
|
+
<clipPath id="clip0_4132_5805">
|
|
52
|
+
<rect
|
|
53
|
+
width="32"
|
|
54
|
+
height="32"
|
|
55
|
+
fill="white"
|
|
56
|
+
transform="translate(0.937439)"
|
|
57
|
+
/>
|
|
58
|
+
</clipPath>
|
|
59
|
+
</defs>
|
|
60
|
+
</svg>
|
|
61
|
+
{label} Google
|
|
60
62
|
</Button>
|
|
@@ -1,57 +1,59 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import { goto } from "$app/navigation";
|
|
3
|
+
import { firekitAuth } from "../../firebase/auth/auth.js";
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
import * as Form from "../ui/form/index.js";
|
|
6
|
+
import { Input } from "../ui/input/index.js";
|
|
7
|
+
import { resetPasswordSchema } from "../../schemas/reset-password.js";
|
|
8
|
+
import { toast } from "svelte-sonner";
|
|
9
|
+
import { superForm, defaults } from "sveltekit-superforms";
|
|
10
|
+
import { valibot } from "sveltekit-superforms/adapters";
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
let { redirect }: { redirect: string } = $props();
|
|
13
13
|
|
|
14
|
-
|
|
15
|
-
validators: valibot(resetPasswordSchema),
|
|
16
|
-
dataType: "json",
|
|
17
|
-
SPA: true,
|
|
18
|
-
resetForm: false,
|
|
19
|
-
clearOnSubmit: "errors-and-message",
|
|
20
|
-
async onUpdate({ form }) {
|
|
21
|
-
if (!form.valid) return;
|
|
22
|
-
try {
|
|
23
|
-
const { data } = form;
|
|
24
|
-
const { email } = data;
|
|
25
|
-
await firekitAuth.sendPasswordReset(email);
|
|
26
|
-
toast.success("Password reset email sent");
|
|
27
|
-
goto("/sign-in");
|
|
28
|
-
} catch (error) {
|
|
29
|
-
if (error instanceof Error) {
|
|
30
|
-
toast.error(error.message);
|
|
31
|
-
} else {
|
|
32
|
-
toast.error("An error occurred");
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
});
|
|
14
|
+
const data = defaults(valibot(resetPasswordSchema));
|
|
37
15
|
|
|
38
|
-
|
|
16
|
+
const form = superForm(data, {
|
|
17
|
+
validators: valibot(resetPasswordSchema),
|
|
18
|
+
dataType: "json",
|
|
19
|
+
SPA: true,
|
|
20
|
+
resetForm: false,
|
|
21
|
+
clearOnSubmit: "errors-and-message",
|
|
22
|
+
async onUpdate({ form }) {
|
|
23
|
+
if (!form.valid) return;
|
|
24
|
+
try {
|
|
25
|
+
const { data } = form;
|
|
26
|
+
const { email } = data;
|
|
27
|
+
await firekitAuth.sendPasswordReset(email);
|
|
28
|
+
toast.success("Password reset email sent");
|
|
29
|
+
goto(redirect);
|
|
30
|
+
} catch (error) {
|
|
31
|
+
if (error instanceof Error) {
|
|
32
|
+
toast.error(error.message);
|
|
33
|
+
} else {
|
|
34
|
+
toast.error("An error occurred");
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
const { form: formData, enhance } = form;
|
|
39
41
|
</script>
|
|
40
42
|
|
|
41
43
|
<form method="POST" use:enhance class="space-y-4">
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
44
|
+
<Form.Field {form} name="email">
|
|
45
|
+
<Form.Control>
|
|
46
|
+
{#snippet children({ props })}
|
|
47
|
+
<Form.Label>Email address</Form.Label>
|
|
48
|
+
<Input
|
|
49
|
+
{...props}
|
|
50
|
+
bind:value={$formData.email}
|
|
51
|
+
placeholder="you@email.com"
|
|
52
|
+
/>
|
|
53
|
+
{/snippet}
|
|
54
|
+
</Form.Control>
|
|
55
|
+
<Form.FieldErrors />
|
|
56
|
+
</Form.Field>
|
|
55
57
|
|
|
56
|
-
|
|
58
|
+
<Form.Button class="w-full">Send Email</Form.Button>
|
|
57
59
|
</form>
|
|
@@ -1,18 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
} & Exports;
|
|
5
|
-
(internal: unknown, props: {
|
|
6
|
-
$$events?: Events;
|
|
7
|
-
$$slots?: Slots;
|
|
8
|
-
}): Exports & {
|
|
9
|
-
$set?: any;
|
|
10
|
-
$on?: any;
|
|
11
|
-
};
|
|
12
|
-
z_$$bindings?: Bindings;
|
|
13
|
-
}
|
|
14
|
-
declare const ResetPasswordForm: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
|
|
15
|
-
[evt: string]: CustomEvent<any>;
|
|
16
|
-
}, {}, {}, string>;
|
|
17
|
-
type ResetPasswordForm = InstanceType<typeof ResetPasswordForm>;
|
|
1
|
+
declare const ResetPasswordForm: import("svelte").Component<{
|
|
2
|
+
redirect: string;
|
|
3
|
+
}, {}, "">;
|
|
18
4
|
export default ResetPasswordForm;
|