Skip to content

Commit 0bca77c

Browse files
codediodeiocodediodeio
committed
feat: Refactored stores to use Svelte Context. Added SignedIn/Out components
1 parent 388f1ef commit 0bca77c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+3376
-3098
lines changed

‎dist/components/Collection.svelte

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script>import { collectionStore } from "../stores/firestore.js";
2+
export let ref;
3+
export let startWith = void 0;
4+
let store = collectionStore(ref, startWith);
5+
</script>
6+
7+
{#if $store !== undefined}
8+
<slot data={$store} ref={store.ref} count={$store?.length ?? 0} />
9+
{:else}
10+
<slot name="loading" />
11+
{/if}

‎dist/components/Collection.svelte.d.ts

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { SvelteComponent } from "svelte";
2+
import type { CollectionReference, Query } from 'firebase/firestore';
3+
declare const __propDef: {
4+
props: {
5+
ref: string | CollectionReference | Query;
6+
startWith?: any;
7+
};
8+
events: {
9+
[evt: string]: CustomEvent<any>;
10+
};
11+
slots: {
12+
default: {
13+
data: any[];
14+
ref: CollectionReference | Query | null;
15+
count: number;
16+
};
17+
loading: {};
18+
};
19+
};
20+
export type CollectionProps = typeof __propDef.props;
21+
export type CollectionEvents = typeof __propDef.events;
22+
export type CollectionSlots = typeof __propDef.slots;
23+
export default class Collection extends SvelteComponent<CollectionProps, CollectionEvents, CollectionSlots> {
24+
}
25+
export {};

‎dist/components/Doc.svelte

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script>import { docStore } from "../stores/firestore.js";
2+
export let ref;
3+
export let startWith = void 0;
4+
let store = docStore(ref, startWith);
5+
</script>
6+
7+
{#if $store !== undefined}
8+
<slot data={$store} ref={store.ref} />
9+
{:else}
10+
<slot name="loading" />
11+
{/if}

‎dist/components/Doc.svelte.d.ts

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { SvelteComponent } from "svelte";
2+
import type { DocumentReference } from 'firebase/firestore';
3+
declare const __propDef: {
4+
props: {
5+
ref: string | DocumentReference;
6+
startWith?: any;
7+
};
8+
events: {
9+
[evt: string]: CustomEvent<any>;
10+
};
11+
slots: {
12+
default: {
13+
data: any;
14+
ref: DocumentReference | null;
15+
};
16+
loading: {};
17+
};
18+
};
19+
export type DocProps = typeof __propDef.props;
20+
export type DocEvents = typeof __propDef.events;
21+
export type DocSlots = typeof __propDef.slots;
22+
export default class Doc extends SvelteComponent<DocProps, DocEvents, DocSlots> {
23+
}
24+
export {};

‎dist/components/FirebaseApp.svelte

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<script>import { setFirebaseContext } from "../stores/sdk.js";
2+
export let firestore;
3+
export let auth;
4+
setFirebaseContext({ firestore, auth });
5+
</script>
6+
7+
8+
<slot />

‎dist/components/FirebaseApp.svelte.d.ts

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { SvelteComponent } from "svelte";
2+
import type { Auth } from 'firebase/auth';
3+
import type { Firestore } from 'firebase/firestore';
4+
declare const __propDef: {
5+
props: {
6+
firestore: Firestore;
7+
auth: Auth;
8+
};
9+
events: {
10+
[evt: string]: CustomEvent<any>;
11+
};
12+
slots: {
13+
default: {};
14+
};
15+
};
16+
export type FirebaseAppProps = typeof __propDef.props;
17+
export type FirebaseAppEvents = typeof __propDef.events;
18+
export type FirebaseAppSlots = typeof __propDef.slots;
19+
export default class FirebaseApp extends SvelteComponent<FirebaseAppProps, FirebaseAppEvents, FirebaseAppSlots> {
20+
}
21+
export {};

‎dist/components/SignedIn.svelte

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<script>import { userStore } from "../stores/auth.js";
2+
import { getFirebaseContext } from "../stores/sdk.js";
3+
import { signOut } from "firebase/auth";
4+
const auth = getFirebaseContext().auth;
5+
const user = userStore();
6+
</script>
7+
8+
{#if $user}
9+
<slot user={$user} signOut={() => signOut(auth)} />
10+
{/if}

‎dist/components/SignedIn.svelte.d.ts

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { SvelteComponent } from "svelte";
2+
import { signOut, type User } from "firebase/auth";
3+
declare const __propDef: {
4+
props: Record<string, never>;
5+
events: {
6+
[evt: string]: CustomEvent<any>;
7+
};
8+
slots: {
9+
default: {
10+
user: User;
11+
signOut: () => Promise<void>;
12+
};
13+
};
14+
};
15+
export type SignedInProps = typeof __propDef.props;
16+
export type SignedInEvents = typeof __propDef.events;
17+
export type SignedInSlots = typeof __propDef.slots;
18+
export default class SignedIn extends SvelteComponent<SignedInProps, SignedInEvents, SignedInSlots> {
19+
}
20+
export {};

‎dist/components/SignedOut.svelte

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<script>import { userStore } from "../stores/auth.js";
2+
const user = userStore();
3+
</script>
4+
5+
{#if !$user}
6+
<slot />
7+
{/if}

‎dist/components/SignedOut.svelte.d.ts

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { SvelteComponent } from "svelte";
2+
declare const __propDef: {
3+
props: Record<string, never>;
4+
events: {
5+
[evt: string]: CustomEvent<any>;
6+
};
7+
slots: {
8+
default: {};
9+
};
10+
};
11+
export type SignedOutProps = typeof __propDef.props;
12+
export type SignedOutEvents = typeof __propDef.events;
13+
export type SignedOutSlots = typeof __propDef.slots;
14+
export default class SignedOut extends SvelteComponent<SignedOutProps, SignedOutEvents, SignedOutSlots> {
15+
}
16+
export {};

‎dist/components/User.svelte

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<script>import { userStore } from "../stores/auth.js";
2+
const user = userStore();
3+
</script>
4+
5+
{#if $user}
6+
<slot user={$user} />
7+
{:else}
8+
<slot name="signedOut" />
9+
{/if}

‎dist/components/User.svelte.d.ts

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { SvelteComponent } from "svelte";
2+
import type { User } from "firebase/auth";
3+
declare const __propDef: {
4+
props: Record<string, never>;
5+
events: {
6+
[evt: string]: CustomEvent<any>;
7+
};
8+
slots: {
9+
default: {
10+
user: User;
11+
};
12+
signedOut: {};
13+
};
14+
};
15+
export type UserProps = typeof __propDef.props;
16+
export type UserEvents = typeof __propDef.events;
17+
export type UserSlots = typeof __propDef.slots;
18+
export default class User extends SvelteComponent<UserProps, UserEvents, UserSlots> {
19+
}
20+
export {};

‎dist/index.d.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import Doc from './components/Doc.svelte';
2+
import User from './components/User.svelte';
3+
import Collection from './components/Collection.svelte';
4+
import FirebaseApp from './components/FirebaseApp.svelte';
5+
import SignedOut from './components/SignedOut.svelte';
6+
import SignedIn from './components/SignedIn.svelte';
7+
import { docStore } from './stores/firestore.js';
8+
import { collectionStore } from './stores/firestore.js';
9+
import { userStore } from './stores/auth.js';
10+
export { Doc, User, Collection, FirebaseApp, SignedOut, SignedIn, docStore, collectionStore, userStore };

‎dist/index.js

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
// Reexport your entry components here
2+
import User from './components/User.svelte';
3+
import Collection from './components/Collection.svelte';
4+
import Doc from './components/Doc.svelte';
5+
import FirebaseApp from './components/FirebaseApp.svelte';
6+
import SignedIn from './components/SignedIn.svelte';
7+
import SignedOut from './components/SignedOut.svelte';
8+
// import { docStore, collectionStore } from './stores/stores.js';
9+
import { userStore } from './stores/auth.js';
10+
import { docStore, collectionStore } from './stores/firestore.js';
11+
12+
export {
13+
Doc,
14+
User,
15+
Collection,
16+
FirebaseApp,
17+
SignedOut,
18+
SignedIn,
19+
docStore,
20+
collectionStore,
21+
userStore
22+
}

‎dist/stores/auth.d.ts

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
/// <reference types="svelte" />
2+
/**
3+
* @param {any} startWith optional default data. Useful for server-side cookie-based auth
4+
* @returns a store with the current firebase user
5+
*/
6+
export declare function userStore(startWith?: null): {
7+
subscribe: (this: void, run: import("svelte/store").Subscriber<import("@firebase/auth").User | null>, invalidate?: import("svelte/store").Invalidator<import("@firebase/auth").User | null> | undefined) => import("svelte/store").Unsubscriber;
8+
};

‎dist/stores/auth.js

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { writable } from "svelte/store";
2+
import { getFirebaseContext } from "./sdk.js";
3+
import { onAuthStateChanged } from "firebase/auth";
4+
/**
5+
* @param {any} startWith optional default data. Useful for server-side cookie-based auth
6+
* @returns a store with the current firebase user
7+
*/
8+
export function userStore(startWith = null) {
9+
let unsubscribe;
10+
const { auth } = getFirebaseContext();
11+
// Fallback for SSR
12+
if (!globalThis.window) {
13+
const { subscribe } = writable(startWith);
14+
return {
15+
subscribe,
16+
};
17+
}
18+
// Fallback for missing SDK
19+
if (!auth) {
20+
console.warn("Firebase Auth is not initialized. Are you missing FirebaseApp as a parent component?");
21+
const { subscribe } = writable(null);
22+
return {
23+
subscribe,
24+
};
25+
}
26+
const { subscribe } = writable(auth?.currentUser ?? null, (set) => {
27+
unsubscribe = onAuthStateChanged(auth, (user) => {
28+
set(user);
29+
});
30+
return () => unsubscribe();
31+
});
32+
return {
33+
subscribe,
34+
};
35+
}

‎dist/stores/firestore.d.ts

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import type { Query, CollectionReference, DocumentReference, DocumentData } from "firebase/firestore";
2+
import type { Readable } from "svelte/motion";
3+
interface DocStore<T> {
4+
subscribe: (cb: (value: T | null) => void) => void | (() => void);
5+
ref: DocumentReference | null;
6+
id: string;
7+
}
8+
/**
9+
* @param {string|DocumentReference} ref document path or reference
10+
* @param {T} startWith optional default data
11+
* @returns a store with realtime updates on document data
12+
*/
13+
export declare function docStore<T>(ref: string | DocumentReference, startWith?: T): DocStore<T>;
14+
interface CollectionStore<T> {
15+
subscribe: (cb: (value: T | []) => void) => void | (() => void);
16+
ref: CollectionReference | Query | null;
17+
}
18+
/**
19+
* @param {string|Query|CollectionReference} ref collection path, reference, or query
20+
* @param {[]} startWith optional default data
21+
* @returns a store with realtime updates on collection data
22+
*/
23+
export declare function collectionStore<T>(ref: string | Query | CollectionReference, startWith?: T[]): CollectionStore<T[]>;
24+
/**
25+
* experimental, fetch document based on curret user
26+
*/
27+
export declare function userDataStore<T = DocumentData>(collectionPath?: string): Readable<T | null>;
28+
export {};

0 commit comments

Comments
 (0)