Show pack display name instead of raw ID in title

The pack-shell title showed the raw packId like 'Pack pack-291b12b...'
which is unreadable. Now looks up the display name from the pack store
cache. Falls back to a truncated ID (first 12 chars) when no name is
available. Added PolicyPackStore.currentPacks() synchronous accessor
for the computed signal lookup.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
master
2026-03-29 16:09:25 +03:00
parent a8ad459506
commit 7d6bc2b0ab
2 changed files with 17 additions and 1 deletions

View File

@@ -18,6 +18,7 @@ import {
import { filter, startWith } from 'rxjs';
import { StellaPageTabsComponent, StellaPageTab } from '../../shared/components/stella-page-tabs/stella-page-tabs.component';
import { PolicyPackStore } from '../policy-studio/services/policy-pack.store';
type PackSubview =
| 'workspace'
@@ -49,7 +50,7 @@ const PACK_DETAIL_TABS: readonly StellaPageTab[] = [
<section class="policy-pack-shell" data-testid="policy-pack-shell">
<header class="pack-shell__header">
<div>
<h1 class="pack-shell__title">{{ packId() ? 'Pack ' + packId() : 'Policy Pack Workspace' }}</h1>
<h1 class="pack-shell__title">{{ packTitle() }}</h1>
<p class="pack-shell__subtitle">{{ activeSubtitle() }}</p>
</div>
</header>
@@ -84,6 +85,7 @@ export class PolicyPackShellComponent {
private readonly route = inject(ActivatedRoute);
private readonly router = inject(Router);
private readonly destroyRef = inject(DestroyRef);
private readonly packStore = inject(PolicyPackStore);
readonly packId = signal<string | null>(this.readPackId());
readonly activeSubview = signal<PackSubview>(this.readSubview());
@@ -92,6 +94,15 @@ export class PolicyPackShellComponent {
return this.packId() ? PACK_DETAIL_TABS : WORKSPACE_TABS;
});
readonly packTitle = computed(() => {
const id = this.packId();
if (!id) return 'Policy Pack Workspace';
// Try to find display name from the pack store cache
const packs = this.packStore.currentPacks();
const match = packs?.find((p) => p.id === id);
return match?.name && match.name !== id ? match.name : `Pack ${id.replace(/^pack-/, '').slice(0, 12)}`;
});
protected readonly activeSubtitle = computed(() => {
if (!this.packId()) {
return 'Browse deterministic pack inventory and open a pack into authoring mode.';

View File

@@ -15,6 +15,11 @@ export class PolicyPackStore {
private usingFallback = false;
private readonly cacheKey = 'policy-studio:packs-cache';
/** Synchronous snapshot of the current packs (may be null if not yet loaded). */
currentPacks(): PolicyPackSummary[] | null {
return this.packs$.value;
}
getPacks(options: { allowRemoteFetch?: boolean } = {}): Observable<PolicyPackSummary[]> {
const allowRemoteFetch = options.allowRemoteFetch ?? true;
if (!this.loading) {