mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
feat: replace hard coded limits with store limit
This commit is contained in:
@@ -75,3 +75,4 @@ export function updateLayout(args: updateLayoutArguments) {
|
||||
}
|
||||
|
||||
export const pageLimit = readable(12); // default page limit
|
||||
export const cardLimit = readable(6); // default page limit
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
import { organizationList } from '$lib/stores/organization';
|
||||
import { onMount } from 'svelte';
|
||||
import { sdkForConsole } from '$lib/stores/sdk';
|
||||
import { cardLimit } from '$lib/stores/layout';
|
||||
|
||||
onMount(async () => {
|
||||
await organizationList.load();
|
||||
@@ -28,7 +29,6 @@
|
||||
|
||||
let addOrganization = false;
|
||||
let offset = 0;
|
||||
const limit = 6;
|
||||
</script>
|
||||
|
||||
<Container>
|
||||
@@ -52,7 +52,7 @@
|
||||
};`}>
|
||||
{#each $organizationList.teams as organization, index}
|
||||
{@const avatarList = getMemberships(organization.$id)}
|
||||
{#if index >= offset && index < limit + offset}
|
||||
{#if index >= offset && index < $cardLimit + offset}
|
||||
<GridItem1 href={`${base}/console/organization-${organization.$id}`}>
|
||||
<svelte:fragment slot="eyebrow"
|
||||
>{organization?.total ? organization?.total : 'No'} projects</svelte:fragment>
|
||||
@@ -67,7 +67,7 @@
|
||||
</GridItem1>
|
||||
{/if}
|
||||
{/each}
|
||||
{#if $organizationList?.total < limit + offset && ($organizationList?.total % 2 !== 0 || $organizationList?.total % 4 === 0)}
|
||||
{#if $organizationList?.total < $cardLimit + offset && ($organizationList?.total % 2 !== 0 || $organizationList?.total % 4 === 0)}
|
||||
<Empty isButton on:click={() => (addOrganization = true)}>
|
||||
<p>Create a new organization</p>
|
||||
</Empty>
|
||||
@@ -76,7 +76,7 @@
|
||||
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$organizationList?.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$organizationList?.total} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={$organizationList?.total} />
|
||||
</div>
|
||||
{:else}
|
||||
<Empty isButton single on:click={() => (addOrganization = true)}>
|
||||
@@ -84,7 +84,7 @@
|
||||
</Empty>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$organizationList?.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$organizationList?.total} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={$organizationList?.total} />
|
||||
</div>
|
||||
{/if}
|
||||
</Container>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<script lang="ts">
|
||||
import { updateLayout } from '$lib/stores/layout';
|
||||
import { pageLimit, updateLayout } from '$lib/stores/layout';
|
||||
import { onMount } from 'svelte';
|
||||
import { afterNavigate } from '$app/navigation';
|
||||
import {
|
||||
@@ -24,7 +24,7 @@
|
||||
if ($organization?.$id !== organizationId) {
|
||||
await organization.load(organizationId);
|
||||
}
|
||||
await memberList.load(organizationId, [Query.limit(12)]);
|
||||
await memberList.load(organizationId, [Query.limit($pageLimit)]);
|
||||
updateLayout({
|
||||
navigate: event,
|
||||
title: $organization?.name,
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
import { page } from '$app/stores';
|
||||
import CreateOrganization from '../_createOrganization.svelte';
|
||||
import CreateProject from './_createProject.svelte';
|
||||
import { cardLimit } from '$lib/stores/layout';
|
||||
|
||||
let projects: Models.Project[] = [];
|
||||
$: organizationId = $page.params.organization;
|
||||
@@ -22,7 +23,7 @@
|
||||
async function handle() {
|
||||
await projectList.load([
|
||||
Query.offset(offset),
|
||||
Query.limit(limit),
|
||||
Query.limit($cardLimit),
|
||||
Query.equal('teamId', organizationId)
|
||||
]);
|
||||
}
|
||||
@@ -30,7 +31,6 @@
|
||||
let showCreate = false;
|
||||
let addOrganization = false;
|
||||
let offset = 0;
|
||||
const limit = 6;
|
||||
|
||||
const projectCreated = async (event: CustomEvent<Models.Project>) => {
|
||||
await project.load(event.detail.$id);
|
||||
@@ -84,7 +84,7 @@
|
||||
projects.length > 3 ? '22rem' : '25rem'
|
||||
};`}>
|
||||
{#each $projectList.projects as project, index}
|
||||
{#if index >= offset && index < limit + offset}
|
||||
{#if index >= offset && index < $cardLimit + offset}
|
||||
<GridItem1 href={`${base}/console/project-${project.$id}`}>
|
||||
<svelte:fragment slot="eyebrow">
|
||||
{project?.platforms?.length ? project?.platforms?.length : 'No'} apps
|
||||
@@ -112,7 +112,7 @@
|
||||
</GridItem1>
|
||||
{/if}
|
||||
{/each}
|
||||
{#if projects.length < limit + offset && (projects.length % 2 !== 0 || projects.length % 4 === 0)}
|
||||
{#if projects.length < $cardLimit + offset && (projects.length % 2 !== 0 || projects.length % 4 === 0)}
|
||||
<Empty isButton on:click={() => (showCreate = true)}>
|
||||
<p>Create a new project</p>
|
||||
</Empty>
|
||||
@@ -121,7 +121,7 @@
|
||||
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {projects.length}</p>
|
||||
<Pagination {limit} bind:offset sum={projects.length} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={projects.length} />
|
||||
</div>
|
||||
{:else}
|
||||
<Empty isButton single on:click={() => (showCreate = true)}>
|
||||
@@ -129,7 +129,7 @@
|
||||
</Empty>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {projects?.length}</p>
|
||||
<Pagination {limit} bind:offset sum={projects?.length} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={projects?.length} />
|
||||
</div>
|
||||
{/if}
|
||||
</Container>
|
||||
|
||||
@@ -20,12 +20,12 @@
|
||||
import { base } from '$app/paths';
|
||||
import { teamsList } from '../store';
|
||||
import { Query, type Models } from '@aw-labs/appwrite-console';
|
||||
import { pageLimit } from '$lib/stores/layout';
|
||||
|
||||
let search = '';
|
||||
let showCreate = false;
|
||||
let offset = 0;
|
||||
|
||||
const limit = 25;
|
||||
const project = $page.params.project;
|
||||
const getAvatar = (name: string) => sdkForProject.avatars.getInitials(name, 32, 32).toString();
|
||||
const teamCreated = async (event: CustomEvent<Models.Team>) => {
|
||||
@@ -34,7 +34,7 @@
|
||||
|
||||
$: if (search) offset = 0;
|
||||
$: teamsList.load(
|
||||
[Query.limit(limit), Query.offset(offset), Query.orderDesc('$createdAt')],
|
||||
[Query.limit($pageLimit), Query.offset(offset), Query.orderDesc('$createdAt')],
|
||||
search
|
||||
);
|
||||
</script>
|
||||
@@ -81,7 +81,7 @@
|
||||
</Table>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$teamsList.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$teamsList.total} />
|
||||
<Pagination limit={$pageLimit} bind:offset sum={$teamsList.total} />
|
||||
</div>
|
||||
{:else if search}
|
||||
<Empty single>
|
||||
@@ -97,7 +97,7 @@
|
||||
</Empty>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$teamsList.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$teamsList.total} />
|
||||
<Pagination limit={$pageLimit} bind:offset sum={$teamsList.total} />
|
||||
</div>
|
||||
{:else}
|
||||
<Empty isButton single on:click={() => (showCreate = true)}>
|
||||
|
||||
+2
-3
@@ -17,6 +17,7 @@
|
||||
import DeleteMembership from '../_deleteMembership.svelte';
|
||||
import DeleteAllMemberships from '../_deleteAllMemberships.svelte';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
import { pageLimit } from '$lib/stores/layout';
|
||||
|
||||
const getAvatar = (name: string) => sdkForProject.avatars.getInitials(name, 32, 32).toString();
|
||||
const deleted = () => (request = sdkForProject.users.listMemberships($page.params.user));
|
||||
@@ -27,8 +28,6 @@
|
||||
let showDelete = false;
|
||||
let showDeleteAll = false;
|
||||
|
||||
const limit = 25;
|
||||
|
||||
$: request = sdkForProject.users.listMemberships($page.params.user);
|
||||
</script>
|
||||
|
||||
@@ -97,7 +96,7 @@
|
||||
class="u-flex u-margin-block-start-32
|
||||
u-main-space-between">
|
||||
<p class="text">Total results: {response.total}</p>
|
||||
<Pagination {limit} bind:offset sum={response.total} />
|
||||
<Pagination limit={$pageLimit} bind:offset sum={response.total} />
|
||||
</div>
|
||||
{/await}
|
||||
</Container>
|
||||
|
||||
@@ -9,19 +9,19 @@
|
||||
import { Container } from '$lib/layout';
|
||||
import { base } from '$app/paths';
|
||||
import { databaseList } from './store';
|
||||
import { cardLimit } from '$lib/stores/layout';
|
||||
|
||||
let showCreate = false;
|
||||
let search = '';
|
||||
let offset = 0;
|
||||
|
||||
const limit = 6;
|
||||
const project = $page.params.project;
|
||||
const handleCreate = async (event: CustomEvent<Models.Database>) => {
|
||||
showCreate = false;
|
||||
await goto(`${base}/console/project-${project}/databases/database/${event.detail.$id}`);
|
||||
};
|
||||
|
||||
$: databaseList.load([Query.limit(limit), Query.offset(offset)], search);
|
||||
$: databaseList.load([Query.limit($cardLimit), Query.offset(offset)], search);
|
||||
</script>
|
||||
|
||||
<Container>
|
||||
@@ -48,7 +48,7 @@
|
||||
</Copy>
|
||||
</GridItem1>
|
||||
{/each}
|
||||
{#if ($databaseList.total % 2 !== 0 || $databaseList.total % 4 === 0) && $databaseList.total - offset <= limit}
|
||||
{#if ($databaseList.total % 2 !== 0 || $databaseList.total % 4 === 0) && $databaseList.total - offset <= $cardLimit}
|
||||
<Empty isButton on:click={() => (showCreate = true)}>
|
||||
<p>Create a new database</p>
|
||||
</Empty>
|
||||
@@ -57,7 +57,7 @@
|
||||
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$databaseList.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$databaseList.total} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={$databaseList.total} />
|
||||
</div>
|
||||
{:else}
|
||||
<Empty isButton single on:click={() => (showCreate = true)}>
|
||||
|
||||
@@ -9,12 +9,12 @@
|
||||
import { Container } from '$lib/layout';
|
||||
import { base } from '$app/paths';
|
||||
import { collections } from './store';
|
||||
import { cardLimit } from '$lib/stores/layout';
|
||||
|
||||
let showCreate = false;
|
||||
let search = '';
|
||||
let offset = 0;
|
||||
|
||||
const limit = 6;
|
||||
const project = $page.params.project;
|
||||
const databaseId = $page.params.database;
|
||||
const handleCreate = async (event: CustomEvent<Models.Collection>) => {
|
||||
@@ -24,7 +24,7 @@
|
||||
);
|
||||
};
|
||||
|
||||
$: collections.load(databaseId, [Query.limit(limit), Query.offset(offset)], search);
|
||||
$: collections.load(databaseId, [Query.limit($cardLimit), Query.offset(offset)], search);
|
||||
$: if (search) offset = 0;
|
||||
</script>
|
||||
|
||||
@@ -62,7 +62,7 @@
|
||||
</Copy>
|
||||
</GridItem1>
|
||||
{/each}
|
||||
{#if ($collections.total % 2 !== 0 || $collections.total % 4 === 0) && $collections.total - offset <= limit}
|
||||
{#if ($collections.total % 2 !== 0 || $collections.total % 4 === 0) && $collections.total - offset <= $cardLimit}
|
||||
<Empty isButton on:click={() => (showCreate = true)}>
|
||||
<p>Create a new collection</p>
|
||||
</Empty>
|
||||
@@ -71,7 +71,7 @@
|
||||
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$collections.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$collections.total} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={$collections.total} />
|
||||
</div>
|
||||
{:else if search}
|
||||
<Empty>
|
||||
@@ -87,7 +87,7 @@
|
||||
</Empty>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$collections?.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$collections?.total} />
|
||||
<Pagination limit={$cardLimit} bind:offset sum={$collections?.total} />
|
||||
</div>
|
||||
{:else}
|
||||
<Empty isButton single on:click={() => (showCreate = true)}>
|
||||
|
||||
+2
-2
@@ -17,10 +17,10 @@
|
||||
import { wizard } from '$lib/stores/wizard';
|
||||
import Create from './createDocument.svelte';
|
||||
import { Query } from '@aw-labs/appwrite-console';
|
||||
import { pageLimit } from '$lib/stores/layout';
|
||||
|
||||
let offset = 0;
|
||||
|
||||
const limit = 5;
|
||||
const projectId = $page.params.project;
|
||||
const databaseId = $page.params.database;
|
||||
|
||||
@@ -79,7 +79,7 @@
|
||||
|
||||
<div class="u-flex common-section u-main-space-between">
|
||||
<p class="text">Total results: {$documentList.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$documentList.total} />
|
||||
<Pagination limit={$pageLimit} bind:offset sum={$documentList.total} />
|
||||
</div>
|
||||
{:else}
|
||||
<Empty isButton single on:click={openWizard}>
|
||||
|
||||
+3
-4
@@ -19,6 +19,7 @@
|
||||
import Create from './createIndex.svelte';
|
||||
import Overview from './overviewIndex.svelte';
|
||||
import type { Models } from '@aw-labs/appwrite-console';
|
||||
import { pageLimit } from '$lib/stores/layout';
|
||||
|
||||
let showDropdown = [];
|
||||
let selectedIndex: Models.Index = null;
|
||||
@@ -27,8 +28,6 @@
|
||||
let showDelete = false;
|
||||
let search = '';
|
||||
let offset: number = null;
|
||||
|
||||
const limit = 5;
|
||||
const collectionId = $page.params.collection;
|
||||
const databaseId = $page.params.database;
|
||||
|
||||
@@ -138,7 +137,7 @@
|
||||
</Table>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$indexList?.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$indexList?.total} />
|
||||
<Pagination limit={$pageLimit} bind:offset sum={$indexList?.total} />
|
||||
</div>
|
||||
{:else if search}
|
||||
<Empty>
|
||||
@@ -154,7 +153,7 @@
|
||||
</Empty>
|
||||
<div class="u-flex u-margin-block-start-32 u-main-space-between">
|
||||
<p class="text">Total results: {$indexList?.total}</p>
|
||||
<Pagination {limit} bind:offset sum={$indexList?.total} />
|
||||
<Pagination limit={$pageLimit} bind:offset sum={$indexList?.total} />
|
||||
</div>
|
||||
{:else if $collection.indexes?.length}
|
||||
<Empty isButton single on:click={() => (showCreateIndex = true)}>
|
||||
|
||||
Reference in New Issue
Block a user