Skip to content

Commit 7914146

Browse files
ItzNotABugItzNotABug
committed
Merge branch 'main' into relatonship-lazy-queries
2 parents be9e781 + 536c9f8 commit 7914146

File tree

35 files changed

+416
-310
lines changed

35 files changed

+416
-310
lines changed

‎src/lib/commandCenter/panels/ai.svelte

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -148,7 +148,12 @@
148148
})}
149149
clearOnCallback={false}
150150
on:keydown={(e) => {
151-
if (e.detail.key !== 'Escape') {
151+
const showingExamples = !$isLoading && !answer;
152+
if (e.detail.key === 'Enter' && $input.trim()) {
153+
e.detail.cancel();
154+
return;
155+
}
156+
if (e.detail.key !== 'Escape' && !showingExamples) {
152157
e.detail.cancel();
153158
}
154159
}}
@@ -302,15 +307,27 @@
302307
}
303308
}
304309
305-
:global(.answer ul),
306-
:global(.answer ol) {
310+
:global(.answer ul) {
311+
padding-inline-start: 1rem;
312+
list-style-type: disc;
313+
display: grid;
307314
gap: 1rem;
315+
}
316+
317+
:global(.answer ol) {
318+
padding-inline-start: 1.1rem;
319+
list-style-type: decimal;
308320
display: grid;
321+
gap: 1rem;
309322
}
310323
311324
:global(.answer a) {
312325
text-decoration: underline;
313326
}
327+
328+
:global(.answer a:hover) {
329+
opacity: 0.8;
330+
}
314331
}
315332
316333
.experimental {

‎src/lib/components/bottomModalAlert.svelte

Lines changed: 59 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
import { hideNotification, shouldShowNotification } from '$lib/helpers/notifications';
44
import { app } from '$lib/stores/app';
55
import {
6-
type BottomModalAlertAction,
76
type BottomModalAlertItem,
87
bottomModalAlertsConfig,
98
dismissBottomModalAlert,
@@ -20,18 +19,18 @@
2019
import { goto } from '$app/navigation';
2120
import { Typography } from '@appwrite.io/pink-svelte';
2221
23-
let currentIndex = 0;
24-
let openModalOnMobile = false;
22+
let currentIndex = $state(0);
23+
let openModalOnMobile = $state(false);
2524
26-
function getPageScope(pathname: string) {
27-
const isProjectPage = pathname.includes('project-[region]-[project]');
28-
const isOrganizationPage = pathname.includes('organization-[organization]');
25+
function getPageScope(route: string) {
26+
const isProjectPage = route.includes('project-[region]-[project]');
27+
const isOrganizationPage = route.includes('organization-[organization]');
2928
3029
return { isProjectPage, isOrganizationPage };
3130
}
3231
33-
function filterModalAlerts(alerts: BottomModalAlertItem[], pathname: string) {
34-
const { isProjectPage, isOrganizationPage } = getPageScope(pathname);
32+
function filterModalAlerts(alerts: BottomModalAlertItem[], route: string) {
33+
const { isProjectPage, isOrganizationPage } = getPageScope(route);
3534
3635
return alerts
3736
.sort((a, b) => b.importance - a.importance)
@@ -51,19 +50,32 @@
5150
});
5251
}
5352
54-
$: filteredModalAlerts = filterModalAlerts($bottomModalAlertsConfig.alerts, page.route.id);
53+
const bottomModalAlerts = $derived($bottomModalAlertsConfig.alerts);
5554
56-
$: currentModalAlert = filteredModalAlerts[currentIndex] as BottomModalAlertItem;
55+
const filteredModalAlerts = $derived(filterModalAlerts(bottomModalAlerts, page.route.id));
5756
58-
$: hasOnlyPrimaryCta = typeof currentModalAlert?.learnMore === 'undefined';
57+
const currentModalAlert = $derived(filteredModalAlerts[currentIndex] as BottomModalAlertItem);
5958
60-
function handleClose() {
61-
filteredModalAlerts.forEach((alert) => {
59+
const hasOnlyPrimaryCta = $derived(typeof currentModalAlert?.learnMore === 'undefined');
60+
61+
const isOnOnboarding = $derived(page.route.id.includes('(console)/onboarding'));
62+
63+
function handleClose(id: string | null = null) {
64+
const alerts = !id
65+
? filteredModalAlerts
66+
: filteredModalAlerts.filter((alert) => alert.id === id);
67+
68+
alerts.forEach((alert) => {
6269
const modalAlert = alert;
6370
dismissBottomModalAlert(modalAlert.id);
6471
hideNotification(modalAlert.id, { coolOffPeriod: 24 * 365 });
6572
if (modalAlert.closed) modalAlert.closed();
6673
});
74+
75+
// reset `currentIndex` if we removed the last item
76+
if (currentIndex >= filteredModalAlerts.length - 1) {
77+
currentIndex = Math.max(0, filteredModalAlerts.length - 2);
78+
}
6779
}
6880
6981
function showNext() {
@@ -114,8 +126,13 @@
114126
}
115127
116128
// the button component cannot have both href and on:click!
117-
function triggerWindowLink(alertAction: BottomModalAlertAction, event?: string) {
129+
function triggerWindowLink(alert: BottomModalAlertItem, event?: string) {
130+
const alertAction = alert.cta;
118131
const shouldShowUpgrade = showUpgrade();
132+
133+
// for correct event tracking after removal
134+
const currentModalId = currentModalAlert.id;
135+
119136
const url = shouldShowUpgrade
120137
? $upgradeURL
121138
: alertAction.link({
@@ -130,14 +147,12 @@
130147
}
131148
132149
if (alertAction?.hideOnClick === true) {
133-
// be careful of this one.
134-
// once clicked, its gone!
135-
handleClose();
150+
handleClose(alert.id); // gone!
136151
}
137152
138153
trackEvent(Click.PromoClick, {
139-
promo: currentModalAlert.id,
140-
type: shouldShowUpgrade ? 'upgrade' : (event ?? `cta_click_${currentModalAlert.id}`)
154+
promo: currentModalId,
155+
type: shouldShowUpgrade ? 'upgrade' : (event ?? `cta_click_${currentModalId}`)
141156
});
142157
}
143158
@@ -156,12 +171,10 @@
156171
}
157172
}
158173
159-
onMount(() => {
160-
addBottomModalAlerts();
161-
});
174+
onMount(addBottomModalAlerts);
162175
</script>
163176

164-
{#if filteredModalAlerts.length > 0 && currentModalAlert && !page.url.pathname.includes('console/onboarding')}
177+
{#if !isOnOnboarding && filteredModalAlerts.length > 0 && currentModalAlert}
165178
{@const shouldShowUpgrade = showUpgrade()}
166179
<div class="main-alert-wrapper is-not-mobile">
167180
<div class="alert-container">
@@ -170,7 +183,7 @@
170183
<button
171184
aria-label="Close modal"
172185
class="icon-inline-tag"
173-
on:click={() => handleClose()}>
186+
onclick={() => handleClose()}>
174187
<svg
175188
xmlns="http://www.w3.org/2000/svg"
176189
width="20"
@@ -208,14 +221,19 @@
208221
<button
209222
aria-label="Previous"
210223
class="icon-cheveron-left"
211-
on:click={showPrevious}
224+
style:cursor={currentIndex !== 0 ? 'pointer' : undefined}
225+
onclick={showPrevious}
212226
disabled={currentIndex === 0}
213227
class:active={currentIndex > 0}></button>
214228

215229
<button
216230
aria-label="Next"
217231
class="icon-cheveron-right"
218-
on:click={showNext}
232+
onclick={showNext}
233+
style:cursor={currentIndex !==
234+
filteredModalAlerts.length - 1
235+
? 'pointer'
236+
: undefined}
219237
disabled={currentIndex === filteredModalAlerts.length - 1}
220238
class:active={currentIndex !==
221239
filteredModalAlerts.length - 1}></button>
@@ -243,7 +261,7 @@
243261
fullWidthMobile
244262
secondary={!hasOnlyPrimaryCta}
245263
class={`${hasOnlyPrimaryCta ? 'only-primary-cta' : ''}`}
246-
on:click={() => triggerWindowLink(currentModalAlert.cta)}>
264+
on:click={() => triggerWindowLink(currentModalAlert)}>
247265
{currentModalAlert.cta.text}
248266
</Button>
249267

@@ -276,7 +294,7 @@
276294
<button
277295
aria-label="Close modal"
278296
class="icon-inline-tag"
279-
on:click={() => handleClose()}>
297+
onclick={() => handleClose()}>
280298
<svg
281299
xmlns="http://www.w3.org/2000/svg"
282300
width="20"
@@ -314,14 +332,21 @@
314332
<button
315333
aria-label="Previous"
316334
class="icon-cheveron-left"
317-
on:click={showPrevious}
335+
style:cursor={currentIndex !== 0
336+
? 'pointer'
337+
: undefined}
338+
onclick={showPrevious}
318339
disabled={currentIndex === 0}
319340
class:active={currentIndex > 0}></button>
320341

321342
<button
322343
aria-label="Next"
323344
class="icon-cheveron-right"
324-
on:click={showNext}
345+
onclick={showNext}
346+
style:cursor={currentIndex !==
347+
filteredModalAlerts.length - 1
348+
? 'pointer'
349+
: undefined}
325350
disabled={currentIndex ===
326351
filteredModalAlerts.length - 1}
327352
class:active={currentIndex !==
@@ -352,7 +377,7 @@
352377
fullWidthMobile
353378
on:click={() => {
354379
openModalOnMobile = false;
355-
triggerWindowLink(currentModalAlert.cta);
380+
triggerWindowLink(currentModalAlert);
356381
}}>
357382
{shouldShowUpgrade
358383
? 'Upgrade plan'
@@ -382,13 +407,13 @@
382407
{:else}
383408
{@const mobileConfig = getMobileWindowConfig()}
384409
<!-- we don't need keydown because we show this only on mobile -->
385-
<!-- svelte-ignore a11y-click-events-have-key-events -->
410+
<!-- svelte-ignore a11y_click_events_have_key_events -->
386411
<div
387412
tabindex="0"
388413
role="button"
389414
class:showing={!openModalOnMobile}
390415
class="card notification-card u-width-full-line"
391-
on:click={() => {
416+
onclick={() => {
392417
if (mobileConfig.cta) {
393418
// navigate manually!
394419
triggerMobileWindowLink();
@@ -401,7 +426,7 @@
401426
<Typography.Text variant="m-500" color="--fgcolor-neutral-primary">
402427
{currentModalAlert.title}
403428
</Typography.Text>
404-
<button on:click={hideAllModalAlerts} aria-label="Close">
429+
<button onclick={hideAllModalAlerts} aria-label="Close">
405430
<span class="icon-x"></span>
406431
</button>
407432
</div>

‎src/lib/components/columnSelector.svelte

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
2121
let maxHeight = $state('none');
2222
let containerRef = $state<HTMLElement>(null);
23+
const collectionId = $derived(page.params.collection);
2324
2425
const calcMaxHeight = () => {
2526
if (containerRef) {
@@ -32,35 +33,35 @@
3233
};
3334
3435
const saveColumnPreferences = () => {
35-
const shownColumns = $columns.filter((n) => n.hide !== true).map((n) => n.id);
36+
const shownColumns = $columns.filter((n) => n.hide === true).map((n) => n.id);
3637
3738
if (isCustomCollection) {
38-
preferences.setCustomCollectionColumns(page.params.collection, shownColumns);
39+
preferences.setCustomCollectionColumns(collectionId, shownColumns);
3940
} else {
4041
preferences.setColumns(shownColumns);
4142
}
4243
};
4344
4445
onMount(() => {
4546
if (isCustomCollection) {
46-
const shownColumns = preferences.getCustomCollectionColumns(page.params.collection);
47+
const shownColumns = preferences.getCustomCollectionColumns(collectionId);
4748
48-
columns.update((columns) => {
49-
return columns.map((column) => {
50-
column.hide = !shownColumns.includes(column.id);
49+
columns.update((n) =>
50+
n.map((column) => {
51+
column.hide = shownColumns?.includes(column.id) ?? false;
5152
return column;
52-
});
53-
});
53+
})
54+
);
5455
} else {
5556
const prefs = preferences.get(page.route);
5657
57-
if (prefs?.columns && prefs.columns.length > 0) {
58-
columns.update((cols) => {
59-
return cols.map((column) => {
60-
column.hide = !prefs.columns.includes(column.id);
58+
if (prefs?.columns) {
59+
columns.update((n) =>
60+
n.map((column) => {
61+
column.hide = prefs.columns?.includes(column.id) ?? false;
6162
return column;
62-
});
63-
});
63+
})
64+
);
6465
}
6566
}
6667
@@ -79,7 +80,7 @@
7980
columns.update((cols) =>
8081
cols.map((col) => {
8182
if (col.id === column.id) {
82-
col.hide = !column.hide;
83+
column.hide = !column.hide;
8384
}
8485
return col;
8586
})
@@ -90,6 +91,7 @@
9091
</script>
9192

9293
<svelte:window on:resize={calcMaxHeight} />
94+
9395
{#if $columns?.length}
9496
<Popover let:toggle placement="bottom-end" padding="none">
9597
{@render children(toggle, selectedColumnsNumber)}

‎src/lib/components/permissions/team.svelte

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -88,11 +88,13 @@
8888
{@const exists = $groups.has(role)}
8989
<Table.Row.Button {root} on:click={() => onSelection(role)} disabled={exists}>
9090
<Table.Cell column="checkbox" {root}>
91-
<Selector.Checkbox
92-
size="s"
93-
id={team.$id}
94-
disabled={exists}
95-
checked={exists || selected.has(role)} />
91+
<div style:pointer-events="none">
92+
<Selector.Checkbox
93+
size="s"
94+
id={team.$id}
95+
disabled={exists}
96+
checked={exists || selected.has(role)} />
97+
</div>
9698
</Table.Cell>
9799
<Table.Cell column="team" {root}>
98100
<Layout.Stack direction="row" alignItems="center" gap="s">

‎src/lib/components/permissions/user.svelte

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -90,11 +90,13 @@
9090
{@const exists = $groups.has(role)}
9191
<Table.Row.Button {root} on:click={() => onSelection(role)} disabled={exists}>
9292
<Table.Cell column="checkbox" {root}>
93-
<Selector.Checkbox
94-
size="s"
95-
id={user.$id}
96-
disabled={exists}
97-
checked={exists || selected.has(role)} />
93+
<div style:pointer-events="none">
94+
<Selector.Checkbox
95+
size="s"
96+
id={user.$id}
97+
disabled={exists}
98+
checked={exists || selected.has(role)} />
99+
</div>
98100
</Table.Cell>
99101
<Table.Cell column="user" {root}>
100102
<Layout.Stack direction="row" alignItems="center" gap="s">

‎src/lib/constants.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export enum Dependencies {
1818
INVOICES = 'dependency:invoices',
1919
ADDRESS = 'dependency:address',
2020
UPGRADE_PLAN = 'dependency:upgrade_plan',
21-
CREATE_ORGANIZATION = 'dependency:create_organization',
21+
ORGANIZATIONS = 'dependency:organizations',
2222
PAYMENT_METHODS = 'dependency:paymentMethods',
2323
ORGANIZATION = 'dependency:organization',
2424
MEMBERS = 'dependency:members',

‎src/lib/images/promos/bulk-api-dark.png

76.7 KB
Loading

‎src/lib/images/promos/bulk-api-light.png

64.6 KB
Loading

0 commit comments

Comments
 (0)