Skip to content

Commit

Permalink
Next: Added New Organization Sidebar and filter selector (#1812)
Browse files Browse the repository at this point in the history
* Added breadcrumb

* Added user and org sidebar

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

* Delete src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/Footer.svelte

* Delete src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/Sidebar.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/summary/Summary.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Environment.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Error.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Overview.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Request.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Bytes.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Duration.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Number.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Percentage.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/primitives/Checkbox.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/primitives/Switch.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/A.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/A.ts

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Blockquote.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Code.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H1.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H2.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H3.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H4.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Large.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Lead.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/List.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Muted.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/P.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Small.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/Live.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/Loading.svelte

* Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/Logo.svelte

* Fixed sidebar

* Updated deps

* Fixed email address form.

* Updated deps

* Added documentation

* Updated deps

* Fixed [svelte] transition_slide_display The `slide` transition does not work correctly for elements with `display: table-row` https://svelte.dev/e/transition_slide_display

* next: show org switcher only if more than one org, moved current org into  org feature context

* migrated to $app/state

* WIP: Removed organization filters as it's inferred from current selected organization.

* next: fixed linting

* upgrade deps

* add sveltekit-search-params

* updated deps

* Updated Deps

* WIP - Reworking filters

* Updated packages

* More cleanup to filters
  • Loading branch information
niemyjski authored Jan 31, 2025
1 parent a6a5906 commit 4ed01d6
Show file tree
Hide file tree
Showing 134 changed files with 1,956 additions and 2,547 deletions.
2 changes: 1 addition & 1 deletion src/Exceptionless.Web/ClientApp/components.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
"aliases": {
"components": "$comp",
"utils": "$lib/utils",
"ui": "$lib/features/shared/components/ui",
"ui": "$comp/ui",
"hooks": "$lib/hooks"
},
"typescript": true,
Expand Down
689 changes: 348 additions & 341 deletions src/Exceptionless.Web/ClientApp/package-lock.json

Large diffs are not rendered by default.

49 changes: 25 additions & 24 deletions src/Exceptionless.Web/ClientApp/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,56 +23,57 @@
"upgrade": "ncu -i"
},
"devDependencies": {
"@iconify-json/lucide": "^1.2.22",
"@playwright/test": "^1.49.1",
"@iconify-json/lucide": "^1.2.25",
"@playwright/test": "^1.50.0",
"@sveltejs/adapter-static": "^3.0.8",
"@sveltejs/kit": "^2.15.2",
"@sveltejs/kit": "^2.16.1",
"@sveltejs/vite-plugin-svelte": "^5.0.3",
"@types/eslint": "^9.6.1",
"@types/node": "^22.10.5",
"@types/node": "^22.12.0",
"@types/throttle-debounce": "^5.0.2",
"autoprefixer": "^10.4.20",
"cross-env": "^7.0.3",
"eslint": "^9.17.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-perfectionist": "^4.6.0",
"eslint": "^9.19.0",
"eslint-config-prettier": "^10.0.1",
"eslint-plugin-perfectionist": "^4.7.0",
"eslint-plugin-svelte": "^2.46.1",
"npm-run-all": "^4.1.5",
"postcss": "^8.4.49",
"postcss": "^8.5.1",
"prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.2",
"prettier-plugin-tailwindcss": "^0.6.9",
"svelte": "^5.17.1",
"svelte-check": "^4.1.3",
"prettier-plugin-svelte": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.6.11",
"svelte": "^5.19.6",
"svelte-check": "^4.1.4",
"swagger-typescript-api": "^13.0.23",
"tslib": "^2.8.1",
"typescript": "^5.7.3",
"typescript-eslint": "^8.19.1",
"vite": "^6.0.7",
"vitest": "2.1.6"
"typescript-eslint": "^8.22.0",
"vite": "^6.0.11",
"vitest": "3.0.4"
},
"dependencies": {
"@exceptionless/browser": "^3.1.0",
"@exceptionless/fetchclient": "^0.36.0",
"@iconify-json/mdi": "^1.2.2",
"@exceptionless/fetchclient": "^0.40.0",
"@iconify-json/mdi": "^1.2.3",
"@tanstack/svelte-query": "https://pkg.pr.new/@tanstack/svelte-query@28f98f9",
"@tanstack/svelte-query-devtools": "https://pkg.pr.new/@tanstack/svelte-query-devtools@28f98f9",
"@tanstack/svelte-table": "^9.0.0-alpha.10",
"@typeschema/class-validator": "^0.3.0",
"bits-ui": "^1.0.0-next.77",
"bits-ui": "^1.0.0-next.78",
"class-validator": "^0.14.1",
"clsx": "^2.1.1",
"formsnap": "^2.0.0",
"lucide-svelte": "^0.471.0",
"mode-watcher": "^0.5.0",
"lucide-svelte": "^0.474.0",
"mode-watcher": "^0.5.1",
"oidc-client-ts": "^3.1.0",
"pretty-ms": "^9.2.0",
"runed": "^0.23.0",
"runed": "^0.23.2",
"svelte-sonner": "^0.3.28",
"svelte-time": "^0.9.0",
"sveltekit-superforms": "^2.22.1",
"svelte-time": "^2.0.0",
"sveltekit-search-params": "^4.0.0-next.0",
"sveltekit-superforms": "^2.23.1",
"tailwind-merge": "^2.6.0",
"tailwind-variants": "^0.3.0",
"tailwind-variants": "^0.3.1",
"tailwindcss": "^3.4.17",
"tailwindcss-animate": "^1.0.7",
"throttle-debounce": "^5.0.2",
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@
import { goto } from '$app/navigation';
import { page } from '$app/stores';
import { page } from '$app/state';
import { env } from '$env/dynamic/public';
import { useFetchClient } from '@exceptionless/fetchclient';
import { PersistedState } from 'runed';
import { get } from 'svelte/store';

import type { Login, TokenResult } from './models';

Expand Down Expand Up @@ -84,7 +83,7 @@ export async function googleLogin(redirectUrl?: string) {
}

export async function gotoLogin() {
const { url } = get(page);
const url = page.url;
const isAuthPath = url.pathname.startsWith('/next/login') || url.pathname.startsWith('/next/logout');
const redirect = url.pathname === '/next/' || isAuthPath ? '/next/login' : `/next/login?redirect=${url.pathname}`;
await goto(redirect, { replaceState: true });
Expand Down
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
<script lang="ts">
import type { IFilter } from '$comp/filters/filters.svelte';
import type { IFilter } from '$comp/faceted-filter';
import type { ViewProject } from '$features/projects/models';
import ClickableProjectFilter from '$comp/filters/clickable-project-filter.svelte';
import DateTime from '$comp/formatters/date-time.svelte';
import TimeAgo from '$comp/formatters/time-ago.svelte';
import { Skeleton } from '$comp/ui/skeleton';
import * as Table from '$comp/ui/table';
import * as Tabs from '$comp/ui/tabs';
import { getEventQuery } from '$features/events/api.svelte';
import * as EventsFacetedFilter from '$features/events/components/filters';
import { getExtendedDataItems, hasErrorOrSimpleError } from '$features/events/persistent-event';
import { getProjectQuery } from '$features/projects/api.svelte';
import StackCard from '$features/stacks/components/stack-card.svelte';
Expand Down Expand Up @@ -131,12 +131,7 @@
{#if projectResponse.isSuccess}
<Table.Head class="w-40 whitespace-nowrap">Project</Table.Head>
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
><ClickableProjectFilter
{changed}
class="mr-0"
organization={projectResponse.data.organization_id!}
value={[projectResponse.data.id!]}
/></Table.Cell
><EventsFacetedFilter.ProjectTrigger {changed} class="mr-0" value={[projectResponse.data.id!]} /></Table.Cell
>
<Table.Cell>{projectResponse.data.name}</Table.Cell>
{:else}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<script lang="ts">
import { builderContext, type FacetFilterBuilder, type IFilter } from '$comp/faceted-filter';
import { onMount } from 'svelte';
import BooleanFacetedFilter from './boolean-faceted-filter.svelte';
import { BooleanFilter } from './models.svelte';
interface Props {
priority?: number;
term: string;
title?: string;
}
const { priority = 0, term, title = 'Boolean' }: Props = $props();
onMount(() => {
const builder: FacetFilterBuilder<BooleanFilter> = {
component: BooleanFacetedFilter,
create: (filter?: BooleanFilter) => filter ?? new BooleanFilter(term),
priority,
title
};
builderContext.set(`boolean-${term}`, builder as unknown as FacetFilterBuilder<IFilter>);
return () => builderContext.delete('boolean');
});
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import { cn } from '$lib/utils';
import Filter from 'lucide-svelte/icons/filter';
import { BooleanFilter } from './filters.svelte';
import { BooleanFilter } from './models.svelte';
type Props = AProps & {
changed: (filter: BooleanFilter) => void;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
<script lang="ts">
import { BooleanFilter } from '$comp/filters/filters.svelte';
import type { FacetedFilterProps } from '$comp/faceted-filter';
import type { FacetedFilterProps } from '.';
import * as FacetedFilter from '$comp/faceted-filter';
import BooleanFacetedFilter from './base/boolean-faceted-filter.svelte';
import type { BooleanFilter } from './models.svelte';
let { filter, filterChanged, filterRemoved, ...props }: FacetedFilterProps<BooleanFilter> = $props();
</script>

<BooleanFacetedFilter
<FacetedFilter.Boolean
changed={(value) => {
filter.value = value;
filterChanged(filter);
Expand All @@ -19,4 +19,4 @@
}}
value={filter.value}
{...props}
></BooleanFacetedFilter>
></FacetedFilter.Boolean>
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<script lang="ts">
import { builderContext, type FacetFilterBuilder, type IFilter } from '$comp/faceted-filter';
import { onMount } from 'svelte';
import DateFacetedFilter from './date-faceted-filter.svelte';
import { DateFilter } from './models.svelte';
interface Props {
priority?: number;
term: string;
title?: string;
}
const { priority = 0, term, title = 'Date Range' }: Props = $props();
onMount(() => {
const builder: FacetFilterBuilder<DateFilter> = {
component: DateFacetedFilter,
create: (filter?: DateFilter) => filter ?? new DateFilter(term),
priority,
title
};
builderContext.set(`date-${term}`, builder as unknown as FacetFilterBuilder<IFilter>);
return () => builderContext.delete('date');
});
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import { cn } from '$lib/utils';
import Filter from 'lucide-svelte/icons/filter';
import { DateFilter } from './filters.svelte';
import { DateFilter } from './models.svelte';
type Props = AProps & {
changed: (filter: DateFilter) => void;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
<script lang="ts">
import { DateFilter } from '$comp/filters/filters.svelte';
import type { FacetedFilterProps } from '$comp/faceted-filter';
import type { FacetedFilterProps } from '.';
import * as FacetedFilter from '$comp/faceted-filter';
import DropDownFacetedFilter from './base/drop-down-faceted-filter.svelte';
import { DateFilter } from './models.svelte';
let { filter, filterChanged, filterRemoved, title = 'Date Range', ...props }: FacetedFilterProps<DateFilter> = $props();
Expand Down Expand Up @@ -32,7 +32,7 @@
}
</script>

<DropDownFacetedFilter
<FacetedFilter.DropDown
changed={(value) => {
filter.value = value;
filterChanged(filter);
Expand All @@ -45,4 +45,4 @@
{title}
value={filter.value as string}
{...props}
></DropDownFacetedFilter>
></FacetedFilter.DropDown>
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
import { getKeywordFilter, getOrganizationFilter, getProjectFilter, getStackFilter, type IFilter } from '$comp/filters/filters.svelte';
import type { IFilter } from '$comp/faceted-filter';

import { organization } from '$features/organizations/context.svelte';

import { getKeywordFilter, getProjectFilter, getStackFilter } from './models.svelte';

export function shouldRefreshPersistentEventChanged(
filters: IFilter[],
Expand Down Expand Up @@ -37,10 +41,7 @@ export function shouldRefreshPersistentEventChanged(
}

if (organization_id) {
const organizationFilter = getOrganizationFilter(filters);
if (organizationFilter && !organizationFilter.isEmpty()) {
return organizationFilter.value === organization_id;
}
return organization.current === organization_id;
}

return true;
Expand Down
Loading

0 comments on commit 4ed01d6

Please sign in to comment.