Run any Skill in Manus with one click

fetcher-viewer-components

Stars15

Forks4

UpdatedMay 27, 2026 at 09:41

Use when building Fetcher Viewer React and Ant Design data table experiences, including FetcherViewer, Viewer, View, ViewTable, FilterPanel, EditableFilterPanel, view management, TopBar actions, row selection, column settings, cell renderers, and form controls.

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

Ahoo-Wang

Ahoo-Wang/fetcher

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Software DevelopersComputer and Mathematical Occupations·SOC 15-1252

File Explorer

3 files

SKILL.md

readonly

name	fetcher-viewer-components
description	Use when building Fetcher Viewer React and Ant Design data table experiences, including FetcherViewer, Viewer, View, ViewTable, FilterPanel, EditableFilterPanel, view management, TopBar actions, row selection, column settings, cell renderers, and form controls.

fetcher-viewer-components

Use This Skill When

The task involves data tables, filtering, view management, or Fetcher Viewer components.
The task mentions FetcherViewer, Viewer, View, ViewTable, FilterPanel, or EditableFilterPanel.
The task needs TopBar actions, row selection, primary or batch actions, column settings, or saved views.
The task needs cell renderers, remote select, tag input, number range, or locale support.

Workflow

Choose FetcherViewer for the full data-loading and view-persistence orchestrator.
Choose Viewer or View when the caller controls loading, persistence, or layout state directly.
Define field, filter, column, action, and pagination contracts before composing components.
Use registries for filter and cell customization instead of scattering one-off render logic.
Load references/api.md for prop maps, component hierarchy, filter/cell examples, and integration patterns.

Key Practices

Keep operational UI dense and predictable; avoid marketing-style layouts around viewer components.
Prefer typed cell renderers and filter components over ad hoc table render functions.
Route data-fetching hook questions to fetcher-react-hooks unless the table/viewer integration is central.

References

references/api.md: Detailed package API, examples, and edge-case guidance. Load it only when the task needs component hierarchy, package imports, FetcherViewer props, Viewer and View examples, filter system, cell components, data entry controls, locale support, and React hook integration.

Related Skills

$fetcher-react-hooks: Use for data-fetching and query state hooks.
$fetcher-wow-cqrs: Use for Wow query clients backing viewer data.
$fetcher-cosec-auth: Use when viewer data access is tenant or policy aware.

More from this repository

same repository

fetcher-cosec-auth

Ahoo-Wang/fetcher

Use when implementing CoSec authentication with Fetcher, including CoSecConfigurer, JWT token lifecycle, token storage, refresh handling, device ID storage, multi-tenant space resolution, resource attribution, authorization headers, and 401 or 403 error handling.

2026-06-0315

fetcher-decorator-service

Ahoo-Wang/fetcher

Use when creating declarative TypeScript API service classes with fetcher-decorator, including @api, HTTP method decorators, path/query/header/body/request parameters, result extractors, lifecycle hooks, inheritance, and reflect-metadata setup.

2026-05-2715

fetcher-eventbus

Ahoo-Wang/fetcher

Use when implementing typed event buses, serial or parallel event execution, BroadcastChannel or storage-based cross-tab messaging, handler priority, once handlers, name generation, or event synchronization across browser contexts.

2026-05-2715

fetcher-integration

Ahoo-Wang/fetcher

Use when setting up the core Fetcher HTTP client, NamedFetcher, fetcherRegistrar, HTTP methods, path and query parameters, interceptors, timeouts, result extractors, request lifecycle, status validation, or URL templates.

2026-05-2715

fetcher-llm-streaming

Ahoo-Wang/fetcher

Use when consuming Server-Sent Events, LLM token streams, OpenAI-style streaming chat responses, Fetcher eventstream helpers, response prototype extensions, stream termination detection, result extractors, or ReadableStream async iteration.

2026-05-2715

fetcher-openai-client

Ahoo-Wang/fetcher

Use when calling OpenAI Chat Completions through Fetcher, configuring OpenAI or ChatClient, sending streaming or non-streaming chat completion requests, adding interceptors, using completion result extractors, or handling OpenAI client errors.

2026-05-2715

name	fetcher-viewer-components
description	Use when building Fetcher Viewer React and Ant Design data table experiences, including FetcherViewer, Viewer, View, ViewTable, FilterPanel, EditableFilterPanel, view management, TopBar actions, row selection, column settings, cell renderers, and form controls.

fetcher-viewer-components

Use This Skill When

The task involves data tables, filtering, view management, or Fetcher Viewer components.
The task mentions FetcherViewer, Viewer, View, ViewTable, FilterPanel, or EditableFilterPanel.
The task needs TopBar actions, row selection, primary or batch actions, column settings, or saved views.
The task needs cell renderers, remote select, tag input, number range, or locale support.

Workflow

Choose FetcherViewer for the full data-loading and view-persistence orchestrator.
Choose Viewer or View when the caller controls loading, persistence, or layout state directly.
Define field, filter, column, action, and pagination contracts before composing components.
Use registries for filter and cell customization instead of scattering one-off render logic.
Load references/api.md for prop maps, component hierarchy, filter/cell examples, and integration patterns.

Key Practices

Keep operational UI dense and predictable; avoid marketing-style layouts around viewer components.
Prefer typed cell renderers and filter components over ad hoc table render functions.
Route data-fetching hook questions to fetcher-react-hooks unless the table/viewer integration is central.

References

references/api.md: Detailed package API, examples, and edge-case guidance. Load it only when the task needs component hierarchy, package imports, FetcherViewer props, Viewer and View examples, filter system, cell components, data entry controls, locale support, and React hook integration.

Related Skills

$fetcher-react-hooks: Use for data-fetching and query state hooks.
$fetcher-wow-cqrs: Use for Wow query clients backing viewer data.
$fetcher-cosec-auth: Use when viewer data access is tenant or policy aware.