Skip to content

Commit 054cb80

Browse files
ItzNotABugItzNotABug
committed
Merge branch 'main' into csv-imports-errors
2 parents 592e0a2 + 891c580 commit 054cb80

File tree

9 files changed

+111
-109
lines changed

9 files changed

+111
-109
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
"@appwrite.io/pink-icons": "0.25.0",
2727
"@appwrite.io/pink-icons-svelte": "^2.0.0-RC.1",
2828
"@appwrite.io/pink-legacy": "^1.0.3",
29-
"@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@40bae6b",
29+
"@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@ee1b778",
3030
"@popperjs/core": "^2.11.8",
3131
"@sentry/sveltekit": "^8.38.0",
3232
"@stripe/stripe-js": "^3.5.0",

‎pnpm-lock.yaml

Lines changed: 10 additions & 9 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/lib/components/columnSelector.svelte

Lines changed: 37 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,19 @@
1818
children: Snippet<[toggle: () => void, selectedColumnsNumber: number]>;
1919
} = $props();
2020
21+
let maxHeight = $state('none');
22+
let containerRef;
23+
24+
const calcMaxHeight = () => {
25+
if (containerRef) {
26+
// get parent row element for correct top position
27+
const parent = containerRef.parentElement.parentElement;
28+
const { top } = parent.getBoundingClientRect();
29+
30+
maxHeight = `${window.innerHeight - top - 48}px`;
31+
}
32+
};
33+
2134
onMount(async () => {
2235
if (isCustomCollection) {
2336
const prefs = preferences.getCustomCollectionColumns(page.params.collection);
@@ -50,6 +63,8 @@
5063
preferences.setColumns(columns);
5164
}
5265
});
66+
67+
calcMaxHeight();
5368
});
5469
5570
let selectedColumnsNumber = $derived(
@@ -61,29 +76,32 @@
6176
);
6277
</script>
6378

79+
<svelte:window on:resize={calcMaxHeight} />
6480
{#if $columns?.length}
6581
<Popover let:toggle placement="bottom-end" padding="none">
6682
{@render children(toggle, selectedColumnsNumber)}
6783
<svelte:fragment slot="tooltip">
68-
<ActionMenu.Root>
69-
{#each $columns as column}
70-
{#if !column?.exclude}
71-
<ActionMenu.Item.Button
72-
on:click={() => (column.hide = !column.hide)}
73-
disabled={allowNoColumns
74-
? false
75-
: selectedColumnsNumber <= 1 && column.hide !== true}>
76-
<Layout.Stack direction="row" gap="s">
77-
<Selector.Checkbox
78-
checked={!column.hide}
79-
size="s"
80-
on:click={() => (column.hide = !column.hide)} />
81-
{column.title}
82-
</Layout.Stack>
83-
</ActionMenu.Item.Button>
84-
{/if}
85-
{/each}
86-
</ActionMenu.Root>
84+
<div style:max-height={maxHeight} style:overflow="scroll" bind:this={containerRef}>
85+
<ActionMenu.Root>
86+
{#each $columns as column}
87+
{#if !column?.exclude}
88+
<ActionMenu.Item.Button
89+
on:click={() => (column.hide = !column.hide)}
90+
disabled={allowNoColumns
91+
? false
92+
: selectedColumnsNumber <= 1 && column.hide !== true}>
93+
<Layout.Stack direction="row" gap="s">
94+
<Selector.Checkbox
95+
checked={!column.hide}
96+
size="s"
97+
on:click={() => (column.hide = !column.hide)} />
98+
{column.title}
99+
</Layout.Stack>
100+
</ActionMenu.Item.Button>
101+
{/if}
102+
{/each}
103+
</ActionMenu.Root>
104+
</div>
87105
</svelte:fragment>
88106
</Popover>
89107
{/if}

‎src/lib/components/navbar.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,7 @@
211211
<Popover let:toggle let:showing>
212212
<button
213213
type="button"
214+
style:cursor="pointer"
214215
on:click|preventDefault={(e) => {
215216
toggle(e);
216217
shouldAnimateThemeToggle = false;
@@ -221,7 +222,7 @@
221222
style:user-select="none">
222223
<Avatar size="s" src={avatar} />
223224
</button>
224-
<svelte:fragment slot="tooltip" let:toggle>
225+
<svelte:fragment slot="tooltip">
225226
<ActionMenu.Root noPadding>
226227
<Layout.Stack gap="xxs">
227228
<div
@@ -234,7 +235,6 @@
234235
</div>
235236
<ActionMenu.Item.Anchor
236237
trailingIcon={IconUser}
237-
on:click={toggle}
238238
size="l"
239239
href={`${base}/account`}>
240240
Account</ActionMenu.Item.Anchor>

‎src/lib/layout/responsiveContainerHeader.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
1818
let {
1919
columns,
20-
view = View.Table,
20+
view = $bindable(View.Table),
2121
hideView = false,
2222
hideColumns = false,
2323
hasSearch = false,

‎src/lib/stores/user.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,10 @@ export type Account = Models.User<
1313
>;
1414

1515
export const user = derived(page, ($page) => {
16-
if (browser) sessionStorage.setItem('account', JSON.stringify($page.data.account));
17-
return $page.data.account as Account;
16+
if ($page.data?.account) {
17+
if (browser) {
18+
sessionStorage.setItem('account', JSON.stringify($page.data.account));
19+
}
20+
return $page.data.account as Account;
21+
} else return null;
1822
});

‎src/routes/(console)/project-[region]-[project]/databases/database-[database]/+page.svelte

Lines changed: 15 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,31 @@
11
<script lang="ts">
2-
import { Empty, PaginationWithLimit, SearchQuery, ViewSelector } from '$lib/components';
2+
import { Empty, PaginationWithLimit } from '$lib/components';
33
import { Button } from '$lib/elements/forms';
4-
import { Container } from '$lib/layout';
4+
import { Container, ResponsiveContainerHeader } from '$lib/layout';
55
import { columns, showCreate } from './store';
66
import Table from './table.svelte';
77
import Grid from './grid.svelte';
88
import type { PageData } from './$types';
99
import { canWriteCollections } from '$lib/stores/roles';
10-
import { Icon, Layout } from '@appwrite.io/pink-svelte';
10+
import { Icon } from '@appwrite.io/pink-svelte';
1111
import { IconPlus } from '@appwrite.io/pink-icons-svelte';
1212
1313
export let data: PageData;
1414
</script>
1515

1616
<Container>
17-
<Layout.Stack direction="row" justifyContent="space-between">
18-
<Layout.Stack direction="row" alignItems="center">
19-
<SearchQuery placeholder="Search by name or ID" />
20-
</Layout.Stack>
21-
<Layout.Stack direction="row" alignItems="center" justifyContent="flex-end">
22-
<ViewSelector
23-
{columns}
24-
view={data.view}
25-
hideColumns={!data.collections.total}
26-
hideView={!data.collections.total} />
27-
{#if $canWriteCollections}
28-
<Button on:click={() => ($showCreate = true)} event="create_collection">
29-
<Icon icon={IconPlus} slot="start" size="s" />
30-
Create collection
31-
</Button>
32-
{/if}
33-
</Layout.Stack>
34-
</Layout.Stack>
17+
<ResponsiveContainerHeader
18+
bind:view={data.view}
19+
{columns}
20+
hasSearch
21+
searchPlaceholder="Search by name or ID">
22+
{#if $canWriteCollections}
23+
<Button on:click={() => ($showCreate = true)} event="create_collection">
24+
<Icon icon={IconPlus} slot="start" size="s" />
25+
Create collection
26+
</Button>
27+
{/if}
28+
</ResponsiveContainerHeader>
3529

3630
{#if data.collections.total}
3731
{#if data.view === 'grid'}

‎src/routes/(console)/project-[region]-[project]/messaging/+page.svelte

Lines changed: 15 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
<script lang="ts">
22
import { base } from '$app/paths';
33
import { page } from '$app/state';
4-
import {
5-
Empty,
6-
EmptyFilter,
7-
EmptySearch,
8-
Id,
9-
PaginationWithLimit,
10-
SearchQuery,
11-
ViewSelector
12-
} from '$lib/components';
13-
import { Filters, hasPageQueries } from '$lib/components/filters';
4+
import { Empty, EmptyFilter, EmptySearch, Id, PaginationWithLimit } from '$lib/components';
5+
import { hasPageQueries } from '$lib/components/filters';
146
import { Button } from '$lib/elements/forms';
157
import { toLocaleDateTime } from '$lib/helpers/date';
16-
import { Container } from '$lib/layout';
8+
import { Container, ResponsiveContainerHeader } from '$lib/layout';
179
import { MessagingProviderType } from '@appwrite.io/console';
1810
import CreateMessageDropdown from './createMessageDropdown.svelte';
1911
import FailedModal from './failedModal.svelte';
@@ -105,18 +97,18 @@
10597
</script>
10698

10799
<Container>
108-
<Layout.Stack direction="row" justifyContent="space-between">
109-
<Layout.Stack direction="row" alignItems="center">
110-
<SearchQuery placeholder="Search by description, type, status, or ID" />
111-
</Layout.Stack>
112-
<Layout.Stack direction="row" alignItems="center" justifyContent="flex-end">
113-
<Filters query={data.query} {columns} analyticsSource="messaging_messages" />
114-
<ViewSelector view={data.view} {columns} hideView />
115-
{#if $canWriteMessages}
116-
<CreateMessageDropdown />
117-
{/if}
118-
</Layout.Stack>
119-
</Layout.Stack>
100+
<ResponsiveContainerHeader
101+
{columns}
102+
bind:view={data.view}
103+
hideView
104+
hasFilters
105+
hasSearch
106+
analyticsSource="messaging_messages"
107+
searchPlaceholder="Search by description, type, status, or ID">
108+
{#if $canWriteMessages}
109+
<CreateMessageDropdown />
110+
{/if}
111+
</ResponsiveContainerHeader>
120112

121113
{#if data.messages.total}
122114
<Table.Root

‎src/routes/(console)/project-[region]-[project]/messaging/topics/+page.svelte

Lines changed: 24 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,20 @@
11
<script lang="ts">
22
import { page } from '$app/state';
33
import { Button } from '$lib/elements/forms';
4-
import {
5-
Empty,
6-
EmptySearch,
7-
SearchQuery,
8-
PaginationWithLimit,
9-
EmptyFilter,
10-
ViewSelector
11-
} from '$lib/components';
4+
import { Empty, EmptySearch, PaginationWithLimit, EmptyFilter } from '$lib/components';
125
import Create from './create.svelte';
136
import { goto } from '$app/navigation';
14-
import { Container } from '$lib/layout';
7+
import { Container, ResponsiveContainerHeader } from '$lib/layout';
158
import { base } from '$app/paths';
169
import type { Models } from '@appwrite.io/console';
1710
import type { PageData } from './$types';
1811
import { showCreate } from './store';
19-
import { Filters, hasPageQueries } from '$lib/components/filters';
12+
import { hasPageQueries } from '$lib/components/filters';
2013
import Table from './table.svelte';
2114
import type { Column } from '$lib/helpers/types';
2215
import { writable } from 'svelte/store';
2316
import { canWriteTopics } from '$lib/stores/roles';
24-
import { Icon, Layout } from '@appwrite.io/pink-svelte';
17+
import { Icon } from '@appwrite.io/pink-svelte';
2518
import { View } from '$lib/helpers/load';
2619
import { IconPlus } from '@appwrite.io/pink-icons-svelte';
2720
import { Click, trackEvent } from '$lib/actions/analytics';
@@ -72,26 +65,26 @@
7265
</script>
7366

7467
<Container>
75-
<Layout.Stack direction="row" justifyContent="space-between">
76-
<Layout.Stack direction="row" alignItems="center">
77-
<SearchQuery placeholder="Search by name or ID" />
78-
</Layout.Stack>
79-
<Layout.Stack direction="row" alignItems="center" justifyContent="flex-end">
80-
<Filters query={data.query} {columns} analyticsSource="messaging_topics_filter" />
81-
<ViewSelector view={View.Table} {columns} hideView />
82-
{#if $canWriteTopics}
83-
<Button
84-
on:click={() => {
85-
$showCreate = true;
86-
trackEvent(Click.MessagingTopicCreateClick);
87-
}}
88-
event="create_topic">
89-
<Icon icon={IconPlus} slot="start" size="s" />
90-
Create topic
91-
</Button>
92-
{/if}
93-
</Layout.Stack>
94-
</Layout.Stack>
68+
<ResponsiveContainerHeader
69+
{columns}
70+
view={View.Table}
71+
hideView
72+
hasFilters
73+
hasSearch
74+
analyticsSource="messaging_topics_filter"
75+
searchPlaceholder="Search by name or ID">
76+
{#if $canWriteTopics}
77+
<Button
78+
on:click={() => {
79+
$showCreate = true;
80+
trackEvent(Click.MessagingTopicCreateClick);
81+
}}
82+
event="create_topic">
83+
<Icon icon={IconPlus} slot="start" size="s" />
84+
Create topic
85+
</Button>
86+
{/if}
87+
</ResponsiveContainerHeader>
9588

9689
{#if data.topics.total}
9790
<Table columns={$columns} {data} />

0 commit comments

Comments
 (0)