Skip to content

Commit c241c7c

Browse files
niemyjskiniemyjski
committed
next: allow custom styling on filter components
1 parent d41f1f2 commit c241c7c

12 files changed

+35
-24
lines changed

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableBooleanFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { BooleanFilter } from './filters.svelte';
@@ -9,12 +10,12 @@
910
term: string;
1011
value?: boolean;
1112
} & AProps;
12-
let { changed, term, value, ...props }: Props = $props();
13+
let { changed, class: className, term, value, ...props }: Props = $props();
1314
1415
const title = `Search ${term}:${value}`;
1516
</script>
1617

17-
<A class="cursor-pointer" onclick={() => changed(new BooleanFilter(term, value))} {title} {...props}>
18+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new BooleanFilter(term, value))} {title} {...props}>
1819
{#snippet children()}
1920
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
2021
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableDateFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { DateFilter } from './filters.svelte';
@@ -9,12 +10,12 @@
910
term: string;
1011
value?: Date | string;
1112
} & AProps;
12-
let { changed, term, value, ...props }: Props = $props();
13+
let { changed, class: className, term, value, ...props }: Props = $props();
1314
1415
const title = `Search ${term}:${value}`;
1516
</script>
1617

17-
<A class="cursor-pointer" onclick={() => changed(new DateFilter(term, value))} {title} {...props}>
18+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new DateFilter(term, value))} {title} {...props}>
1819
{#snippet children()}
1920
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
2021
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableNumberFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { NumberFilter } from './filters.svelte';
@@ -9,12 +10,12 @@
910
term: string;
1011
value?: number;
1112
} & AProps;
12-
let { changed, term, value, ...props }: Props = $props();
13+
let { changed, class: className, term, value, ...props }: Props = $props();
1314
1415
const title = `Search ${term}:${value}`;
1516
</script>
1617

17-
<A class="cursor-pointer" onclick={() => changed(new NumberFilter(term, value))} {title} {...props}>
18+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new NumberFilter(term, value))} {title} {...props}>
1819
{#snippet children()}
1920
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
2021
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableOrganizationFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { OrganizationFilter } from './filters.svelte';
@@ -8,12 +9,12 @@
89
changed: (filter: OrganizationFilter) => void;
910
value: string;
1011
} & AProps;
11-
let { changed, value, ...props }: Props = $props();
12+
let { changed, class: className, value, ...props }: Props = $props();
1213
1314
const title = `Search organization:${value}`;
1415
</script>
1516

16-
<A class="cursor-pointer" onclick={() => changed(new OrganizationFilter(value))} {title} {...props}>
17+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new OrganizationFilter(value))} {title} {...props}>
1718
{#snippet children()}
1819
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
1920
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableProjectFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { ProjectFilter } from './filters.svelte';
@@ -9,12 +10,12 @@
910
organization: string;
1011
value: string[];
1112
} & AProps;
12-
let { changed, organization, value, ...props }: Props = $props();
13+
let { changed, class: className, organization, value, ...props }: Props = $props();
1314
1415
const title = `Search project:${value}`;
1516
</script>
1617

17-
<A class="cursor-pointer" onclick={() => changed(new ProjectFilter(organization, value))} {title} {...props}>
18+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new ProjectFilter(organization, value))} {title} {...props}>
1819
{#snippet children()}
1920
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
2021
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableReferenceFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { ReferenceFilter } from './filters.svelte';
@@ -8,12 +9,12 @@
89
changed: (filter: ReferenceFilter) => void;
910
value: string;
1011
} & AProps;
11-
let { changed, value, ...props }: Props = $props();
12+
let { changed, class: className, value, ...props }: Props = $props();
1213
1314
const title = `Search reference:${value}`;
1415
</script>
1516

16-
<A class="cursor-pointer" onclick={() => changed(new ReferenceFilter(value))} {title} {...props}>
17+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new ReferenceFilter(value))} {title} {...props}>
1718
{#snippet children()}
1819
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
1920
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableSessionFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { SessionFilter } from './filters.svelte';
@@ -8,12 +9,12 @@
89
changed: (filter: SessionFilter) => void;
910
value: string;
1011
} & AProps;
11-
let { changed, value, ...props }: Props = $props();
12+
let { changed, class: className, value, ...props }: Props = $props();
1213
1314
const title = `Search ref.session:${value}`;
1415
</script>
1516

16-
<A class="cursor-pointer" onclick={() => changed(new SessionFilter(value))} {title} {...props}>
17+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new SessionFilter(value))} {title} {...props}>
1718
{#snippet children()}
1819
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
1920
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableStatusFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import type { StackStatus } from '$features/stacks/models';
33
44
import { A, type AProps } from '$comp/typography';
5+
import { cn } from '$lib/utils';
56
import IconFilter from '~icons/mdi/filter';
67
78
import { StatusFilter } from './filters.svelte';
@@ -10,12 +11,12 @@
1011
changed: (filter: StatusFilter) => void;
1112
value: StackStatus[];
1213
} & AProps;
13-
let { changed, value, ...props }: Props = $props();
14+
let { changed, class: className, value, ...props }: Props = $props();
1415
1516
const title = `Search status:${value}`;
1617
</script>
1718

18-
<A class="cursor-pointer" onclick={() => changed(new StatusFilter(value))} {title} {...props}>
19+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new StatusFilter(value))} {title} {...props}>
1920
{#snippet children()}
2021
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
2122
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableStringFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { StringFilter } from './filters.svelte';
@@ -9,12 +10,12 @@
910
term: string;
1011
value?: null | string;
1112
} & AProps;
12-
let { changed, children, term, value, ...props }: Props = $props();
13+
let { changed, children, class: className, term, value, ...props }: Props = $props();
1314
1415
const title = `Search ${term}:${value}`;
1516
</script>
1617

17-
<A class="cursor-pointer" onclick={() => changed(new StringFilter(term, value ?? undefined))} {title} {...props}>
18+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new StringFilter(term, value ?? undefined))} {title} {...props}>
1819
{#if children}
1920
{@render children()}
2021
{:else}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableTypeFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { TypeFilter } from './filters.svelte';
@@ -8,12 +9,12 @@
89
changed: (filter: TypeFilter) => void;
910
value: string[];
1011
} & AProps;
11-
let { changed, value, ...props }: Props = $props();
12+
let { changed, class: className, value, ...props }: Props = $props();
1213
1314
const title = `Search type:${value}`;
1415
</script>
1516

16-
<A class="cursor-pointer" onclick={() => changed(new TypeFilter(value))} {title} {...props}>
17+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new TypeFilter(value))} {title} {...props}>
1718
{#snippet children()}
1819
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
1920
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/ClickableVersionFilter.svelte

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { A, type AProps } from '$comp/typography';
3+
import { cn } from '$lib/utils';
34
import IconFilter from '~icons/mdi/filter';
45
56
import { VersionFilter } from './filters.svelte';
@@ -9,12 +10,12 @@
910
term: string;
1011
value?: string;
1112
} & AProps;
12-
let { changed, term, value, ...props }: Props = $props();
13+
let { changed, class: className, term, value, ...props }: Props = $props();
1314
1415
const title = `Search ${term}:${value}`;
1516
</script>
1617

17-
<A class="cursor-pointer" onclick={() => changed(new VersionFilter(term, value))} {title} {...props}>
18+
<A class={cn('cursor-pointer', className)} onclick={() => changed(new VersionFilter(term, value))} {title} {...props}>
1819
{#snippet children()}
1920
<IconFilter class="text-muted-foreground text-opacity-50 hover:text-primary" />
2021
{/snippet}

‎src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/Navbar.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -87,10 +87,10 @@
8787
><A variant="ghost" href="/next/account/manage" class="w-full">Account</A>
8888
<DropdownMenu.Shortcut>⇧⌘P</DropdownMenu.Shortcut>
8989
</DropdownMenu.Item>
90-
<DropdownMenu.Item
90+
<!-- <DropdownMenu.Item
9191
><A variant="ghost" href="/next/account/notifications" class="w-full">Notifications</A>
9292
<DropdownMenu.Shortcut>⇧⌘N</DropdownMenu.Shortcut>
93-
</DropdownMenu.Item>
93+
</DropdownMenu.Item> -->
9494
</DropdownMenu.Group>
9595
<!-- <DropdownMenu.Label>My Organization</DropdownMenu.Label>
9696
<DropdownMenu.Separator />

0 commit comments

Comments
 (0)