diff --git a/src/lib/helpers/cache.ts b/src/lib/helpers/cache.ts new file mode 100644 index 000000000..770af75f6 --- /dev/null +++ b/src/lib/helpers/cache.ts @@ -0,0 +1,20 @@ +import { browser } from '$app/env'; +import { writable, type Writable } from 'svelte/store'; + +export function cachedStore>( + id: string, + callback: (store: Writable) => TMethods +): TMethods & Writable { + const store = writable(browser ? JSON.parse(sessionStorage.getItem(id)) : null); + + if (browser) { + store.subscribe((n) => sessionStorage?.setItem(id, JSON.stringify(n ?? ''))); + } + + return { + subscribe: store.subscribe, + set: store.set, + update: store.update, + ...callback(store) + }; +} diff --git a/src/lib/stores/organization.ts b/src/lib/stores/organization.ts index 80bbbf2e7..fa0cee9a7 100644 --- a/src/lib/stores/organization.ts +++ b/src/lib/stores/organization.ts @@ -1,49 +1,50 @@ import { sdkForConsole } from '$lib/stores/sdk'; import type { Models } from '@aw-labs/appwrite-console'; import { writable } from 'svelte/store'; -import { browser } from '$app/env'; import { get } from 'svelte/store'; import { base } from '$app/paths'; import { goto } from '$app/navigation'; +import { cachedStore } from '$lib/helpers/cache'; -function createOrganizationList() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('organizationList')) : null - ); +export const newOrgModal = writable(false); +export const newMemberModal = writable(false); +export const organizationList = cachedStore< + Models.TeamList, + { + load: () => Promise; + } +>('organizationList', function ({ set }) { return { - subscribe, - set, load: async () => { const response = await sdkForConsole.teams.list(); set(response); } }; -} -function createOrganization() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('organization')) : null - ); +}); +export const organization = cachedStore< + Models.Team, + { + load: (teamId: string) => Promise; + } +>('organization', function ({ set }) { return { - subscribe, - set, - load: async (teamId: string) => { + load: async (teamId) => { const response = await sdkForConsole.teams.get(teamId); set(response); } }; -} - -function createProjectList() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('projectList')) : null - ); +}); +export const projectList = cachedStore< + Models.ProjectList, + { + load: (search: string, limit: number, offset: number) => Promise; + } +>('projectList', function ({ set }) { return { - subscribe, - set, - load: async (search: string, limit: number, offset: number) => { + load: async (search, limit, offset) => { const response = await sdkForConsole.projects.list( search, limit, @@ -55,17 +56,16 @@ function createProjectList() { set(response); } }; -} - -function createMemberList() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('memberList')) : null - ); +}); +export const memberList = cachedStore< + Models.MembershipList, + { + load: (teamId: string, search: string, limit: number, offset: number) => Promise; + } +>('memberList', function ({ set }) { return { - subscribe, - set, - load: async (teamId: string, search: string, limit: number, offset: number) => { + load: async (teamId, search, limit, offset) => { const response = await sdkForConsole.teams.getMemberships( teamId, search, @@ -75,23 +75,7 @@ function createMemberList() { set(response); } }; -} - -export const organizationList = createOrganizationList(); -export const organization = createOrganization(); -export const projectList = createProjectList(); -export const memberList = createMemberList(); -export const newOrgModal = writable(false); -export const newMemberModal = writable(false); - -if (browser) { - organizationList.subscribe((n) => - sessionStorage?.setItem('organizationList', JSON.stringify(n ?? '')) - ); - organization.subscribe((n) => sessionStorage?.setItem('organization', JSON.stringify(n ?? ''))); - projectList.subscribe((n) => sessionStorage?.setItem('projectList', JSON.stringify(n ?? ''))); - memberList.subscribe((n) => sessionStorage?.setItem('memberList', JSON.stringify(n ?? ''))); -} +}); export const redirectTo = async () => { let org = get(organization); diff --git a/src/routes/console/account/activity.svelte b/src/routes/console/account/activity.svelte index 5f00d11e2..1fee31deb 100644 --- a/src/routes/console/account/activity.svelte +++ b/src/routes/console/account/activity.svelte @@ -14,10 +14,16 @@ import { toLocaleDateTime } from '$lib/helpers/date'; import { sdkForConsole } from '$lib/stores/sdk'; import { pageLimit } from '$lib/stores/layout'; + import { onMount } from 'svelte'; + import { accountActivity } from './store'; let offset = 0; - $: request = sdkForConsole.account.getLogs($pageLimit, offset); + onMount(async () => { + await accountActivity.load($pageLimit, offset); + }); + + $: accountActivity.load($pageLimit, offset); const getBrowser = (clientCode: string) => { return sdkForConsole.avatars.getBrowser(clientCode, 40, 40); @@ -25,82 +31,78 @@ - {#await request} -
- {:then response} - {#if response.total} - - - Date - Event - Client - Location - IP - - - {#each response.logs as log} - - {toLocaleDateTime(log.time)} - {log.event} + {#if $accountActivity?.total} +
+ + Date + Event + Client + Location + IP + + + {#each $accountActivity.logs as log} + + {toLocaleDateTime(log.time)} + {log.event} - - {#if log.clientName} -
-
- {log.clientName} -
-

- {log.clientName} - {log.clientVersion} - on {log.osName} - {log.osVersion} -

+ + {#if log.clientName} +
+
+ {log.clientName}
- {:else} -
- -

Unknown

-
- {/if} - +

+ {log.clientName} + {log.clientVersion} + on {log.osName} + {log.osVersion} +

+
+ {:else} +
+ +

Unknown

+
+ {/if} + - - {#if log.countryCode !== '--'} - {log.countryName} - {:else} - Unknown - {/if} - - {log.ip} - - {/each} - -
- {:else} - -
-
-

No logs available

-
-
- -
+ + {#if log.countryCode !== '--'} + {log.countryName} + {:else} + Unknown + {/if} + + {log.ip} + + {/each} + + + {:else} + +
+
+

No logs available

- - {/if} -
-

Total results: {response.total}

- -
- {/await} +
+ +
+
+ + {/if} +
+

Total results: {$accountActivity?.total}

+ +
diff --git a/src/routes/console/account/sessions.svelte b/src/routes/console/account/sessions.svelte index 6bc5c6eca..de4eb84ef 100644 --- a/src/routes/console/account/sessions.svelte +++ b/src/routes/console/account/sessions.svelte @@ -15,23 +15,27 @@ import { sdkForConsole } from '$lib/stores/sdk'; import { pageLimit } from '$lib/stores/layout'; import type { Models } from '@aw-labs/appwrite-console'; + import { accountSession } from './store'; + import { onMount } from 'svelte'; let offset = 0; + onMount(async () => { + await accountSession.load(); + }); + const getBrowser = (clientCode: string) => { return sdkForConsole.avatars.getBrowser(clientCode, 40, 40); }; - const logout = (session: Models.Session) => { - sdkForConsole.account.deleteSession(session.$id); - request = sdkForConsole.account.getSessions(); + const logout = async (session: Models.Session) => { + await sdkForConsole.account.deleteSession(session.$id); + await accountSession.load(); }; - const logoutAll = () => { - sdkForConsole.account.deleteSessions(); - request = sdkForConsole.account.getSessions(); + const logoutAll = async () => { + await sdkForConsole.account.deleteSessions(); + await accountSession.load(); }; - - $: request = sdkForConsole.account.getSessions(); @@ -42,83 +46,80 @@ Logout all sessions
- {#await request} -
- {:then response} - {#if response.total} - - - Client - Location - IP - - - - {#each response.sessions as session} - - -
-
- {#if session.clientName} -
- {session.clientName} -
-

- {session.clientName} - {session.clientVersion} - on {session.osName} - {session.osVersion} -

- {:else} - -

Unknown

- {/if} -
- {session.provider} - {#if session.current} - current session + {#if $accountSession?.total} +
+ + Client + Location + IP + + + + {#each $accountSession.sessions as session} + + +
+
+ {#if session.clientName} +
+ {session.clientName} +
+

+ {session.clientName} + {session.clientVersion} + on {session.osName} + {session.osVersion} +

+ {:else} + +

Unknown

{/if}
- - - {#if session.countryCode !== '--'} - {session.countryName} - {:else} - Unknown + + {session.provider} + {#if session.current} + current session {/if} - - {session.ip} - - - - - {/each} - -
- {:else} - -
-
-

No sessions available

-
-
- -
+
+ + + {#if session.countryCode !== '--'} + {session.countryName} + {:else} + Unknown + {/if} + + {session.ip} + + + + + {/each} + + + {:else} + +
+
+

No sessions available

- - {/if} -
-

Total results: {response.total}

- -
- {/await} +
+ +
+
+ + {/if} +
+

Total results: {$accountSession?.total}

+ +
diff --git a/src/routes/console/account/store.ts b/src/routes/console/account/store.ts new file mode 100644 index 000000000..798a4cd5d --- /dev/null +++ b/src/routes/console/account/store.ts @@ -0,0 +1,30 @@ +import { cachedStore } from '$lib/helpers/cache'; +import { sdkForConsole } from '$lib/stores/sdk'; +import type { Models } from '@aw-labs/appwrite-console'; + +export const accountSession = cachedStore< + Models.SessionList, + { + load: () => Promise; + } +>('accountSession', function ({ set }) { + return { + load: async () => { + const response = await sdkForConsole.account.getSessions(); + set(response); + } + }; +}); +export const accountActivity = cachedStore< + Models.LogList, + { + load: (limit: number, offset: number) => Promise; + } +>('accountActivity', function ({ set }) { + return { + load: async (limit, offset) => { + const response = await sdkForConsole.account.getLogs(limit, offset); + set(response); + } + }; +}); diff --git a/src/routes/console/project-[project]/authentication/store.ts b/src/routes/console/project-[project]/authentication/store.ts index 05c493c91..923c37ddc 100644 --- a/src/routes/console/project-[project]/authentication/store.ts +++ b/src/routes/console/project-[project]/authentication/store.ts @@ -1,17 +1,15 @@ import { sdkForProject } from '$lib/stores/sdk'; -import { writable } from 'svelte/store'; import type { Models } from '@aw-labs/appwrite-console'; -import { browser } from '$app/env'; - -function createUsersListStore() { - const { subscribe, set } = writable>>( - browser ? JSON.parse(sessionStorage.getItem('users')) : null - ); +import { cachedStore } from '$lib/helpers/cache'; +export const usersList = cachedStore< + Models.UserList>, + { + load: (search: string, limit: number, offset: number) => Promise; + } +>('users', function ({ set }) { return { - subscribe, - set, - load: async (search: string, limit: number, offset: number) => { + load: async (search, limit, offset) => { const response = await sdkForProject.users.list( search, limit, @@ -23,17 +21,16 @@ function createUsersListStore() { set(response); } }; -} - -function createTeamsListStore() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('teams')) : null - ); +}); +export const teamsList = cachedStore< + Models.TeamList, + { + load: (search: string, limit: number, offset: number) => Promise; + } +>('teams', function ({ set }) { return { - subscribe, - set, - load: async (search: string, limit: number, offset: number) => { + load: async (search, limit, offset) => { const response = await sdkForProject.teams.list( search, limit, @@ -45,28 +42,18 @@ function createTeamsListStore() { set(response); } }; -} -function createUsersUsageStore() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('usersUsage')) : null - ); +}); +export const usersUsage = cachedStore< + Models.UsageUsers, + { + load: (range: string) => Promise; + } +>('usersUsage', function ({ set }) { return { - subscribe, - set, - load: async (range: string) => { + load: async (range) => { const response = await sdkForProject.users.getUsage(range); set(response); } }; -} - -export const usersList = createUsersListStore(); -export const teamsList = createTeamsListStore(); -export const usersUsage = createUsersUsageStore(); - -if (browser) { - usersList.subscribe((n) => sessionStorage?.setItem('users', JSON.stringify(n ?? ''))); - teamsList.subscribe((n) => sessionStorage?.setItem('teams', JSON.stringify(n ?? ''))); - usersUsage.subscribe((n) => sessionStorage?.setItem('usersUsage', JSON.stringify(n ?? ''))); -} +}); diff --git a/src/routes/console/project-[project]/authentication/teams/[team]/store.ts b/src/routes/console/project-[project]/authentication/teams/[team]/store.ts index be2f534a0..a90f90d4c 100644 --- a/src/routes/console/project-[project]/authentication/teams/[team]/store.ts +++ b/src/routes/console/project-[project]/authentication/teams/[team]/store.ts @@ -1,31 +1,28 @@ import { sdkForProject } from '$lib/stores/sdk'; import type { Models } from '@aw-labs/appwrite-console'; -import { writable } from 'svelte/store'; -import { browser } from '$app/env'; - -function createTeamStore() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('team')) : null - ); +import { cachedStore } from '$lib/helpers/cache'; +export const team = cachedStore< + Models.Team, + { + load: (teamId: string) => Promise; + } +>('team', function ({ set }) { return { - subscribe, - set, load: async (teamId: string) => { const response = await sdkForProject.teams.get(teamId); set(response); } }; -} -function createMembershipStore() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('memberships')) : null - ); - +}); +export const memberships = cachedStore< + Models.MembershipList, + { + load: (teamId: string, search: string, limit: number, offset: number) => Promise; + } +>('memberships', function ({ set }) { return { - subscribe, - set, - load: async (teamId: string, search: string, limit: number, offset: number) => { + load: async (teamId, search, limit, offset) => { const response = await sdkForProject.teams.getMemberships( teamId, search, @@ -38,12 +35,4 @@ function createMembershipStore() { set(response); } }; -} - -export const memberships = createMembershipStore(); -export const team = createTeamStore(); - -if (browser) { - team.subscribe((n) => sessionStorage?.setItem('team', JSON.stringify(n ?? ''))); - memberships.subscribe((n) => sessionStorage?.setItem('memberships', JSON.stringify(n ?? ''))); -} +}); diff --git a/src/routes/console/project-[project]/authentication/user/[user]/store.ts b/src/routes/console/project-[project]/authentication/user/[user]/store.ts index b75052132..bd6bdc02f 100644 --- a/src/routes/console/project-[project]/authentication/user/[user]/store.ts +++ b/src/routes/console/project-[project]/authentication/user/[user]/store.ts @@ -1,25 +1,17 @@ import { sdkForProject } from '$lib/stores/sdk'; import type { Models } from '@aw-labs/appwrite-console'; -import { writable } from 'svelte/store'; -import { browser } from '$app/env'; - -function createUserStore() { - const { subscribe, set } = writable>>( - browser ? JSON.parse(sessionStorage.getItem('selectedUser')) : null - ); +import { cachedStore } from '$lib/helpers/cache'; +export const user = cachedStore< + Models.User>, + { + load: (userId: string) => Promise; + } +>('selectedUser', function ({ set }) { return { - subscribe, - set, load: async (userId: string) => { const response = await sdkForProject.users.get(userId); set(response); } }; -} - -export const user = createUserStore(); - -if (browser) { - user.subscribe((n) => sessionStorage?.setItem('selectedUser', JSON.stringify(n ?? ''))); -} +}); diff --git a/src/routes/console/project-[project]/storage/bucket/[bucket]/file/[file]/store.ts b/src/routes/console/project-[project]/storage/bucket/[bucket]/file/[file]/store.ts index d4e2d74eb..9f48e437e 100644 --- a/src/routes/console/project-[project]/storage/bucket/[bucket]/file/[file]/store.ts +++ b/src/routes/console/project-[project]/storage/bucket/[bucket]/file/[file]/store.ts @@ -1,25 +1,17 @@ import { sdkForProject } from '$lib/stores/sdk'; import type { Models } from '@aw-labs/appwrite-console'; -import { writable } from 'svelte/store'; -import { browser } from '$app/env'; - -function createFileStore() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('file')) : null - ); +import { cachedStore } from '$lib/helpers/cache'; +export const file = cachedStore< + Models.File, + { + load: (bucketId: string, fileId: string) => Promise; + } +>('file', function ({ set }) { return { - subscribe, - set, - load: async (bucketId: string, fileId: string) => { + load: async (bucketId, fileId) => { const response = await sdkForProject.storage.getFile(bucketId, fileId); set(response); } }; -} - -export const file = createFileStore(); - -if (browser) { - file.subscribe((n) => sessionStorage?.setItem('file', JSON.stringify(n ?? ''))); -} +}); diff --git a/src/routes/console/project-[project]/storage/store.ts b/src/routes/console/project-[project]/storage/store.ts index 0418b6106..6078297c2 100644 --- a/src/routes/console/project-[project]/storage/store.ts +++ b/src/routes/console/project-[project]/storage/store.ts @@ -1,25 +1,17 @@ import { sdkForProject } from '$lib/stores/sdk'; import type { Models } from '@aw-labs/appwrite-console'; -import { writable } from 'svelte/store'; -import { browser } from '$app/env'; - -function createBucketListStore() { - const { subscribe, set } = writable( - browser ? JSON.parse(sessionStorage.getItem('bucketList')) : null - ); +import { cachedStore } from '$lib/helpers/cache'; +export const bucketList = cachedStore< + Models.BucketList, + { + load: (search: string, limit: number, offset: number) => Promise; + } +>('bucketList', function ({ set }) { return { - subscribe, - set, - load: async (search: string, limit: number, offset: number) => { + load: async (search, limit, offset) => { const response = await sdkForProject.storage.listBuckets(search, limit, offset); set(response); } }; -} - -export const bucketList = createBucketListStore(); - -if (browser) { - bucketList.subscribe((n) => sessionStorage?.setItem('bucketList', JSON.stringify(n ?? ''))); -} +}); diff --git a/src/routes/console/project-[project]/store.ts b/src/routes/console/project-[project]/store.ts index 83a1a5c53..45c291faf 100644 --- a/src/routes/console/project-[project]/store.ts +++ b/src/routes/console/project-[project]/store.ts @@ -1,18 +1,17 @@ import { sdkForConsole } from '$lib/stores/sdk'; import type { Models } from '@aw-labs/appwrite-console'; -import { writable } from 'svelte/store'; - -function createProject() { - const { subscribe, set } = writable(); +import { cachedStore } from '$lib/helpers/cache'; +export const project = cachedStore< + Models.Project, + { + load: (projectId: string) => Promise; + } +>('project', function ({ set }) { return { - subscribe, - set, load: async (projectId: string) => { const project = await sdkForConsole.projects.get(projectId); set(project); } }; -} - -export const project = createProject(); +});