diff --git a/src/lib/components/imagePreview.svelte b/src/lib/components/imagePreview.svelte index 1c5f3cfdf..e377b0739 100644 --- a/src/lib/components/imagePreview.svelte +++ b/src/lib/components/imagePreview.svelte @@ -12,6 +12,8 @@ style="inline-size: 100%; block-size: 100%;" target="_blank" rel="noopener noreferrer" + on:click|stopPropagation + on:mousedown|stopPropagation aria-label="open file in new window">
diff --git a/src/lib/elements/forms/helper.svelte b/src/lib/elements/forms/helper.svelte index 99e580c8d..76ac8cab5 100644 --- a/src/lib/elements/forms/helper.svelte +++ b/src/lib/elements/forms/helper.svelte @@ -5,7 +5,7 @@

import { SearchQuery, ViewSelector } from '$lib/components'; - import { FiltersBottomSheet, ParsedTagList, queryParamToMap } from '$lib/components/filters'; + import { + FiltersBottomSheet, + ParsedTagList, + queryParamToMap, + Filters + } from '$lib/components/filters'; import QuickFilters from '$lib/components/filters/quickFilters.svelte'; import Button from '$lib/elements/forms/button.svelte'; import { View } from '$lib/helpers/load'; @@ -23,6 +28,7 @@ hasSearch = false, searchPlaceholder = 'Search by ID', hasFilters = false, + hasCustomFiltersOnly = false, analyticsSource = '', children }: { @@ -33,6 +39,7 @@ hasSearch?: boolean; searchPlaceholder?: string; hasFilters?: boolean; + hasCustomFiltersOnly?: boolean; analyticsSource?: string; children?: Snippet; } = $props(); @@ -109,7 +116,11 @@ {#if hasFilters && $columns?.length} - + {#if hasCustomFiltersOnly} + + {:else} + + {/if} {/if} {#if hasDisplaySettings} diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/columns/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/columns/+page.svelte index 9def212f9..0f8376a16 100644 --- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/columns/+page.svelte +++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/columns/+page.svelte @@ -216,7 +216,7 @@ ? (max < 0n ? -max : max) >= LARGE_NUMBER_THRESHOLD : Math.abs(max) >= LARGE_NUMBER_THRESHOLD_NUM); if (shouldShowTooltip) { - tooltip = `Min: ${min.toLocaleString()}, Max: ${max.toLocaleString()}`; + tooltip = `Min: ${min.toLocaleString()}\nMax: ${max.toLocaleString()}`; } } else if (hasValidMin) { display = `Min: ${formatLargeNumber(min)}`; @@ -309,8 +309,8 @@ const spreadsheetColumns = $derived([ { id: 'key', - width: getColumnWidth('key', 300), - minimumWidth: 300, + width: getColumnWidth('key', 380), + minimumWidth: 380, resizable: true }, { @@ -467,13 +467,15 @@ {@const relationType = getRelationshipTypeForColumn(column)} {#if minMaxSize} {#if minMaxSize.tooltip} - + {minMaxSize.display} -

{minMaxSize.tooltip}
+
+ {minMaxSize.tooltip} +
{:else} - + @@ -115,14 +115,11 @@ {:else if $hasPageQueries} {:else if data.search} - -
- Sorry, we couldn't find '{data.search}' -

There are no subscribers that match your search.

-
+ {:else} @@ -141,7 +138,7 @@ on:update={addTargets}> - Add subscribers to this topic by selecting the targets for directing messages.{' '} + Create subscribers for this topic by selecting the targets for directing messages.{' '} diff --git a/src/routes/(console)/project-[region]-[project]/messaging/topicsModal.svelte b/src/routes/(console)/project-[region]-[project]/messaging/topicsModal.svelte index 38e2d5f28..b0d8f9828 100644 --- a/src/routes/(console)/project-[region]-[project]/messaging/topicsModal.svelte +++ b/src/routes/(console)/project-[region]-[project]/messaging/topicsModal.svelte @@ -21,24 +21,23 @@ show = $bindable(), topicsById = $bindable(), title = 'Select topics' - } = $props<{ + }: { providerType: MessagingProviderType; show: boolean; topicsById: Record; title?: string; - }>(); + } = $props(); const dispatch = createEventDispatcher(); - let search = $state(''); let offset = $state(0); + let search = $state(''); let totalResults = $state(0); - let topicResultsById = $state>({}); - let selected = $state>({}); let emptyTopicsExists = $state(false); - - let previousSearch = $state(''); + let selected = $state>({}); + let topicResultsById = $state>({}); let wasOpen = $state(false); + let previousSearch = $state(''); function getTopicTotal(topic: Models.Topic): number { switch (providerType) { @@ -96,44 +95,52 @@ } function onTopicSelection(event: CustomEvent, topic: Models.Topic) { + const updatedSelected = { ...selected }; + if (event.detail) { - selected = { - ...selected, - [topic.$id]: topic - }; + updatedSelected[topic.$id] = topic; } else { - const { [topic.$id]: _, ...rest } = selected; - selected = rest; + delete updatedSelected[topic.$id]; } + + selected = updatedSelected; } + const selectedSize = $derived(Object.keys(selected).length); + const hasSelection = $derived(selectedSize > 0); + + const topicsWithState = $derived( + Object.entries(topicResultsById).map(([topicId, topic]) => ({ + topicId, + topic, + checked: !!selected[topicId], + disabled: !!topicsById[topicId] + })) + ); + $effect(() => { - if (search !== previousSearch) { + const searchChanged = search !== previousSearch; + if (searchChanged) { previousSearch = search; offset = 0; } }); $effect(() => { - if (!show) return; - offset ?? null; - search ?? null; - request(); + const hasValidData = offset !== null || search !== null; + const shouldFetch = show && hasValidData; + if (shouldFetch) { + request(); + } }); $effect(() => { - if (show && !wasOpen) { + const isOpening = show && !wasOpen; + if (isOpening) { selected = topicsById; } wasOpen = show; }); - - let selectedSize = $derived(Object.keys(selected).length); - let hasSelection = $derived(selectedSize > 0); - - let topicSelectionStates = $derived( - Object.fromEntries(Object.keys(topicResultsById).map((id) => [id, !!selected[id]])) - ); @@ -149,17 +156,17 @@ disabled={totalResults === 0 && !search} placeholder="Search for topics" bind:value={search} /> - {#if Object.keys(topicResultsById).length > 0 && !emptyTopicsExists} + {#if topicsWithState.length > 0 && !emptyTopicsExists} - {#each Object.entries(topicResultsById) as [topicId, topic]} + {#each topicsWithState as { topicId, topic, checked, disabled } (topicId)} onTopicSelection(event, topic)}> @@ -185,7 +192,7 @@