add-feature

A coding guide for adding new screens and UI features to the nvcf-ui app. It covers feature folders, routes, data loading, lazy loading, tests, and a completion checklist.

In plain words
What is it for?
Use it when creating a new feature folder, page, view, route, or data-backed screen, or when deciding whether to extend an existing feature.
Why use it?
It gives developers project-specific rules for deciding where new code belongs and how it should connect to the app. This helps avoid incorrect routing, misplaced files, and edits to generated code.

Skill for Claude CodeCodex

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/nvidia/nvcf/add-feature
Any agent
npx skills add NVIDIA/nvcf --skill add-feature
Clone the repo
git clone --depth 1 https://github.com/NVIDIA/nvcf

Made for: Claude Code, Codex.

Per session 93 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 1,561 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.00093 $0.01561
Opus 5 $0.00046 $0.00781
Sonnet 5 $0.00019 $0.00312
Haiku 4.5 $0.00009 $0.00156

Measured 2d ago against content hash 81eb978401d9, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

add-feature scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

src/uis/nvcf-ui/.claude/skills/add-feature/SKILL.md · 135 lines

How it starts

The opening of the file, as written. The whole thing — 135 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Adding a UI Feature

For all component selection, layout decisions, and styling — invoke the kaizen-ui skill.

Gotchas

  • This project uses code-based routing, not file-based. Do not use createFileRoute or the TanStack Router Vite plugin — use createRoute and createLazyRoute.
  • View components are named by view type (e.g. WidgetsList, WidgetDetail), never with a Page suffix.
  • router.tsx is pure composition — it only imports and wires route trees. Do not put route definitions or loaders in router.tsx.
  • rootRoute.tsx is separate from router.tsx to avoid circular imports. Layout routes that span multiple features live at src/ root, not in a feature folder.
  • Generated hooks, schemas, and mocks live in ui/src/generated/ — never edit these files. If the endpoint you need doesn't have generated hooks, update the appropriate spec in spec/ (control-plane-openapi.yaml, nvcf-openapi.yaml, or sis-openapi.yaml) then run task generate.
  • All source files need Apache 2.0 license headers. Run task license:add before committing.

When to Create a New Feature Folder

  • New domain (new data, new concepts, new API surface) → new feature folder
  • Composition of existing domains (e.g. a home page assembling widgets) → new thin feature folder
  • Extension of an existing domain (e.g. a "Create Function" page) → new route/component in the existing feature folder

Feature Folder Structure

A feature is a domain boundary, not a route. Each feature is self-contained under ui/src/features/<name>/:

features/<name>/
├── components/         # Smaller building blocks (badges, cards)
├── hooks/              # Feature-scoped hooks
├── types/              # Feature-scoped types
├── routes.tsx          # Route definitions, loaders, search validation (optional)
├── <View>.tsx          # Route-level view components (PascalCase, named by view type)
└── utils.ts            # Feature-scoped helpers (when needed)
  • Not every subfolder is required — add components/, hooks/, types/ only when needed
  • A feature may not have routes at all — it may only export hooks and components for other features
  • Helpers go inline in the component file by default. Extract to a feature-root file only when shared across multiple files in the same feature

Read the full file on GitHub · 135 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 2d ago First seen · 135 lines · 93 tokens per session scan A 81eb978401d9

Subscribe to this mod's changes

add-feature is a skill published in the GitHub repository NVIDIA/nvcf (202 stars, last pushed 2d ago), licensed Apache-2.0. It adds 93 tokens to every session and 1,561 once invoked, about $0.0005 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

vmware-privateai

Use this skill whenever the user needs the GPU / AI-infrastructure layer of VMware Private AI Foundation with NVIDIA (PAIF-N) on vSphere 9.x / VCF 9.1: inventory GPU hosts and physical GPU devices, see which VMs consume a vGPU and the profile each holds, read real-time GPU utilization, list the vGPU and DirectPath…

vmware-skills/VMware-PrivateAI · 237 tokens

kubernetes-mesh-provisioner

Kubernetes Mesh Provisioner atomic skill. Stands up an RKE2 cluster (server + agents) with Cilium CNI and the NVIDIA GPU device plugin, the Kubernetes parallel of swarm-mesh-provisioner. Idempotent — re-runnable.

Knuckles-Team/container-manager-mcp · 60 tokens

accelerated-computing-cudf

Official NVIDIA-authored guidance for NVIDIA cuDF GPU DataFrames, pandas acceleration, dask-cuDF, ETL, joins, groupby, CSV/Parquet I/O, nullable semantics, and multi-GPU DataFrame workloads.

PracticalSwan/agent-skills · 56 tokens

llm-torch-profiler-analysis

Unified LLM torch-profiler triage skill for sglang, vllm, TensorRT-LLM, and TokenSpeed. Use it to inspect an existing trace.json(.gz) or profile directory, or to drive live profiling against a running server when supported and return one three-table report with kernel, overlap-opportunity, and fuse-pattern tables.

sgl-project/sglang · 84 tokens

cookbook-review-pr

Review a pull request against the SGLang Cookbook (docs/, Mintlify) contribution checklist — the config-driven format (per-model config + benchmarks JSX consumed by the shared deployment.jsx / playground.jsx engines). Run with /cookbook-review-pr .

sgl-project/sglang · 60 tokens

speculative-naming

Naming conventions for SGLang speculative decoding identifiers. Use when adding, renaming, or reviewing identifiers in speculative decoding code — anything under python/sglang/srt/speculative/, related attention backends, scheduler accumulators, IPC fields, observability metrics, or CLI flags.

sgl-project/sglang · 63 tokens