Appwrite/console
1
0
Fork 0
mirror of https://github.com/appwrite/console.git synced 2026-06-06 19:27:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: tags

Browse Source
This commit is contained in:
Arman
2025-03-12 15:58:43 +01:00
parent 6595da30df
commit 086bf23bfb
8 changed files with 54 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/filters/appliedFilter.svelte → src/lib/components/filters/pasedTagList.svelte
+6 -5
View File
@@ -1,22 +1,23 @@
<script lang="ts">
import { Icon, Layout, Tag, Tooltip } from '@appwrite.io/pink-svelte';
import { queries, tagFormat } from './store';
import { queries, tagFormat, tags } from './store';
import { IconX } from '@appwrite.io/pink-icons-svelte';
import { parsedTags } from './setFilters';
import { Button } from '$lib/elements/forms';
$: console.log($parsedTags);
</script>
{#if $parsedTags?.length}
<Layout.Stack direction="row" gap="s" wrap="wrap" alignItems="center" inline>
{#each $parsedTags as tag}
<span>
<Tooltip disabled={Array.isArray(tag.value) ? tag.value?.length < 3 : true}>
<Tooltip
disabled={Array.isArray(tag.value) ? tag.value?.length < 3 : true}
maxWidth="600px">
<Tag
size="s"
on:click={() => {
queries.removeFilter(tag);
const t = $tags.filter((t) => t.tag.includes(tag.tag.split(' ')[0]));
t.forEach((t) => (t ? queries.removeFilter(t) : null));
queries.apply();
parsedTags.update((tags) => tags.filter((t) => t.tag !== tag.tag));
}}>
src/lib/components/filters/quickFilters.svelte
+3 -3
View File
@@ -6,8 +6,8 @@
import { type Writable } from 'svelte/store';
import Menu from '$lib/components/filters/menu.svelte';
import { CustomFilters } from '$lib/components/filters';
import { setFiltersOnNavigate } from '$lib/components/filters/setFilters';
import { addFilterAndApply, buildFilterCol } from '$lib/components/filters/quickFilters';
import { addFilterAndApply, buildFilterCol } from './quickFilters';
import { setFiltersOnNavigate } from './setFilters';
export let columns: Writable<Column[]>;
export let analyticsSource: string;
@@ -22,6 +22,7 @@
const localTags = Array.from(localQueries.keys());
setFiltersOnNavigate(localTags, filterCols, $columns);
filterCols = filterCols;
});
</script>
@@ -47,7 +48,6 @@
);
}}
on:clear={() => {
filter.tag = null;
addFilterAndApply(
filter.id,
filter.title,
src/lib/components/filters/quickFilters.ts
-6
View File
@@ -61,12 +61,6 @@ export function addFilterAndApply(
});
}
export function resetOptions(filter: FilterData) {
filter.options.forEach((option) => {
option.checked = false;
});
}
export function addStatusCodeFilter(value: string, colId: string, columns: Column[]) {
addFilter(columns, colId, ValidOperators.LessThanOrEqual, parseInt(value));
addFilter(columns, colId, ValidOperators.GreaterThanOrEqual, parseInt(value) - 99);
src/lib/components/filters/setFilters.ts
+40 -19
View File
@@ -1,18 +1,19 @@
import type { Column } from '$lib/helpers/types';
import { get, writable } from 'svelte/store';
import { resetOptions, type FilterData } from './quickFilters';
import { type FilterData } from './quickFilters';
import { tags, type TagValue } from './store';
export const parsedTags = writable<TagValue[]>([]);
export function setFiltersOnNavigate(
tags: TagValue[],
localTags: TagValue[],
filterCols: FilterData[],
$columns: Column[]
) {
if (!tags?.length) {
if (!localTags?.length) {
filterCols.forEach((filter) => {
resetOptions(filter);
cleanOldTags(filter.title);
});
} else {
filterCols.forEach((filter) => {
@@ -37,26 +38,25 @@ export function setFiltersOnNavigate(
export function setFilterData(filter: FilterData) {
const tagData = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
if (tagData) {
cleanOldTags(filter.title);
filter.tag = tagData.tag;
if (Array.isArray(tagData.value) && tagData.value?.length) {
const values = tagData.value as string[];
filter.options.forEach((option) => {
option.checked = values.includes(option.value);
});
}
cleanOldTags(filter.title);
const newTag = {
tag: tagData.tag.replace(',', ' or '),
value: tagData.value
};
parsedTags.update((tags) => {
tags.push(newTag);
return tags;
});
} else {
filter.tag = null;
resetOptions(filter);
cleanOldTags(filter.title);
}
}
@@ -64,7 +64,6 @@ export function setTimeFilter(filter: FilterData, columns: Column[]) {
const col = columns.find((c) => c.id === filter.id);
const timeTag = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
if (timeTag) {
cleanOldTags(filter.title);
const now = new Date();
const diff = now.getTime() - new Date(timeTag.value as string).getTime();
@@ -80,15 +79,16 @@ export function setTimeFilter(filter: FilterData, columns: Column[]) {
tag: `**${filter.title}** is **${dateRange.label}**`,
value: timeTag.value
};
filter.tag = `**${filter.title}** is **${dateRange.label}**`;
filter = filter;
cleanOldTags(filter.title);
parsedTags.update((tags) => {
tags.push(newTag);
return tags;
});
}
} else {
filter.tag = null;
cleanOldTags(filter.title);
}
}
@@ -106,11 +106,19 @@ export function setSizeFilter(filter: FilterData, columns: Column[]) {
return prev;
});
if (sizeRange) {
filter.tag = `**${filter.title}** is **${sizeRange.label}**`;
filter = filter;
cleanOldTags(filter.title);
const newTag = {
tag: `**${filter.title}** is **${sizeRange.label}**`,
value: sizeTag.value
};
parsedTags.update((tags) => {
tags.push(newTag);
return tags;
});
}
} else {
filter.tag = null;
cleanOldTags(filter.title);
}
}
@@ -123,11 +131,18 @@ export function setStatusCodeFilter(filter: FilterData, columns: Column[]) {
const codeRange = ranges.find((c) => c?.value && c.value === statusCodeTag.value);
if (codeRange) {
filter.tag = `**${filter.title}** is **${codeRange.label}**`;
filter = filter;
cleanOldTags(filter.title);
const newTag = {
tag: `**${filter.title}** is **${codeRange.label}**`,
value: statusCodeTag.value
};
parsedTags.update((tags) => {
tags.push(newTag);
return tags;
});
}
} else {
filter.tag = null;
cleanOldTags(filter.title);
}
}
@@ -135,7 +150,6 @@ export function setDateFilter(filter: FilterData, columns: Column[]) {
const dateTag = get(tags).find((tag) => tag.tag.includes(`**${filter.title}**`));
const col = columns.find((c) => c.id === filter.id);
if (dateTag) {
cleanOldTags(filter.title);
const now = new Date();
const diff = now.getTime() - new Date(dateTag.value as string).getTime();
@@ -147,6 +161,7 @@ export function setDateFilter(filter: FilterData, columns: Column[]) {
return prev;
});
if (dateRange) {
cleanOldTags(filter.title);
const newTag = {
tag: `**${filter.title}** is **${dateRange.label}**`,
value: dateTag.value
@@ -157,7 +172,7 @@ export function setDateFilter(filter: FilterData, columns: Column[]) {
});
}
} else {
filter.tag = null;
cleanOldTags(filter.title);
}
}
@@ -167,3 +182,9 @@ function cleanOldTags(title: string) {
return tags;
});
}
export function resetOptions(filter: FilterData) {
filter.options.forEach((option) => {
option.checked = false;
});
}
src/lib/components/filters/subMenu.svelte
+4 -22
View File
@@ -4,17 +4,7 @@
import { ActionMenu, Card, Layout, Selector } from '@appwrite.io/pink-svelte';
import { createMenubar, melt } from '@melt-ui/svelte';
import { createEventDispatcher } from 'svelte';
import type { ValidOperators } from './store';
type FilterData = {
title: string;
id: string;
array: boolean;
show: boolean;
tag: string;
operator: ValidOperators;
options: { value: string; label: string; checked: boolean }[];
};
import type { FilterData } from './quickFilters';
export let filter: FilterData;
export let variant: 'checkbox' | 'radio' = 'checkbox';
@@ -61,11 +51,7 @@
on:click={() => {
option.checked = !option.checked;
dispatch('add', {
value: filter?.array
? null
: option.checked
? option.value
: null
value: option.value
});
}}>
{capitalize(option.label)}
@@ -79,15 +65,11 @@
on:click={() => {
option.checked = !option.checked;
dispatch('add', {
value: filter?.array
? null
: option.checked
? option.value
: null
value: option.checked
});
}}>
<Layout.Stack direction="row" gap="s">
<Selector.Checkbox bind:checked={option.checked} size="s" />
<Selector.Checkbox checked={option.checked} size="s" />
{capitalize(option.label)}
</Layout.Stack>
</ActionMenu.Item.Button>
src/routes/(console)/project-[project]/functions/function-[function]/executions/execute-function/+page.ts
-1
View File
@@ -1,7 +1,6 @@
import { sdk } from '$lib/stores/sdk';
import { Dependencies } from '$lib/constants';
import type { PageLoad } from './$types';
import { proxyRuleList } from '../../store';
export const load: PageLoad = async ({ params, depends, parent }) => {
const data = await parent();
src/routes/(console)/project-[project]/sites/(components)/addCollaboratorModal.svelte
-2
View File
@@ -12,7 +12,6 @@
import { Submit, trackEvent, trackError } from '$lib/actions/analytics';
import { roles } from '$lib/stores/billing';
import InputSelect from '$lib/elements/forms/inputSelect.svelte';
import Roles from '$lib/components/roles/roles.svelte';
import { Layout } from '@appwrite.io/pink-svelte';
import { isCloud, isSelfHosted } from '$lib/system';
@@ -76,7 +75,6 @@
bind:value={email} />
{#if isCloud}
<InputSelect
popover={Roles}
id="role"
label="Role"
placeholder="Select role"
src/routes/(console)/project-[project]/sites/site-[site]/logs/+page.svelte
+1 -1
View File
@@ -11,7 +11,7 @@
import { Card, Empty, Layout } from '@appwrite.io/pink-svelte';
import { View } from '$lib/helpers/load';
import { columns } from './store';
import AppliedFilter from '$lib/components/filters/appliedFilter.svelte';
import AppliedFilter from '$lib/components/filters/pasedTagList.svelte';
export let data;