Add shell omnibox foundation
This commit is contained in:
@@ -0,0 +1,7 @@
|
||||
namespace RolemasterDb.App.Components.Shell;
|
||||
|
||||
public sealed record ShellOmniboxCommand(
|
||||
string Shortcut,
|
||||
string Label,
|
||||
string Description,
|
||||
string Href);
|
||||
@@ -1,3 +1,242 @@
|
||||
<AppBarActionButton CssClass="shell-omnibox-trigger" Disabled="true" Title="Shared omnibox arrives in Phase 2." AriaLabel="Search tables or commands">
|
||||
@using System.Linq
|
||||
@using RolemasterDb.App.Frontend.AppState
|
||||
@inject NavigationManager NavigationManager
|
||||
@inject LookupService LookupService
|
||||
@inject RolemasterDb.App.Frontend.AppState.PinnedTablesState PinnedTablesState
|
||||
@inject RolemasterDb.App.Frontend.AppState.RecentTablesState RecentTablesState
|
||||
@inject RolemasterDb.App.Frontend.AppState.TableContextState TableContextState
|
||||
|
||||
<AppBarActionButton CssClass="shell-omnibox-trigger" Title="Search tables or commands" AriaLabel="Search tables or commands" OnClick="ToggleOpenAsync">
|
||||
<span class="shell-omnibox-trigger-label">Search tables or commands</span>
|
||||
</AppBarActionButton>
|
||||
|
||||
<SurfaceDrawer
|
||||
IsOpen="isOpen"
|
||||
Placement="end"
|
||||
Title="Search tables and commands"
|
||||
AriaLabel="Search tables and commands"
|
||||
CssClass="shell-omnibox-drawer"
|
||||
OnClose="CloseAsync">
|
||||
<div class="shell-omnibox-panel">
|
||||
<label class="shell-omnibox-search">
|
||||
<span class="visually-hidden">Search tables or commands</span>
|
||||
<input
|
||||
class="input-shell shell-omnibox-input"
|
||||
placeholder="Search tables or type /"
|
||||
@bind="query"
|
||||
@bind:event="oninput" />
|
||||
</label>
|
||||
|
||||
@if (isLoading)
|
||||
{
|
||||
<p class="muted">Loading searchable tables…</p>
|
||||
}
|
||||
else
|
||||
{
|
||||
@if (MatchingTables.Count > 0)
|
||||
{
|
||||
<InspectorSection Title="Tables" Description="Open a critical table in reference mode.">
|
||||
<div class="shell-omnibox-results">
|
||||
@foreach (var table in MatchingTables)
|
||||
{
|
||||
<button type="button" class="shell-omnibox-result" @onclick="() => OpenTableAsync(table.Key)">
|
||||
<span class="shell-omnibox-result-main">
|
||||
<strong>@table.Label</strong>
|
||||
<span>@table.Family</span>
|
||||
</span>
|
||||
<span class="shell-omnibox-result-meta">
|
||||
@if (PinnedTablesState.IsPinned(table.Key))
|
||||
{
|
||||
<StatusChip Tone="accent">Pinned</StatusChip>
|
||||
}
|
||||
<span class="chip">@($"{table.CurationPercentage}%")</span>
|
||||
</span>
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</InspectorSection>
|
||||
}
|
||||
|
||||
@if (MatchingPinned.Count > 0)
|
||||
{
|
||||
<InspectorSection Title="Pinned tables" Description="Saved shortcuts available across destinations.">
|
||||
<div class="shell-omnibox-results">
|
||||
@foreach (var table in MatchingPinned)
|
||||
{
|
||||
<button type="button" class="shell-omnibox-result" @onclick="() => OpenTableAsync(table.Slug)">
|
||||
<span class="shell-omnibox-result-main">
|
||||
<strong>@table.Label</strong>
|
||||
<span>@table.Family</span>
|
||||
</span>
|
||||
<span class="shell-omnibox-result-meta">
|
||||
<StatusChip Tone="accent">Pinned</StatusChip>
|
||||
</span>
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</InspectorSection>
|
||||
}
|
||||
|
||||
@if (MatchingRecent.Count > 0)
|
||||
{
|
||||
<InspectorSection Title="Recent tables" Description="Resume recently opened critical tables.">
|
||||
<div class="shell-omnibox-results">
|
||||
@foreach (var table in MatchingRecent)
|
||||
{
|
||||
<button type="button" class="shell-omnibox-result" @onclick="() => OpenTableAsync(table.Slug)">
|
||||
<span class="shell-omnibox-result-main">
|
||||
<strong>@table.Label</strong>
|
||||
<span>@table.Family</span>
|
||||
</span>
|
||||
<span class="shell-omnibox-result-meta">
|
||||
<StatusChip Tone="info">Recent</StatusChip>
|
||||
</span>
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</InspectorSection>
|
||||
}
|
||||
|
||||
@if (MatchingCommands.Count > 0)
|
||||
{
|
||||
<InspectorSection Title="Commands" Description="Navigate directly to key workflows.">
|
||||
<div class="shell-omnibox-results">
|
||||
@foreach (var command in MatchingCommands)
|
||||
{
|
||||
<button type="button" class="shell-omnibox-result" @onclick="() => OpenCommandAsync(command.Href)">
|
||||
<span class="shell-omnibox-result-main">
|
||||
<strong>@command.Shortcut</strong>
|
||||
<span>@command.Description</span>
|
||||
</span>
|
||||
<span class="shell-omnibox-result-meta">
|
||||
<StatusChip Tone="neutral">@command.Label</StatusChip>
|
||||
</span>
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</InspectorSection>
|
||||
}
|
||||
|
||||
@if (MatchingTables.Count == 0 && MatchingPinned.Count == 0 && MatchingRecent.Count == 0 && MatchingCommands.Count == 0)
|
||||
{
|
||||
<InspectorSection Title="No matches" Description="Try a different table name, family, or slash command.">
|
||||
<StatusIndicator Tone="warning">Nothing matches “@query”.</StatusIndicator>
|
||||
</InspectorSection>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</SurfaceDrawer>
|
||||
|
||||
@code {
|
||||
private static readonly IReadOnlyList<ShellOmniboxCommand> Commands =
|
||||
[
|
||||
new("/tables", "Reference", "Open the reference tables surface.", "/tables"),
|
||||
new("/curation", "Curation", "Open the queue-first curation workflow.", "/curation"),
|
||||
new("/tools", "Tools", "Open the developer tools hub.", "/tools"),
|
||||
new("/diag", "Diagnostics", "Open tooling diagnostics.", "/tools/diagnostics"),
|
||||
new("/api", "API", "Open API surface documentation.", "/tools/api")
|
||||
];
|
||||
|
||||
private LookupReferenceData? referenceData;
|
||||
private bool isOpen;
|
||||
private bool isLoading;
|
||||
private string query = string.Empty;
|
||||
|
||||
private IReadOnlyList<CriticalTableReference> MatchingTables =>
|
||||
referenceData?.CriticalTables
|
||||
.Where(MatchesTableQuery)
|
||||
.Take(8)
|
||||
.ToList()
|
||||
?? [];
|
||||
|
||||
private IReadOnlyList<PinnedTableEntry> MatchingPinned =>
|
||||
PinnedTablesState.Items
|
||||
.Where(item => MatchesText(item.Label, item.Family, item.Slug))
|
||||
.Take(6)
|
||||
.ToList();
|
||||
|
||||
private IReadOnlyList<RecentTableEntry> MatchingRecent =>
|
||||
RecentTablesState.Items
|
||||
.Where(item => MatchesText(item.Label, item.Family, item.Slug))
|
||||
.Take(6)
|
||||
.ToList();
|
||||
|
||||
private IReadOnlyList<ShellOmniboxCommand> MatchingCommands =>
|
||||
Commands
|
||||
.Where(command => MatchesText(command.Shortcut, command.Label, command.Description))
|
||||
.Take(5)
|
||||
.ToList();
|
||||
|
||||
private async Task ToggleOpenAsync(MouseEventArgs _)
|
||||
{
|
||||
if (isOpen)
|
||||
{
|
||||
await CloseAsync();
|
||||
return;
|
||||
}
|
||||
|
||||
isOpen = true;
|
||||
await EnsureLoadedAsync();
|
||||
}
|
||||
|
||||
private Task CloseAsync()
|
||||
{
|
||||
isOpen = false;
|
||||
query = string.Empty;
|
||||
return Task.CompletedTask;
|
||||
}
|
||||
|
||||
private async Task EnsureLoadedAsync()
|
||||
{
|
||||
if (referenceData is not null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
isLoading = true;
|
||||
|
||||
try
|
||||
{
|
||||
await RecentTablesState.InitializeAsync();
|
||||
await PinnedTablesState.InitializeAsync();
|
||||
referenceData = await LookupService.GetReferenceDataAsync();
|
||||
}
|
||||
finally
|
||||
{
|
||||
isLoading = false;
|
||||
}
|
||||
}
|
||||
|
||||
private async Task OpenTableAsync(string tableSlug)
|
||||
{
|
||||
var snapshot = new RolemasterDb.App.Frontend.AppState.TableContextSnapshot(
|
||||
TableSlug: tableSlug,
|
||||
Mode: RolemasterDb.App.Frontend.AppState.TableContextMode.Reference);
|
||||
|
||||
await TableContextState.PersistAsync("tables", snapshot);
|
||||
await CloseAsync();
|
||||
NavigationManager.NavigateTo(TableContextState.BuildUri("/tables", snapshot));
|
||||
}
|
||||
|
||||
private async Task OpenCommandAsync(string href)
|
||||
{
|
||||
await CloseAsync();
|
||||
NavigationManager.NavigateTo(href);
|
||||
}
|
||||
|
||||
private bool MatchesTableQuery(CriticalTableReference table) =>
|
||||
MatchesText(table.Label, table.Key, table.Family, table.SourceDocument);
|
||||
|
||||
private bool MatchesText(params string?[] values)
|
||||
{
|
||||
var normalizedQuery = query.Trim();
|
||||
if (string.IsNullOrWhiteSpace(normalizedQuery))
|
||||
{
|
||||
return true;
|
||||
}
|
||||
|
||||
return values.Any(value =>
|
||||
!string.IsNullOrWhiteSpace(value) &&
|
||||
value.Contains(normalizedQuery, StringComparison.OrdinalIgnoreCase));
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user