Skip to content

feat(ui): support direct data-url dataset paths#251

Merged
fahimfaisaal merged 4 commits into
mainfrom
feat/data-url-path-mode
Jul 22, 2026
Merged

feat(ui): support direct data-url dataset paths#251
fahimfaisaal merged 4 commits into
mainfrom
feat/data-url-path-mode

Conversation

@hfl0506

@hfl0506 hfl0506 commented Jul 21, 2026

Copy link
Copy Markdown
Collaborator

Related Issue

Closes #244

Changes

  • Add direct dataset deep links via / when --data-url is set.

  • Fetch only /dataset/ without loading the catalog
    first.

  • Preserve existing root, HTML/static asset, trailing-slash,
    embedded-data, and file:// behavior.

  • Reuse existing query handling for chart, group, legacy, and per-chart
    settings.

  • Ignore and omit ?id=/?d= in path mode while preserving the pathname.

  • Show full-page load errors with retry for failed direct-detail requests.

  • Add coverage for path parsing, encoded IDs, one-call loading, retry, URL
    apply/sync, and regressions.

  • Document SPA fallback requirements in CLI help and user documentation.

Test Result

# mock backend
from http.server import BaseHTTPRequestHandler, ThreadingHTTPServer
  from pathlib import Path
  from urllib.parse import unquote, urlparse
  import json

  payload = json.loads(Path("ui/src/data/sample.json").read_text())
  detail = payload[0] if isinstance(payload, list) else payload
  detail = {**detail, "id": "my-id", "name": "Local test"}

  class Handler(BaseHTTPRequestHandler):
      def send_json(self, status, payload):
          body = json.dumps(payload).encode()
          self.send_response(status)
          self.send_header("Content-Type", "application/json")
          self.send_header("Access-Control-Allow-Origin", "*")
          self.send_header("Content-Length", str(len(body)))
          self.end_headers()
          self.wfile.write(body)

      def do_GET(self):
          path = urlparse(self.path).path

          if path == "/datasets":
              self.send_json(200, [{"id": "my-id", "name": "Local test"}])
              return

          prefix = "/datasets/dataset/"
          if path.startswith(prefix) and unquote(path[len(prefix):]) == "my-id":
              self.send_json(200, detail)
              return

          self.send_json(404, {"error": "not found"})

  print("Backend: http://localhost:8080")
  ThreadingHTTPServer(("localhost", 8080), Handler).serve_forever()

Case 1

# Terminal 1: backend
python3 /tmp/vizb_mock_backend.py

# Terminal 2: frontend with SPA fallback
cd ui && pnpm vite ../site --host 127.0.0.1 --port 4173

# Open the path-mode test
open "http://127.0.0.1:4173/my-id?c=line&g=1&bar.3d=true"
screencapture-127-0-0-1-4173-my-id-2026-07-20-19_42_47

Summary by CodeRabbit

  • New Features
    • Added single-dataset deep links using URL paths (/<dataset-id>), with path identity taking precedence over id/d.
    • When using --data-url over HTTP(S), special “dataset-path mode” activates for collection URLs ending in /dataset, bypassing the catalog to load only the selected dataset details (and using generated HTML as fallback for deep links).
  • Bug Fixes
    • Full-page load error state now includes retry support to reload the active dataset.
  • Documentation
    • Expanded --data-url documentation for runtime behavior, caching/error expectations, CORS guidance, and help text examples.
  • Tests
    • Added/updated unit tests covering path-mode activation, retries, and URL sync behavior.

@coderabbitai

coderabbitai Bot commented Jul 21, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 8f502781-9c64-4c82-85b9-7c5e81d4c43b

📥 Commits

Reviewing files that changed from the base of the PR and between bea807c and 54731ef.

📒 Files selected for processing (9)
  • cmd/ui.go
  • docs/src/content/docs/ci-cd/github-action.mdx
  • docs/src/content/docs/commands/ui.mdx
  • ui/src/composables/useDataPoint.test.ts
  • ui/src/composables/useDataPoint.ts
  • ui/src/composables/useUrlRouter.test.ts
  • ui/src/composables/useUrlRouter.ts
  • ui/src/lib/remoteData.test.ts
  • ui/src/lib/remoteData.ts
🚧 Files skipped from review as they are similar to previous changes (5)
  • docs/src/content/docs/ci-cd/github-action.mdx
  • ui/src/composables/useUrlRouter.ts
  • cmd/ui.go
  • ui/src/composables/useDataPoint.ts
  • ui/src/composables/useUrlRouter.test.ts

📝 Walkthrough

Walkthrough

Adds /:id routing for --data-url dashboards, enabling direct dataset-detail loading over HTTP(S). Path identities override query identities, remain in synchronized URLs, support encoded IDs and retries, and are covered by tests, CLI help, and documentation.

Changes

Single-dataset path routing

Layer / File(s) Summary
Dataset path identity and remote URL contract
ui/src/lib/pathRoute.ts, ui/src/lib/pathRoute.test.ts, ui/src/lib/remoteData.ts, ui/src/lib/remoteData.test.ts
Adds pathname parsing, dataset-collection URL detection, and encoded detail URL construction with query preservation.
Direct detail loading and retry
ui/src/composables/useDataPoint.ts, ui/src/composables/useDataPoint.test.ts, ui/src/views/Dashboard.vue
Loads dataset details directly for valid HTTP(S) path identities, manages loading and error state, supports retry, exposes pathDatasetId, and wires retry handling to LoadError.
Path identity URL routing
ui/src/composables/useUrlRouter.ts, ui/src/composables/useUrlRouter.test.ts
Prioritizes path identity over id/d query parameters and omits those parameters when synchronizing path-based URLs.
Path mode documentation and CLI help
docs/src/content/docs/commands/ui.mdx, docs/src/content/docs/ci-cd/github-action.mdx, cmd/ui.go
Documents direct detail fetching, SPA fallback routing, query behavior, response rules, and CORS requirements.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant Browser
  participant useDataPoint
  participant DataURL
  Browser->>useDataPoint: Open /<encoded-id> with --data-url
  useDataPoint->>DataURL: Fetch /dataset/<encoded-id>
  DataURL-->>useDataPoint: Return dataset detail
  useDataPoint-->>Browser: Render the selected dataset
Loading

Possibly related PRs

  • goptics/vizb#257: Updates the payload classification and dataset-loading flow used by the path-mode detail loading changes.

Suggested reviewers: fahimfaisaal

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title is concise and accurately describes the main change: direct dataset paths for --data-url.
Linked Issues check ✅ Passed The PR implements path-mode deep links, preserves existing query handling and fallbacks, and adds docs/tests as required.
Out of Scope Changes check ✅ Passed The added helper, tests, router sync, error retry, and docs all support the stated path-routing feature.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch

Comment @coderabbitai help to get the list of available commands.

@hfl0506 hfl0506 added enhancement New feature or request ui ui-related tasks labels Jul 21, 2026
@hfl0506 hfl0506 added this to the Release v0.17.0 milestone Jul 21, 2026
@codecov-commenter

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

@hfl0506
hfl0506 marked this pull request as ready for review July 21, 2026 02:48
@hfl0506
hfl0506 requested a review from fahimfaisaal as a code owner July 21, 2026 02:48

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@cmd/ui.go`:
- Around line 50-51: Update the HTTP(S) route description in cmd/ui.go to use
“/<encoded-id>” instead of “/<id>”, matching the terminology on line 49 and
indicating that dataset IDs with special characters must be URL-encoded.

In `@docs/src/content/docs/commands/ui.mdx`:
- Line 101: Update the documentation sentence describing the final path segment
of <data-url> to call the dataset ID “encoded” rather than “decoded,” consistent
with the <encoded-id> terminology and implementation.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 3e495713-2338-44d2-a2b9-6db64b5b2511

📥 Commits

Reviewing files that changed from the base of the PR and between 354caee and 5fb3778.

📒 Files selected for processing (10)
  • cmd/ui.go
  • docs/src/content/docs/ci-cd/github-action.mdx
  • docs/src/content/docs/commands/ui.mdx
  • ui/src/composables/useDataPoint.test.ts
  • ui/src/composables/useDataPoint.ts
  • ui/src/composables/useUrlRouter.test.ts
  • ui/src/composables/useUrlRouter.ts
  • ui/src/lib/pathRoute.test.ts
  • ui/src/lib/pathRoute.ts
  • ui/src/views/Dashboard.vue

Comment thread cmd/ui.go Outdated
Comment thread docs/src/content/docs/commands/ui.mdx Outdated
@hfl0506
hfl0506 force-pushed the feat/data-url-path-mode branch from 5fb3778 to bea807c Compare July 21, 2026 21:27

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@ui/src/composables/useUrlRouter.ts`:
- Around line 254-260: Update initFromUrl() to call syncUrlToState() immediately
after registering the watcher, but only when applyParams(params) returns
applied=true. Do not perform this initial synchronization when initialization
fails, so retryable error URLs preserve their original query parameters.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: b3dc55e9-af0f-43fd-bdb0-5e321077a8fc

📥 Commits

Reviewing files that changed from the base of the PR and between 5fb3778 and bea807c.

📒 Files selected for processing (10)
  • cmd/ui.go
  • docs/src/content/docs/ci-cd/github-action.mdx
  • docs/src/content/docs/commands/ui.mdx
  • ui/src/composables/useDataPoint.test.ts
  • ui/src/composables/useDataPoint.ts
  • ui/src/composables/useUrlRouter.test.ts
  • ui/src/composables/useUrlRouter.ts
  • ui/src/lib/pathRoute.test.ts
  • ui/src/lib/pathRoute.ts
  • ui/src/views/Dashboard.vue
🚧 Files skipped from review as they are similar to previous changes (8)
  • ui/src/lib/pathRoute.ts
  • ui/src/lib/pathRoute.test.ts
  • ui/src/views/Dashboard.vue
  • cmd/ui.go
  • ui/src/composables/useDataPoint.test.ts
  • docs/src/content/docs/ci-cd/github-action.mdx
  • ui/src/composables/useUrlRouter.test.ts
  • ui/src/composables/useDataPoint.ts

Comment thread ui/src/composables/useUrlRouter.ts
@hfl0506

hfl0506 commented Jul 22, 2026

Copy link
Copy Markdown
Collaborator Author

hi @fahimfaisaal can I get you review this PR when you have a chance ? Thanks

@fahimfaisaal

Copy link
Copy Markdown
Member

@hfl0506 I will review, all of your pending PRs by today, In sha Allah

@hfl0506

hfl0506 commented Jul 22, 2026

Copy link
Copy Markdown
Collaborator Author

@hfl0506 I will review, all of your pending PRs by today, In sha Allah

No worries man, thanks for helping for reviewing! Do you have a discord or something ?

@fahimfaisaal

Copy link
Copy Markdown
Member

Updated the path behavior so /:id only activates when --data-url ends in /dataset. This keeps normal JSON and catalog URLs on their existing flow and avoids building /dataset/dataset/:id URLs.

I also added integration-style Vitest coverage for catalog selection, caching, retries, and direct path loading. The docs now use neutral examples and make clear that --data-url is visible to the client, so it should not contain secrets.

@fahimfaisaal

Copy link
Copy Markdown
Member

@hfl0506 Yeah, I have a Discord personal account username: fahimfaisaal, but don't have any community server for Goptics yet. have this in my mind just.

@fahimfaisaal

Copy link
Copy Markdown
Member

@hfl0506 we can connect on discord

@fahimfaisaal
fahimfaisaal merged commit 6d9b88f into main Jul 22, 2026
16 checks passed
@fahimfaisaal
fahimfaisaal deleted the feat/data-url-path-mode branch July 22, 2026 06:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request ui ui-related tasks

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[feat]: single-dataset path route /:id for --data-url

3 participants