mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-14 20:21:09 +02:00
feat(workbench): scope-active badge on scene pills
Phase 3 follow-up from docs/plans/scene-scope-empty-state.md — a small Funnel icon now sits next to the scene count whenever the scene has an explicit `scopeTagIds` set. Users can see at a glance that a scope filter is active even when the module lists aren't empty, instead of only noticing the filter when a list turns up zero results. Only marks explicit scene-level scope; the agent-derived scope is already signalled by the bound-agent avatar. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
f09a84ac8e
commit
dcec0d31ee
1 changed files with 21 additions and 1 deletions
|
|
@ -3,7 +3,7 @@
|
|||
Rendered by the layout's bottom-stack via bottomBarStore.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import { Plus, Check, X } from '@mana/shared-icons';
|
||||
import { Plus, Check, X, Funnel } from '@mana/shared-icons';
|
||||
import { tick } from 'svelte';
|
||||
import type { CarouselPage } from '$lib/components/page-carousel/types';
|
||||
import type { WorkbenchScene } from '$lib/types/workbench-scenes';
|
||||
|
|
@ -82,6 +82,7 @@
|
|||
|
||||
{#if isActive && pages.length > 0}
|
||||
{@const boundAgent = scene.viewingAsAgentId ? agentById.get(scene.viewingAsAgentId) : null}
|
||||
{@const hasScope = (scene.scopeTagIds?.length ?? 0) > 0}
|
||||
<!-- Active scene + its app tabs wrapped in a visual group -->
|
||||
<div class="scene-group">
|
||||
<button
|
||||
|
|
@ -95,6 +96,11 @@
|
|||
<span class="scene-agent-avatar">{boundAgent.avatar ?? '🤖'}</span>
|
||||
{/if}
|
||||
<span class="scene-name">{scene.name}</span>
|
||||
{#if hasScope}
|
||||
<span class="scope-badge" title="Bereichsfilter aktiv">
|
||||
<Funnel size={10} weight="fill" />
|
||||
</span>
|
||||
{/if}
|
||||
<span class="scene-count">{scene.openApps.length}</span>
|
||||
</button>
|
||||
<span class="group-sep"></span>
|
||||
|
|
@ -121,6 +127,7 @@
|
|||
</div>
|
||||
{:else}
|
||||
{@const boundAgent = scene.viewingAsAgentId ? agentById.get(scene.viewingAsAgentId) : null}
|
||||
{@const hasScope = (scene.scopeTagIds?.length ?? 0) > 0}
|
||||
<button
|
||||
type="button"
|
||||
class="scene-pill"
|
||||
|
|
@ -133,6 +140,11 @@
|
|||
<span class="scene-agent-avatar">{boundAgent.avatar ?? '🤖'}</span>
|
||||
{/if}
|
||||
<span class="scene-name">{scene.name}</span>
|
||||
{#if hasScope}
|
||||
<span class="scope-badge" title="Bereichsfilter aktiv">
|
||||
<Funnel size={10} weight="fill" />
|
||||
</span>
|
||||
{/if}
|
||||
<span class="scene-count">{scene.openApps.length}</span>
|
||||
</button>
|
||||
{/if}
|
||||
|
|
@ -245,6 +257,14 @@
|
|||
font-weight: 500;
|
||||
color: hsl(var(--color-muted-foreground));
|
||||
}
|
||||
.scope-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: hsl(var(--color-primary));
|
||||
opacity: 0.8;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.group-sep {
|
||||
width: 1px;
|
||||
height: 1.25rem;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue