skills.rest
jaaroncara
jaaroncaraCOMMUNITY
Explore all skills by this author →
GitHub

add-or-edit-view

Add or edit sub-views in DatabaseConsole.tsx across four touch points.

1|Updated Apr 9, 2026
Search Tags:#react#navigation#routes#frontend-development#add-view#database-console
One-click install
npx skills add https://github.com/jaaroncara/NH-RAG-Memory-Engine --skill add-or-edit-view
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: add-or-edit-view
Source: https://github.com/jaaroncara/NH-RAG-Memory-Engine/tree/main/.claude/skills/add-or-edit-view
Command: npx skills add https://github.com/jaaroncara/NH-RAG-Memory-Engine --skill add-or-edit-view

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Adds or edits a sub-view inside the DatabaseConsole.tsx monolithic shell, ensuring new or updated views follow the established four touch points (nav item, state, routes, and the view function) without breaking the pattern.

Core Features & Use Cases

  • Create a new route-linked sub-view in DatabaseConsole.tsx or modify an existing one, consistently applying the four touch points in the correct order.
  • Update the sidebar navigation, in-file state wiring, route registrations, and the bottom-of-file view function to preserve the monolithic shell architecture.
  • Use case: quickly extend the admin UI with a new dashboard or tool that integrates with the NH-RAG Memory Engine console, while maintaining existing styling and conventions.

Quick Start

Provide a new or edited sub-view in DatabaseConsole.tsx following the four touch-point pattern described in this Skill.

Frequently Asked Questions about add-or-edit-view

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add a new sub-view to a React monolithic shell component?▼

Adding a new route-linked sub-view requires updating four touch points: the sidebar navigation, in-file state wiring, route registrations, and the view function at the bottom of the file.

What is the four touch point pattern for React frontend navigation routes?▼

The four touch points are the sidebar navigation item, in-file state management, route registration, and the view function definition, applied together to extend a monolithic React shell.

How do I edit an existing view in a DatabaseConsole component?▼

You edit an existing DatabaseConsole view by modifying its existing state, route registration, nav item, and view function while conforming to established project patterns, naming, and styling conventions.

Can I update React state and routes simultaneously when extending admin UI dashboards?▼

Yes, extending admin UI dashboards requires simultaneously updating state and routes alongside navigation items and view functions to preserve the monolithic shell architecture.

Does adding a sub-view break existing frontend development patterns in a monolithic shell?▼

Adding a sub-view does not break frontend development patterns if the new view follows the established four touch point wiring for navigation, state, routes, and view functions.

Related Skills

Explore More Software Engineering Skills→
video-production-buddyvideo-production-buddy
602

vercel-composition-patterns

Refactor React components with boolean props into compound component variants.

Official
Intermediate
MuharremTozanMuharremTozan

unity-mvc-pattern

Implement Unity UI architecture with MVC/MVP patterns separating Model, View, and Presenter.

Community
Intermediate
jhlee0409jhlee0409

create-component

Scaffold React components with TypeScript interfaces and security patterns.

Community
Basic
jidohyunjidohyun
17

component-refactoring

Refactor high-complexity React components by extracting hooks and sub-components.

Community
Intermediate