Skip to content

Commit 2b07e68

Browse files
TorstenDittmannTorstenDittmann
committed
Merge branch 'feat-pink-v2' of https://github.com/appwrite/console into feat-pink-v2
2 parents a7cb877 + dd7e776 commit 2b07e68

File tree

13 files changed

+158
-66
lines changed

13 files changed

+158
-66
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"e2e:ui": "playwright test tests/e2e --ui"
2020
},
2121
"dependencies": {
22-
"@appwrite.io/console": "https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@640f09c",
22+
"@appwrite.io/console": "https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@75b3e78",
2323
"@appwrite.io/pink-icons": "0.25.0",
2424
"@appwrite.io/pink-icons-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@bcb8ad2b",
2525
"@appwrite.io/pink-legacy": "^1.0.3",

‎pnpm-lock.yaml‎

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

‎src/lib/components/filters/appliedFilter.svelte‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
<script lang="ts">
2+
import { Icon, Layout, Tag, Tooltip } from '@appwrite.io/pink-svelte';
3+
import { queries, tagFormat } from './store';
4+
import { IconX } from '@appwrite.io/pink-icons-svelte';
5+
import { parsedTags } from './setFilters';
6+
import { Button } from '$lib/elements/forms';
7+
8+
$: console.log($parsedTags);
9+
</script>
10+
11+
{#if $parsedTags?.length}
12+
<Layout.Stack direction="row" gap="s" wrap="wrap" alignItems="center" inline>
13+
{#each $parsedTags as tag}
14+
<span>
15+
<Tooltip disabled={Array.isArray(tag.value) ? tag.value?.length < 3 : true}>
16+
<Tag
17+
size="s"
18+
on:click={() => {
19+
queries.removeFilter(tag);
20+
queries.apply();
21+
parsedTags.update((tags) => tags.filter((t) => t.tag !== tag.tag));
22+
}}>
23+
{#key tag.tag}
24+
<span use:tagFormat>{tag.tag}</span>
25+
{/key}
26+
<Icon icon={IconX} size="s" slot="end" />
27+
</Tag>
28+
<span slot="tooltip">{tag?.value?.toString()}</span>
29+
</Tooltip>
30+
</span>
31+
{/each}
32+
<Button
33+
size="s"
34+
text
35+
on:click={() => {
36+
queries.clearAll();
37+
queries.apply();
38+
parsedTags.set([]);
39+
}}>Clear all</Button>
40+
</Layout.Stack>
41+
{/if}

‎src/lib/components/filters/menu.svelte‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
22
import { Button } from '$lib/elements/forms';
3-
import { Card, Divider, Icon } from '@appwrite.io/pink-svelte';
3+
import { Card, Icon } from '@appwrite.io/pink-svelte';
44
import { tags } from './store';
55
import { IconFilterLine } from '@appwrite.io/pink-icons-svelte';
66
import { createMenubar, melt } from '@melt-ui/svelte';
@@ -33,9 +33,7 @@
3333
<div class="menu" use:melt={$menu}>
3434
<Card.Base padding="xxxs">
3535
<slot />
36-
<div use:melt={$separator}>
37-
<Divider />
38-
</div>
36+
<div class="separator" use:melt={$separator} />
3937
<slot name="end" />
4038
</Card.Base>
4139
</div>
@@ -46,4 +44,12 @@
4644
min-width: 244px;
4745
z-index: 20;
4846
}
47+
48+
.separator {
49+
height: 1px;
50+
margin-block: 2px;
51+
margin-inline-start: calc(var(--base-4) * -1);
52+
width: calc(100% + var(--base-8));
53+
background-color: var(--border-neutral);
54+
}
4955
</style>

‎src/lib/components/filters/setFilters.ts‎

Lines changed: 56 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
import type { Column } from '$lib/helpers/types';
2+
import { get, writable } from 'svelte/store';
23
import { resetOptions, type FilterData } from './quickFilters';
3-
import type { TagValue } from './store';
4+
import { tags, type TagValue } from './store';
5+
6+
export const parsedTags = writable<TagValue[]>([]);
47

58
export function setFiltersOnNavigate(
69
tags: TagValue[],
@@ -14,15 +17,15 @@ export function setFiltersOnNavigate(
1417
} else {
1518
filterCols.forEach((filter) => {
1619
if (filter.id === 'buildDuration') {
17-
setTimeFilter(tags, filter, $columns);
20+
setTimeFilter(filter, $columns);
1821
} else if (filter.id.includes('size')) {
19-
setSizeFilter(tags, filter, $columns);
22+
setSizeFilter(filter, $columns);
2023
} else if (filter.id === 'statusCode') {
21-
setStatusCodeFilter(tags, filter, $columns);
24+
setStatusCodeFilter(filter, $columns);
2225
} else if (filter.id === '$createdAt' || filter.id === '$updatedAt') {
23-
setDateFilter(tags, filter, $columns);
26+
setDateFilter(filter, $columns);
2427
} else {
25-
setFilterData(filter, tags);
28+
setFilterData(filter);
2629
}
2730
});
2831

@@ -31,26 +34,37 @@ export function setFiltersOnNavigate(
3134
}
3235
}
3336

34-
export function setFilterData(filter: FilterData, list: TagValue[]) {
35-
const tagData = list.find((tag) => tag.tag.includes(`**${filter.title}**`));
37+
export function setFilterData(filter: FilterData) {
38+
const tagData = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
3639
if (tagData) {
40+
cleanOldTags(filter.title);
41+
3742
filter.tag = tagData.tag;
3843
if (Array.isArray(tagData.value) && tagData.value?.length) {
3944
const values = tagData.value as string[];
4045
filter.options.forEach((option) => {
4146
option.checked = values.includes(option.value);
4247
});
4348
}
49+
const newTag = {
50+
tag: tagData.tag.replace(',', ' or '),
51+
value: tagData.value
52+
};
53+
parsedTags.update((tags) => {
54+
tags.push(newTag);
55+
return tags;
56+
});
4457
} else {
4558
filter.tag = null;
4659
resetOptions(filter);
4760
}
4861
}
4962

50-
export function setTimeFilter(localTags: TagValue[], filter: FilterData, columns: Column[]) {
63+
export function setTimeFilter(filter: FilterData, columns: Column[]) {
5164
const col = columns.find((c) => c.id === filter.id);
52-
const timeTag = localTags.find((tag) => tag.tag.includes(`**${filter.title}**`));
65+
const timeTag = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
5366
if (timeTag) {
67+
cleanOldTags(filter.title);
5468
const now = new Date();
5569

5670
const diff = now.getTime() - new Date(timeTag.value as string).getTime();
@@ -62,16 +76,24 @@ export function setTimeFilter(localTags: TagValue[], filter: FilterData, columns
6276
return prev;
6377
});
6478
if (dateRange) {
79+
const newTag = {
80+
tag: `**${filter.title}** is **${dateRange.label}**`,
81+
value: timeTag.value
82+
};
6583
filter.tag = `**${filter.title}** is **${dateRange.label}**`;
6684
filter = filter;
85+
parsedTags.update((tags) => {
86+
tags.push(newTag);
87+
return tags;
88+
});
6789
}
6890
} else {
6991
filter.tag = null;
7092
}
7193
}
7294

73-
export function setSizeFilter(localTags: TagValue[], filter: FilterData, columns: Column[]) {
74-
const sizeTag = localTags.find((tag) => tag.tag.includes(`**${filter.title}**`));
95+
export function setSizeFilter(filter: FilterData, columns: Column[]) {
96+
const sizeTag = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
7597
const col = columns.find((c) => c.id === filter.id);
7698
if (sizeTag) {
7799
const size = sizeTag.value as string;
@@ -92,8 +114,8 @@ export function setSizeFilter(localTags: TagValue[], filter: FilterData, columns
92114
}
93115
}
94116

95-
export function setStatusCodeFilter(localTags: TagValue[], filter: FilterData, columns: Column[]) {
96-
const statusCodeTag = localTags.find((tag) => tag.tag.includes(`**${filter.title}**`));
117+
export function setStatusCodeFilter(filter: FilterData, columns: Column[]) {
118+
const statusCodeTag = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
97119
const col = columns.find((c) => c.id === filter.id);
98120

99121
if (statusCodeTag) {
@@ -109,13 +131,14 @@ export function setStatusCodeFilter(localTags: TagValue[], filter: FilterData, c
109131
}
110132
}
111133

112-
export function setDateFilter(localTags: TagValue[], filter: FilterData, columns: Column[]) {
113-
const dateTeag = localTags.find((tag) => tag.tag.includes(`**${filter.title}**`));
134+
export function setDateFilter(filter: FilterData, columns: Column[]) {
135+
const dateTag = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
114136
const col = columns.find((c) => c.id === filter.id);
115-
if (dateTeag) {
137+
if (dateTag) {
138+
cleanOldTags(filter.title);
116139
const now = new Date();
117140

118-
const diff = now.getTime() - new Date(dateTeag.value as string).getTime();
141+
const diff = now.getTime() - new Date(dateTag.value as string).getTime();
119142
const ranges = col.elements as { value: string; label: string }[];
120143
const dateRange = ranges.reduce((prev, curr) => {
121144
if (parseInt(curr.value) < diff && curr.value > prev.value) {
@@ -124,10 +147,23 @@ export function setDateFilter(localTags: TagValue[], filter: FilterData, columns
124147
return prev;
125148
});
126149
if (dateRange) {
127-
filter.tag = `**${filter.title}** is **${dateRange.label}**`;
128-
filter = filter;
150+
const newTag = {
151+
tag: `**${filter.title}** is **${dateRange.label}**`,
152+
value: dateTag.value
153+
};
154+
parsedTags.update((tags) => {
155+
tags.push(newTag);
156+
return tags;
157+
});
129158
}
130159
} else {
131160
filter.tag = null;
132161
}
133162
}
163+
164+
function cleanOldTags(title: string) {
165+
parsedTags.update((tags) => {
166+
tags = tags.filter((tag) => !tag.tag.includes(`**${title}**`));
167+
return tags;
168+
});
169+
}

‎src/lib/components/filters/subMenu.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@
8787
});
8888
}}>
8989
<Layout.Stack direction="row" gap="s">
90-
<Selector.Checkbox bind:checked={option.checked} />
90+
<Selector.Checkbox bind:checked={option.checked} size="s" />
9191
{capitalize(option.label)}
9292
</Layout.Stack>
9393
</ActionMenu.Item.Button>

‎src/routes/(console)/project-[project]/functions/function-[function]/+page.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,10 @@ export const load: PageLoad = async ({ params, depends, url, route, parent }) =>
1919
offset,
2020
limit,
2121
query,
22-
activeDeployment: data.function.deployment
22+
activeDeployment: data.function.deploymentId
2323
? await sdk.forProject.functions.getDeployment(
2424
params.function,
25-
data.function.deployment
25+
data.function.deploymentId
2626
)
2727
: null,
2828
deploymentList: await sdk.forProject.functions.listDeployments(params.function, [

‎src/routes/(console)/project-[project]/functions/function-[function]/executions/execute-function/+page.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@ export const load: PageLoad = async ({ params, depends, parent }) => {
99

1010
return {
1111
func: data.function,
12-
activeDeployment: data.function.deployment
12+
activeDeployment: data.function.deploymentId
1313
? await sdk.forProject.functions.getDeployment(
1414
params.function,
15-
data.function.deployment
15+
data.function.deploymentId
1616
)
1717
: null,
1818
proxyRuleList: data.proxyRuleList

‎src/routes/(console)/project-[project]/sites/(components)/connectRepoModal.svelte‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,9 @@
2121
export let show = false;
2222
export let site: Models.Site;
2323
export let callbackState: Record<string, string> = null;
24+
export let onlyExisting = false;
2425
25-
let repositoryBehaviour: 'new' | 'existing' | undefined = undefined;
26+
let repositoryBehaviour: 'new' | 'existing' | undefined = onlyExisting ? 'existing' : undefined;
2627
let repositoryName = '';
2728
let repositoryPrivate = true;
2829
let selectedInstallationId = '';
@@ -75,7 +76,6 @@
7576
undefined,
7677
undefined
7778
);
78-
console.log('test');
7979
invalidate(Dependencies.SITE);
8080
show = false;
8181
dispatch('connect', s);
@@ -100,7 +100,9 @@
100100
</span>
101101
{#if hasInstallations}
102102
<Layout.Stack gap="xl">
103-
<RepositoryBehaviour bind:repositoryBehaviour />
103+
{#if !onlyExisting}
104+
<RepositoryBehaviour bind:repositoryBehaviour />
105+
{/if}
104106
{#if repositoryBehaviour === 'new'}
105107
<NewRepository
106108
bind:repositoryName
@@ -111,6 +113,7 @@
111113
<Repositories
112114
bind:hasInstallations
113115
bind:selectedRepository
116+
product="sites"
114117
action="button"
115118
{callbackState}
116119
on:connect={(e) => {

‎src/routes/(console)/project-[project]/sites/site-[site]/domains/add-domain/+page.svelte‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -188,19 +188,27 @@
188188
{#if behaviour === 'CREATE'}
189189
<Fieldset legend="Configuration">
190190
<Layout.Stack gap="xl">
191-
{#if data.branches?.total}
191+
{#if data.site?.providerRepositoryId}
192192
{@const sortedBranches = sortBranches(data.branches.branches)}
193193
{@const options = sortedBranches.map((branch) => ({
194194
label: branch.name,
195195
value: branch.name
196196
}))}
197-
<InputSelect
198-
{options}
199-
label="Production branch"
200-
id="branch"
201-
required
202-
bind:value={branch}
203-
placeholder="Select branch" />
197+
<Layout.Stack gap="s">
198+
<InputSelect
199+
{options}
200+
label="Production branch"
201+
id="branch"
202+
required
203+
bind:value={branch}
204+
placeholder="Select branch" />
205+
{#if !data.branches?.total}
206+
<Input.Helper state="default">
207+
No branches found in the selected repository. Create a
208+
branch to see it here.
209+
</Input.Helper>
210+
{/if}
211+
</Layout.Stack>
204212
{:else}
205213
<InputSelect
206214
disabled
@@ -210,7 +218,6 @@
210218
required
211219
value="main"
212220
placeholder="Select branch" />
213-
214221
<Alert.Inline title=" There is no repository connected to your site">
215222
<Layout.Stack>
216223
<p>
@@ -287,5 +294,6 @@
287294
<ConnectRepoModal
288295
bind:show={showConnectRepo}
289296
site={data.site}
297+
onlyExisting
290298
callbackState={{ connectRepo: 'true' }} />
291299
{/if}

0 commit comments

Comments
 (0)