feat(sirsoft-admin_basic): OneTimeSecretPanel + StatCardGrid composite components#27
Open
Tuwasduliebst wants to merge 1 commit into
Conversation
…e components Two new composite components for layouts that need them: OneTimeSecretPanel "Shown once, capture now" UX for plaintext secrets. The secret is hidden behind an explicit "Reveal" click (so it doesn't sit on screen waiting to be shoulder-surfed), copyable to clipboard via navigator.clipboard with a textarea fallback for non-HTTPS contexts, and the panel collapses on acknowledgement so the value disappears from the DOM. Used by gb7-restapi (https://github.com/Tuwasduliebst/gb7-restapi) in admin_gb7_keys_form.json's success-screen panel and the parallel admin_gb7_webhooks_form.json. Generic enough for any module that mints API keys / signing secrets / one-time access tokens. Props: value, title, warning, copyButtonLabel, revealButtonLabel, acknowledgeLabel, afterAcknowledge ({redirect|dispatch}), initiallyHidden (defaults true). StatCardGrid Responsive grid wrapper around the existing StatCard component. Lets layouts express dashboard headers declaratively (an array of StatCard props + a column count + responsive breakpoints) rather than hand-rolling the Tailwind grid + iteration boilerplate every time. Used by gb7-restapi's admin_gb7_request_logs_index.json for the 4-up Total / 2xx / 4xx / 429 dashboard. The same pattern fits any admin landing page that summarises domain stats. Props: stats (StatCardProps[]), columns, gap, responsiveColumns ({sm, md, lg, xl}). Both components follow the existing composite patterns: - Pure React + Tailwind, no external state - Translation via window.G7Core.t() with sensible English defaults - Defensive against undefined data while the layout engine loads - components.json manifest entries with full JSDoc-style props No breaking changes — purely additive.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds two new composite components to
sirsoft-admin_basicthat JSON layouts can reference declaratively.OneTimeSecretPanel"Shown once, capture now" UX for plaintext secrets — the standard pattern for surfaces like API keys, webhook signing secrets, one-time access tokens. The component:
navigator.clipboardwith a<textarea> + execCommandfallback for non-HTTPS dev contextsafterAcknowledge: { redirect | dispatch }for post-capture navigationStatCardGridResponsive grid wrapper around the existing
StatCardcomponent. Lets layouts express dashboard headers as a declarativestats[]array + column count + responsive breakpoints, instead of hand-rolling the Tailwind grid + iteration boilerplate per layout.Why
These were originally built for
gb7-restapi's admin UI:OneTimeSecretPanelis referenced byadmin_gb7_keys_form.json's success screen (showing the plaintext API key exactly once after issuance) and the paralleladmin_gb7_webhooks_form.json(webhook signing secret, same UX).StatCardGridis referenced byadmin_gb7_request_logs_index.json's 4-up dashboard header (Total / 2xx / 4xx / 429 traffic stats).Both are generic enough to belong in core
sirsoft-admin_basic— any module that mints secrets or summarises domain stats can reuse them without re-implementing the UX. Without these in core, layouts referencing them render broken on a fresh G7 install (the JSON contract is correct but the components.json registry doesn't know about them).Conventions followed
window.G7Core.t()with sensible English defaults (so missing translations degrade gracefully)undefineddata while the layout engine loads (don't crash, render empty)components.jsonmanifest entries with full prop documentation (matches theStatCard/CardGridpattern)dist/regen happens via the standardnpm run buildfromtemplates/_bundled/sirsoft-admin_basic/— no special build stepCompatibility
Purely additive. No changes to existing components, no API breakage, no schema changes.
Test plan
npm run buildfromtemplates/_bundled/sirsoft-admin_basic/producesdist/without TypeScript errorsvalue="test-secret"in a sample layout — Reveal → Copy → Acknowledge sequence worksadmin_user_list.jsonetc.) continue to render unchanged🤖 Generated with Claude Code