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:
@@ -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.';
|
||||
|
||||
@@ -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) {
|
||||
|
||||
Reference in New Issue
Block a user