diff --git a/src/lib/components/event/event-summary-row.svelte b/src/lib/components/event/event-summary-row.svelte
index f52e63b4a7..fa94ff1f3a 100644
--- a/src/lib/components/event/event-summary-row.svelte
+++ b/src/lib/components/event/event-summary-row.svelte
@@ -327,20 +327,19 @@
- {#if decodedValue}
-
-
Summary
-
- {decodedValue}
-
-
+
Summary
+
+ {decodedValue}
+
+
diff --git a/src/lib/components/import/event-history-file-import.svelte b/src/lib/components/import/event-history-file-import.svelte
index f2cf708e60..6b7139a4b2 100644
--- a/src/lib/components/import/event-history-file-import.svelte
+++ b/src/lib/components/import/event-history-file-import.svelte
@@ -13,8 +13,9 @@
import { parseWithBigInt } from '$lib/utilities/parse-with-big-int';
import { routeForEventHistoryImport } from '$lib/utilities/route-for';
- let rawEvents: HistoryEvent[] | { events: HistoryEvent[] };
- let fileLoaded = false;
+ let rawEvents: HistoryEvent[] | { events: HistoryEvent[] } | undefined =
+ $state(undefined);
+ let fileLoaded = $state(false);
const onFileSelect = async (e: Event) => {
const target = e.target as HTMLInputElement;
@@ -70,7 +71,7 @@
class="import-input block border border-slate-200 p-2"
type="file"
accept=".json"
- on:change={onFileSelect}
+ onchange={onFileSelect}
/>
- import { page } from '$app/stores';
-
- export let isCloud = false;
-
-
-{#if isCloud || $page.data?.settings?.runtimeEnvironment?.isCloud}
-
-{:else}
-
-{/if}
diff --git a/src/lib/components/is-legacy-cloud-guard.svelte b/src/lib/components/is-legacy-cloud-guard.svelte
deleted file mode 100644
index 6df766fad2..0000000000
--- a/src/lib/components/is-legacy-cloud-guard.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-{#if isCloud && isLegacyCloud}
-
-{:else}
-
-{/if}
diff --git a/src/lib/components/is-oss-guard.svelte b/src/lib/components/is-oss-guard.svelte
index 32545d38ae..ae60dca167 100644
--- a/src/lib/components/is-oss-guard.svelte
+++ b/src/lib/components/is-oss-guard.svelte
@@ -1,11 +1,17 @@
-{#if isCloud || $page.data?.settings?.runtimeEnvironment?.isCloud}
-
+{#if isCloud || page.data?.settings?.runtimeEnvironment?.isCloud}
+ {@render children?.()}
{:else}
-
+ {@render fallback?.()}
{/if}
diff --git a/src/lib/components/is-temporal-server-version-guard.svelte b/src/lib/components/is-temporal-server-version-guard.svelte
index 8a29e9493d..73ed6b7777 100644
--- a/src/lib/components/is-temporal-server-version-guard.svelte
+++ b/src/lib/components/is-temporal-server-version-guard.svelte
@@ -1,13 +1,23 @@
{#if $isCloud || minimumVersionRequired(minimumVersion, $temporalVersion)}
-
+ {@render children?.()}
{:else}
-
+ {@render fallback?.()}
{/if}
diff --git a/src/lib/components/lines-and-dots/constants.ts b/src/lib/components/lines-and-dots/constants.ts
index 231b285054..a0eaba51d6 100644
--- a/src/lib/components/lines-and-dots/constants.ts
+++ b/src/lib/components/lines-and-dots/constants.ts
@@ -14,6 +14,7 @@ import type {
} from '$lib/types/events';
import type { WorkflowStatus } from '$lib/types/workflows';
import {
+ type CombinedAttributes,
formatGroupAttributes,
formatPendingAttributes,
} from '$lib/utilities/format-event-attributes';
@@ -269,11 +270,19 @@ export const getCategoryStrokeColor = (
}
};
-export const mergeEventGroupDetails = (group: EventGroup) => {
+export const mergeEventGroupDetails = (
+ group: EventGroup,
+): CombinedAttributes => {
const attributes = formatGroupAttributes(group);
- return group.pendingActivity
- ? { ...formatPendingAttributes(group.pendingActivity), ...attributes }
- : attributes;
+
+ if (group.pendingActivity) {
+ return {
+ ...formatPendingAttributes(group.pendingActivity),
+ ...attributes,
+ };
+ }
+
+ return attributes;
};
export const staticCodeBlockHeight = 200;
diff --git a/src/lib/components/lines-and-dots/event-classification-filter.svelte b/src/lib/components/lines-and-dots/event-classification-filter.svelte
index 333308bf60..380875ef77 100644
--- a/src/lib/components/lines-and-dots/event-classification-filter.svelte
+++ b/src/lib/components/lines-and-dots/event-classification-filter.svelte
@@ -1,5 +1,5 @@
diff --git a/src/lib/components/lines-and-dots/event-sort-filter.svelte b/src/lib/components/lines-and-dots/event-sort-filter.svelte
index a3c52f3ab8..15ebc9572a 100644
--- a/src/lib/components/lines-and-dots/event-sort-filter.svelte
+++ b/src/lib/components/lines-and-dots/event-sort-filter.svelte
@@ -1,9 +1,9 @@
-
diff --git a/src/lib/components/lines-and-dots/event-type-filter.svelte b/src/lib/components/lines-and-dots/event-type-filter.svelte
index 9de9f2e660..54c570299b 100644
--- a/src/lib/components/lines-and-dots/event-type-filter.svelte
+++ b/src/lib/components/lines-and-dots/event-type-filter.svelte
@@ -2,7 +2,7 @@
import { writable } from 'svelte/store';
import { goto } from '$app/navigation';
- import { page } from '$app/stores';
+ import { page } from '$app/state';
import Checkbox from '$lib/holocene/checkbox.svelte';
import Icon from '$lib/holocene/icon/icon.svelte';
@@ -26,43 +26,46 @@
import { CategoryIcon } from './constants';
- export let compact = false;
+ interface Props {
+ compact?: boolean;
+ }
- let open = writable(false);
+ let { compact = false }: Props = $props();
- $: defaultOptions = compact
- ? compactEventTypeOptions.map((o) => o.value)
- : allEventTypeOptions.map((o) => o.value);
+ const open = writable(false);
- $: options = [
- ...(compact ? compactEventTypeOptions : allEventTypeOptions).map((o) => ({
- ...o,
- label: translate(o.label),
- icon: CategoryIcon[o.value],
- description: translate(o.description),
- })),
- ];
+ const defaultOptions = $derived(
+ compact
+ ? compactEventTypeOptions.map((o) => o.value)
+ : allEventTypeOptions.map((o) => o.value),
+ );
- $: {
+ const options = $derived.by(() => {
+ let list = (compact ? compactEventTypeOptions : allEventTypeOptions).map(
+ (o) => ({
+ ...o,
+ label: translate(o.label),
+ icon: CategoryIcon[o.value],
+ description: o.description ? translate(o.description) : '',
+ }),
+ );
if (isVersionNewer('1.21.0', $temporalVersion)) {
- options = options.filter(({ value }) => value !== 'update');
+ list = list.filter(({ value }) => value !== 'update');
}
- }
-
- $: {
- if (!nexusEnabled($page.data.systemInfo?.capabilities)) {
- options = options.filter(({ value }) => value !== 'nexus');
+ if (!nexusEnabled(page.data.systemInfo?.capabilities)) {
+ list = list.filter(({ value }) => value !== 'nexus');
}
- }
+ return list;
+ });
- const onOptionClick = ({ value }) => {
+ const onOptionClick = ({ value }: (typeof options)[number]) => {
clearActiveGroups();
const newCategories = $eventTypeFilter.some((type) => type === value)
? $eventTypeFilter.filter((type) => type !== value)
: [...$eventTypeFilter, value];
$eventTypeFilter = newCategories;
updateEventFilterParams(
- $page.url,
+ page.url,
{
categories:
newCategories.length === defaultOptions.length ? null : newCategories,
@@ -75,7 +78,7 @@
$eventTypeFilter = defaultOptions;
$eventStatusFilter = false;
updateEventFilterParams(
- $page.url,
+ page.url,
{ categories: null, statusFilter: false },
goto,
);
@@ -85,7 +88,7 @@
$eventTypeFilter = defaultOptions;
$eventStatusFilter = !$eventStatusFilter;
updateEventFilterParams(
- $page.url,
+ page.url,
{ categories: null, statusFilter: !$eventStatusFilter },
goto,
);
@@ -95,13 +98,15 @@
$eventTypeFilter = [];
$eventStatusFilter = false;
updateEventFilterParams(
- $page.url,
+ page.url,
{ categories: [], statusFilter: false },
goto,
);
};
- $: filterActive = $eventTypeFilter.length < defaultOptions.length;
+ const filterActive = $derived(
+ $eventTypeFilter.length < defaultOptions.length,
+ );
@@ -111,7 +116,10 @@
class="flex h-6 w-6 flex-col items-center justify-center rounded-full transition-colors duration-200"
class:bg-interactive={filterActive}
>
-
+
{/snippet}
{translate('common.filter')}
@@ -167,7 +175,7 @@
{translate('common.none')}
- {#each options as option}
+ {#each options as option (option.value)}