Skip to content

docs(vc-data-table): expand URL query state guidance and add a Storybook story#250

Merged
maksimzinchuk merged 1 commit into
mainfrom
docs/table-url-state-examples
Jun 26, 2026
Merged

docs(vc-data-table): expand URL query state guidance and add a Storybook story#250
maksimzinchuk merged 1 commit into
mainfrom
docs/table-url-state-examples

Conversation

@maksimzinchuk

Copy link
Copy Markdown
Collaborator

Summary

Follows up #249 with user-facing documentation for the table URL-query state feature.

Docs (vc-data-table.docs.md)

  • Completed the URL query persistence example: the reload watcher now covers all query dimensions ([sortExpression, searchValue, () => pagination.skip]), not just sort.
  • Added the required watch(searchValue, () => pagination.setPage(1)) with a warning explaining the pitfall it prevents: searching from a later page leaves a stale _page in the URL, so a reload requests a page beyond the filtered result set and renders an empty "nothing found" state.
  • Added a tip for composable-owned pagination (thread stateKey through; seed the initial load from pagination.skip).
  • New Common Mistake Dev #9 — "Not resetting the page when the search changes" with wrong/correct snippets.

Storybook (vc-data-table.stories.ts)

  • New WithUrlStatePersistence story. The per-blade query service is normally provided by the blade layer; the story provides an in-memory stand-in (provide(TableQueryStateKey, ...)) so the stateKey round-trip is visible: a live query string updates as you sort/search/page, and a Remount table button proves the state restores exactly as a page reload would from the URL. Includes the page-reset-on-search watcher.

Test plan

  • yarn typecheck — clean.
  • yarn docs:lint — 0 errors.
  • eslint on the story — clean.

@github-actions

github-actions Bot commented Jun 25, 2026

Copy link
Copy Markdown

📦 Preview published for commit 118d88b

Install the preview with dist-tag:

npm install @vc-shell/framework@pr-250

Or pin to the exact commit:

npm install @vc-shell/[email protected]

Published packages (dist-tag pr-250, version 2.1.0-pr250.118d88b):

  • @vc-shell/framework
  • @vc-shell/api-client-generator
  • @vc-shell/create-vc-app
  • @vc-shell/config-generator
  • @vc-shell/migrate
  • @vc-shell/ts-config
  • @vc-shell/mf-config
  • @vc-shell/mf-host
  • @vc-shell/mf-module
  • @vc-shell/vc-app-skill

…ook story

- docs: complete the URL query persistence example (full reload watcher set),
  add the required page-reset-on-search with a warning explaining the
  empty-page-on-reload pitfall, a tip for composable-owned pagination, and a
  new "Common Mistake" for not resetting the page on search.
- stories: add WithUrlStatePersistence — provides an in-memory stand-in for the
  per-blade query service so the stateKey round-trip (sort/search/page) and
  restore-on-remount are visible without the full blade/router stack.
@maksimzinchuk maksimzinchuk force-pushed the docs/table-url-state-examples branch from 0f0004f to 118d88b Compare June 26, 2026 08:34
@maksimzinchuk maksimzinchuk merged commit 855852d into main Jun 26, 2026
8 checks passed
@maksimzinchuk maksimzinchuk deleted the docs/table-url-state-examples branch June 26, 2026 08:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant