feat(data-stores): auto-load on mount, default sort updated_on DESC, fix sort toggle

- $effect auto-searches once $ae_api is ready (no manual Search click needed)
- Default sort: updated_on DESC (most recently changed first)
- toggle_sort: remove searched guard — column headers always trigger search
- Remove stale "press Search to begin" empty state (no longer relevant)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-06-17 15:59:59 -04:00
parent 8110ddb84e
commit a6abcd6603

View File

@@ -40,8 +40,8 @@ let qry_for_id = $state('');
let qry_enabled = $state<'all' | 'enabled' | 'not_enabled'>('all');
let page_limit = $state(50);
let page_offset = $state(0);
let sort_col = $state<string>('code');
let sort_dir = $state<'ASC' | 'DESC'>('ASC');
let sort_col = $state<string>('updated_on');
let sort_dir = $state<'ASC' | 'DESC'>('DESC');
// ── Results ───────────────────────────────────────────────────────────────────
let results: ae_DataStore[] = $state([]);
@@ -62,6 +62,12 @@ let rename_loading = $state(false);
let rename_apply_status = $state<'idle' | 'applying' | 'done' | 'error'>('idle');
let rename_applied = $state(0);
// Auto-load on first render once the API config is available
$effect(() => {
if (!$ae_api?.base_url || searched || loading) return;
untrack(() => do_search());
});
// ── Search ────────────────────────────────────────────────────────────────────
async function do_search(reset = true) {
if (reset) page_offset = 0;
@@ -121,7 +127,7 @@ function toggle_sort(col: string) {
sort_col = col;
sort_dir = 'ASC';
}
if (searched) do_search(false);
do_search(false);
}
// ── Open edit / new ───────────────────────────────────────────────────────────
@@ -568,18 +574,12 @@ function content_preview(ds: ae_DataStore): string {
</div>
</div>
{:else if searched && !loading}
{:else if !loading}
<div class="py-12 text-center opacity-50">
<Database size={48} class="mx-auto mb-4 opacity-30" />
<p class="text-lg font-bold">No data stores found</p>
<p class="text-sm">Try different filters, or create one above.</p>
</div>
{:else if !searched}
<div class="py-12 text-center opacity-40">
<Search size={40} class="mx-auto mb-3 opacity-30" />
<p class="text-sm">Enter filters and press Search, or just press Search to list all.</p>
</div>
{/if}
</div>