diff --git a/packages/presentation/src/utils.ts b/packages/presentation/src/utils.ts index 96cea7b479..db1a8d6082 100644 --- a/packages/presentation/src/utils.ts +++ b/packages/presentation/src/utils.ts @@ -79,7 +79,7 @@ export function setClient (_client: Client): void { } export class LiveQuery { - private unsubscribe = () => {} + unsubscribe = () => {} constructor () { onDestroy(() => { @@ -95,7 +95,11 @@ export class LiveQuery { options?: FindOptions ): void { this.unsubscribe() - this.unsubscribe = liveQuery.query(_class, query, callback, options) + const unsub = liveQuery.query(_class, query, callback, options) + this.unsubscribe = () => { + unsub() + this.unsubscribe = () => {} + } } } diff --git a/plugins/task-resources/src/components/kanban/KanbanView.svelte b/plugins/task-resources/src/components/kanban/KanbanView.svelte index 9aa37b148a..360e248fc1 100644 --- a/plugins/task-resources/src/components/kanban/KanbanView.svelte +++ b/plugins/task-resources/src/components/kanban/KanbanView.svelte @@ -31,6 +31,7 @@ export let _class: Ref> export let space: Ref export let open: AnyComponent + export let search: string export let options: FindOptions | undefined export let config: string[] @@ -55,19 +56,51 @@ const doneStatesQ = createQuery() $: if (kanban !== undefined) { - doneStatesQ.query(task.class.DoneState, { space: kanban.space }, (result) => { - wonState = result.find((x) => x._class === task.class.WonState) - lostState = result.find((x) => x._class === task.class.LostState) - }) + doneStatesQ.query( + task.class.DoneState, + { space: kanban.space, ...search !== '' ? {$search: search} : {} }, + (result) => { + wonState = result.find((x) => x._class === task.class.WonState) + lostState = result.find((x) => x._class === task.class.LostState) + }) } - const query = createQuery() - $: query.query(_class, { space, doneState: null }, result => { objects = result }, { - ...options, - sort: { - rank: SortingOrder.Ascending + const objsQ = createQuery() + $: objsQ.query( + _class, + { + space, + doneState: null, + ...search !== '' ? {$search: search} : {} }, - }) + result => { objects = result }, + { + ...options, + sort: { + rank: SortingOrder.Ascending + }, + } + ) + + const filteredObjsQ = createQuery() + + // Undefined means no filtering + let target: Set> | undefined + $: if (search === '') { + filteredObjsQ.unsubscribe() + target = undefined + } else { + filteredObjsQ.query( + _class, + { + space, + doneState: null, + ...search !== '' ? {$search: search} : {} + }, + result => { target = new Set(result.map(x => x._id)) }, + options + ) + } function dragover (ev: MouseEvent, object: Item) { if (dragCard !== object) { @@ -162,7 +195,7 @@ }}> {#each objects as object, j (object)} - {#if object.state === state._id} + {#if object.state === state._id && (target === undefined || target.has(object._id))}
{ diff --git a/plugins/workbench-resources/src/components/SpaceContent.svelte b/plugins/workbench-resources/src/components/SpaceContent.svelte new file mode 100644 index 0000000000..42a7d06444 --- /dev/null +++ b/plugins/workbench-resources/src/components/SpaceContent.svelte @@ -0,0 +1,70 @@ + + + + +{#if viewlet} +
+ +
+{/if} + + diff --git a/plugins/workbench-resources/src/components/SpaceHeader.svelte b/plugins/workbench-resources/src/components/SpaceHeader.svelte index 3514cb73f6..96b90e8910 100644 --- a/plugins/workbench-resources/src/components/SpaceHeader.svelte +++ b/plugins/workbench-resources/src/components/SpaceHeader.svelte @@ -14,42 +14,78 @@ --> -
- {#if data} -
+
+ {#if space} +
+ {#if viewlets.length > 1} +
+ {#each viewlets as viewlet, i} + +
{ selectedViewlet = i }}> + +
+
+ {/each} +
+ {/if} + {#if createItemDialog}
@@ -65,4 +101,21 @@ height: 4rem; min-height: 4rem; } + + .btn { + width: 2.5rem; + height: 2.5rem; + background-color: transparent; + border-radius: .5rem; + cursor: pointer; + + color: var(--theme-content-trans-color); + &:hover { color: var(--theme-caption-color); } + &.selected { + color: var(--theme-content-accent-color); + background-color: var(--theme-button-bg-enabled); + cursor: default; + &:hover { color: var(--theme-caption-color); } + } + } diff --git a/plugins/workbench-resources/src/components/SpaceView.svelte b/plugins/workbench-resources/src/components/SpaceView.svelte index ee6e6cb435..18bc8da525 100644 --- a/plugins/workbench-resources/src/components/SpaceView.svelte +++ b/plugins/workbench-resources/src/components/SpaceView.svelte @@ -1,6 +1,5 @@ -{#await getViewlets(client, _class)} - ... -{:then viewlets} - - {#if viewlets.length > 0} -
- - - {#if viewlets.length > 1} -
- {#each viewlets as viewlet, i} - -
{ selected = i }}> - -
-
- {/each} -
- {/if} -
- {/if} - -
- -
- -{/await} - - + +{#if currentView && currentSpace} + +{/if} diff --git a/plugins/workbench-resources/src/components/Workbench.svelte b/plugins/workbench-resources/src/components/Workbench.svelte index b8bb7955c9..e01bf4af9b 100644 --- a/plugins/workbench-resources/src/components/Workbench.svelte +++ b/plugins/workbench-resources/src/components/Workbench.svelte @@ -26,7 +26,6 @@ import workbench from '../plugin' import Navigator from './Navigator.svelte' - import SpaceHeader from './SpaceHeader.svelte' import SpaceView from './SpaceView.svelte' import { AnyComponent, Component, location, Popup, showPopup, TooltipInstance, closeTooltip, ActionIcon, IconEdit, AnySvelteComponent } from '@anticrm/ui' @@ -141,10 +140,7 @@ {:else if specialComponent} {:else} - - {#if currentView && currentSpace} - - {/if} + {/if}