diff --git a/packages/presentation/src/components/ObjectPopup.svelte b/packages/presentation/src/components/ObjectPopup.svelte index d3463e25b0..b71aaa4d85 100644 --- a/packages/presentation/src/components/ObjectPopup.svelte +++ b/packages/presentation/src/components/ObjectPopup.svelte @@ -87,11 +87,11 @@ $: showCategories = objects.map((it) => (it as any)[groupBy]).filter((it, index, arr) => arr.indexOf(it) === index).length > 1 - const checkSelected = (person: Doc, objects: Doc[]): void => { - if (selectedElements.has(person._id)) { - selectedElements.delete(person._id) + const checkSelected = (item: Doc): void => { + if (selectedElements.has(item._id)) { + selectedElements.delete(item._id) } else { - selectedElements.add(person._id) + selectedElements.add(item._id) } selectedObjects = Array.from(selectedElements) @@ -105,17 +105,17 @@ let list: ListView async function handleSelection (evt: Event | undefined, objects: Doc[], selection: number): Promise { - const person = objects[selection] + const item = objects[selection] if (!multiSelect) { if (allowDeselect) { - selected = person._id === selected ? undefined : person._id + selected = item._id === selected ? undefined : item._id } else { - selected = person._id + selected = item._id } - dispatch(closeAfterSelect ? 'close' : 'update', selected !== undefined ? person : undefined) + dispatch(closeAfterSelect ? 'close' : 'update', selected !== undefined ? item : undefined) } else { - checkSelected(person, objects) + checkSelected(item) } } @@ -222,7 +222,7 @@ {#if cHeight === 1}
{/if} -
updateLocation(scrollDiv, selectedDiv)} bind:this={scrollDiv}> +
updateLocation(scrollDiv, selectedDiv, objects, selected)} bind:this={scrollDiv}>
diff --git a/packages/ui/src/components/SelectPopup.svelte b/packages/ui/src/components/SelectPopup.svelte index 6ccb797baf..6f7ad8a12e 100644 --- a/packages/ui/src/components/SelectPopup.svelte +++ b/packages/ui/src/components/SelectPopup.svelte @@ -85,6 +85,35 @@ $: filteredObjects = value.filter((el) => (el.label ?? el.text ?? '').toLowerCase().includes(search.toLowerCase())) $: huge = size === 'medium' || size === 'large' + + let selectedDiv: HTMLElement | undefined + let scrollDiv: HTMLElement | undefined + let cHeight = 0 + + const updateLocation = (scrollDiv?: HTMLElement, selectedDiv?: HTMLElement, objects?: ValueType[]) => { + const objIt = objects?.find((it) => it.isSelected) + if (objIt === undefined) { + cHeight = 0 + return + } + if (scrollDiv && selectedDiv) { + const r = selectedDiv.getBoundingClientRect() + const r2 = scrollDiv.getBoundingClientRect() + if (r && r2) { + if (r.top > r2.top && r.bottom < r2.bottom) { + cHeight = 0 + } else { + if (r.bottom < r2.bottom) { + cHeight = 1 + } else { + cHeight = -1 + } + } + } + } + } + + $: updateLocation(scrollDiv, selectedDiv, filteredObjects) @@ -111,7 +140,10 @@ />
{/if} -
+ {#if cHeight === 1} +
+ {/if} +
updateLocation(scrollDiv, selectedDiv, filteredObjects)} bind:this={scrollDiv}>
{#if item.isSelected} - +
+ +
{/if}
{/if} @@ -170,4 +204,7 @@
+ {#if cHeight === -1} +
+ {/if}
diff --git a/plugins/tracker-resources/src/components/ProjectSelector.svelte b/plugins/tracker-resources/src/components/ProjectSelector.svelte index b7f61799dd..f8d5b539f1 100644 --- a/plugins/tracker-resources/src/components/ProjectSelector.svelte +++ b/plugins/tracker-resources/src/components/ProjectSelector.svelte @@ -75,11 +75,12 @@ } const projectsInfo = [ - { id: null, icon: tracker.icon.Projects, label: tracker.string.NoProject }, + { id: null, icon: tracker.icon.Projects, label: tracker.string.NoProject, isSelected: !selectedProject }, ...rawProjects.map((p) => ({ id: p._id, icon: p.icon, - text: p.label + text: p.label, + isSelected: selectedProject ? p._id === selectedProject._id : false })) ]