fix(guide): collapsible nav not toggling — reference open/searching directly (Svelte reactivity)
isOpen() helper hid the dependency on `open` from Svelte's tracking, so clicks updated state but not the view. Inline (searching || open[key]) instead. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -52,7 +52,6 @@
|
||||
$: productApps = filtered.filter(a => a.app !== 'platform' && a.app !== 'technical');
|
||||
$: platformApp = filtered.find(a => a.app === 'platform') ?? null;
|
||||
$: technicalApp = filtered.find(a => a.app === 'technical') ?? null;
|
||||
const isOpen = (key: string) => searching || !!open[key];
|
||||
|
||||
async function loadNav() {
|
||||
loadingNav = true;
|
||||
@@ -110,15 +109,15 @@
|
||||
{#if productApps.length}
|
||||
<div class="nav-sec">
|
||||
<button class="sec-head" on:click={() => toggle('modules')}>
|
||||
<span class="chev">{isOpen('modules') ? '▾' : '▸'}</span> Modules
|
||||
<span class="chev">{(searching || open['modules']) ? '▾' : '▸'}</span> Modules
|
||||
</button>
|
||||
{#if isOpen('modules')}
|
||||
{#if (searching || open['modules'])}
|
||||
{#each productApps as app (app.app)}
|
||||
<div class="nav-app">
|
||||
<button class="app-head" on:click={() => toggle('app:' + app.app)}>
|
||||
<span class="chev">{isOpen('app:' + app.app) ? '▾' : '▸'}</span> {appLabel(app.app)}
|
||||
<span class="chev">{(searching || open['app:' + app.app]) ? '▾' : '▸'}</span> {appLabel(app.app)}
|
||||
</button>
|
||||
{#if isOpen('app:' + app.app)}
|
||||
{#if (searching || open['app:' + app.app])}
|
||||
{#each app.modules as m (m.module)}
|
||||
<button class="nav-item nested" class:active={m.module === activeModuleKey}
|
||||
on:click={() => selectModule(m.module)} title={m.module}>{m.title}</button>
|
||||
@@ -134,9 +133,9 @@
|
||||
{#if platformApp}
|
||||
<div class="nav-sec">
|
||||
<button class="sec-head" on:click={() => toggle('platform')}>
|
||||
<span class="chev">{isOpen('platform') ? '▾' : '▸'}</span> Platform
|
||||
<span class="chev">{(searching || open['platform']) ? '▾' : '▸'}</span> Platform
|
||||
</button>
|
||||
{#if isOpen('platform')}
|
||||
{#if (searching || open['platform'])}
|
||||
{#each platformApp.modules as m (m.module)}
|
||||
<button class="nav-item" class:active={m.module === activeModuleKey}
|
||||
on:click={() => selectModule(m.module)} title={m.module}>{m.title}</button>
|
||||
@@ -149,9 +148,9 @@
|
||||
{#if technicalApp}
|
||||
<div class="nav-sec">
|
||||
<button class="sec-head" on:click={() => toggle('technical')}>
|
||||
<span class="chev">{isOpen('technical') ? '▾' : '▸'}</span> Technical
|
||||
<span class="chev">{(searching || open['technical']) ? '▾' : '▸'}</span> Technical
|
||||
</button>
|
||||
{#if isOpen('technical')}
|
||||
{#if (searching || open['technical'])}
|
||||
{#each technicalApp.modules as m (m.module)}
|
||||
<button class="nav-item" class:active={m.module === activeModuleKey}
|
||||
on:click={() => selectModule(m.module)} title={m.module}>{m.title}</button>
|
||||
|
||||
Reference in New Issue
Block a user