← all publishers

nicksonthc

@nicksonthc source repo

9 published skills

  1. Harvest Skill · nicksonthc
    Harvest a feature from the current repo into a reusable Claude Code skill, saved to the claude-skill sync repo and symlinked globally so it replicates to any other project. Use when the user says "save this as a skill", "harvest this", "make a skill from this feature", "extract this to a skill", "add this to my skill repo", or wants a good pattern/feature from the codebase made replicable across repos.
    0 installs
  2. Network Diagram · nicksonthc bundle
    Render a printable engineering-blueprint network topology diagram as a single self-contained HTML file (1920x1080, warm-paper palette, orthogonal flows, themeable accent). Use when the user asks for a network diagram, network topology, infrastructure or architecture drawing, logical network design, rack/zone layout, or a "blueprint"-style systems diagram — or mentions network-diagram, topology.html, or wants an existing network diagram revised.
    0 installs
  3. R3f Hero Camera · nicksonthc bundle
    Cinematic camera rig for a React Three Fiber scene, built on drei CameraControls — a reusable shot vocabulary (overview, 3/4 object framing, screen punch-in, first-person standpoint, chase engage), a stutter-free follow cam, an idle attract orbit that breaks on user input, perspective↔orthographic mode switching, and a writer-priority ladder so competing camera drivers never fight. Use when adding camera fly-to / framing on selection, a follow or chase camera for a moving object, cinematic tour or demo beats, a "focus on X" button, an idle attract loop, or a top-down ortho editor view to a three.js / R3F project.
    0 installs
  4. Guided Placement · nicksonthc bundle
    Guided Placement
    0 installs
  5. Interactive 3d Object · nicksonthc bundle
    AAA hover/select feedback for interactive objects in a React Three Fiber scene — a design-token file so the whole feel is coherent and tunable from one place, a status→color language, a geometry-agnostic ObjectFX overlay (soft hover ring, breathing status-tinted select ring, click ripple, additive glow halo, select particle burst, floating label), a delayed hover tooltip that stays glued to moving objects, and action-preview telegraphing for HUD buttons. Use when making 3D objects hoverable/clickable, adding selection rings, glow or highlight effects, status color coding, object labels or tooltips, or "show what this button will do" previews in a three.js / R3F project.
    0 installs
  6. System Status Popover · nicksonthc bundle
    Honest system-status indicator for a SPA + API app — a small beating status dot in the shell that opens a popover detailing backend health (endpoint, real upstream, DB, environment, version + commit, build time, latency, last check), realtime Socket.IO state (connected, transport, socket id), and frontend build provenance, backed by a /health endpoint and a git-SHA/build-time pipeline through Docker build args. Use when asked to show the backend / socket.io version and status in the frontend, add a health or connection indicator, display build info / app version in the UI, add an honest "Live" badge, or wire version + commit from git through Docker into both backend and frontend.
    0 installs
  7. Keyboard First Hotkeys · nicksonthc bundle
    Keyboard-first interaction system for a kiosk / scan-gun / operator-terminal React app — one hotkey catalogue that drives the bindings, the key-cap hints on buttons, and the cheatsheet dialog so they can never drift; a focus chain that always keeps focus on "the next thing the operator will touch"; and a focus guard that recovers focus when re-renders drop it. Use when adding keyboard shortcuts / hotkeys to a React app, building a scan-gun or barcode-scanner driven UI, a kiosk where the workflow is Enter-to-advance, a shortcuts cheatsheet ("press ? to see shortcuts"), or when focus keeps getting lost after re-renders / socket updates and scans go nowhere.
    0 installs
  8. Socketio Realtime Hooks · nicksonthc bundle
    React hook suite for a Socket.IO realtime feed — one authenticated app-wide connection in a context provider, useSocketEvent (listeners that never rebind), useSocketRoom (auto re-join after reconnect), an echo-suppression contract so a tab is never told to re-fetch its own change (X-Client-Id header ↔ skip_sid), live presence (who is at which station/terminal), and the "socket is the fast path, a slow poll self-heals" composition. Use when adding Socket.IO / websocket realtime updates to a React app, live data that should push instead of poll, room-scoped subscriptions, "other users see changes instantly", duplicate refreshes after a user's own mutation, or presence / who's-online rosters.
    0 installs
  9. Toast Notification History · nicksonthc bundle
    Toasts with an audit trail for a React app — a drop-in wrapper around sonner's toast that also records every notification into a capped, localStorage-backed history, stamps on WHO did it (the signed-in user) automatically, and shows the log in a floating-bell slide-over panel with an unread badge. Use when adding a notification center / notification history / bell icon to a React app, when toasts disappear before anyone reads them ("what did that error say?"), when a shared kiosk or multi-operator terminal needs actions attributed to a person, or when wiring toast notifications that must also be reviewable later.
    0 installs