BF-015-BF-023: Standardize tool actions and JSON/JWT/HTTP flows

[baixiangcpp]

Summary:

• Standardize shared tool action ordering, disabled reasons, destructive styling, and accessible copy/download feedback.
• Separate Sample, Clear, and Reset semantics across audited tool pages, including JSON Formatter, Base64, Regex, UUID, image, and thumbnail flows.
• Add JSON Formatter download actions for formatted and minified JSON, clear stale output on invalid input, and disable stale/invalid copy/download paths.
• Improve JWT Decoder claim-level copy controls and keep decode-only/time-semantics guidance prominent.
• Clarify HTTP Request Builder as code generation only in the UI and FAQ content, with no request sending from editing or generation.
• Strengthen HMAC local-only guidance and storage guards for secret handling.

Issues:

• Closes [P1] BF-015: Standardize tool action button order, naming, disabled states, and copy feedback #124
• Closes [P1] BF-016: Separate Sample, Reset, and Clear semantics across all tools #126
• Closes [P1] BF-018: Add Download/Export action for formatted and minified JSON output #131
• Closes [P1] BF-019: Clear stale JSON Formatter output when current input is invalid #133
• Closes [P1] BF-021: Improve JWT claim copy controls and time-semantics display #138
• Closes [P1] BF-022: Clarify that HTTP Request Builder generates code and does not send requests #140
• Closes [P1] BF-023: Mask HMAC secret input and add explicit local-only secret handling guidance #142

Implementation details:

• Routing: no route changes.
• Metadata/content: added HTTP Request Builder FAQ boundary copy and localized UI strings for action disabled states, JSON download, JWT claim copy, HTTP no-send guidance, and HMAC privacy guidance.
• Storage: no new persisted tool payloads; sensitive storage guard now includes hash-generator.
• UI: shared ToolActionBar now sorts actions, exposes disabled reasons via labels/titles/sr-only text, and styles Clear/Reset as destructive. Audited tools now use the shared action bar where they previously had custom controls or ambiguous Reset/Clear semantics.
• Tests: added toolbar, JSON Formatter, JWT Decoder, HTTP Builder component tests and guard coverage for action semantics, JSON downloads, HTTP no-send behavior, and HMAC privacy.

Privacy review:

• No tool payloads are stored by default.
• No runtime input/output, uploaded file content, tokens, secrets, request bodies, or generated output are persisted.
• No new external request runs automatically.
• HTTP Request Builder remains code generation only and does not proxy or send requests.
• Analytics remains action-ID based; no sensitive data, search text, URLs, tokens, or payloads were added.
• localStorage/sessionStorage/IndexedDB/cache usage reviewed for touched sensitive flows; HMAC storage guard added.

SEO review:

• Canonical behavior unchanged.
• Sitemap behavior unchanged.
• Noindex behavior unchanged.
• Hreflang behavior unchanged.
• FAQ schema/content checks were run after adding the HTTP Request Builder FAQ.

Accessibility review:

• Disabled toolbar actions now expose accessible reason text through labels/titles and screen-reader-only text.
• Clear/Reset destructive styling is visually distinct.
• JWT claim copy buttons have accessible labels.
• HTTP no-send guidance is visible near the request controls.
• Keyboard/focus behavior uses existing button/select primitives and shared toolbar focus styles.

Tests:

• Targeted checks run:
  • npm run test -- tests/component/tool-action-bar.test.tsx tests/component/json-formatter-actions.test.tsx tests/component/jwt-decoder-actions.test.tsx tests/component/http-request-builder-page.test.tsx tests/guards/tool-action-consistency-guard.test.ts tests/guards/sensitive-storage-audit.test.ts tests/guards/jwt-security-semantics-guard.test.ts tests/guards/sensitive-input-warning-guard.test.ts tests/unit/http-request-builder-codegen.test.ts tests/unit/json-format-task.test.ts tests/unit/jwt-decoder-utils.test.ts
  • npm run lint -- src/features/tool-shell/tool-action-bar.tsx src/features/tools/json-formatter/page.tsx src/features/tools/json-formatter/json-output-toolbar.tsx src/features/tools/json-formatter/browser-actions.ts src/features/tools/jwt-decoder/page.tsx src/features/tools/http-request-builder/page.tsx src/features/tools/base64-encode-decode/page.tsx src/features/tools/regex-generator/page.tsx src/features/tools/regex-tester/page.tsx src/features/tools/uuid-generator/page.tsx src/features/tools/image-resizer/page.tsx src/features/tools/youtube-thumbnail-grabber/page.tsx src/features/tools/vimeo-thumbnail-grabber/page.tsx tests/component/tool-action-bar.test.tsx tests/component/json-formatter-actions.test.tsx tests/component/jwt-decoder-actions.test.tsx tests/component/http-request-builder-page.test.tsx tests/guards/tool-action-consistency-guard.test.ts tests/guards/sensitive-storage-audit.test.ts
  • npm run lint -- tests/unit/http-request-builder-codegen.test.ts
  • npm run check:i18n
  • npm run check:types
  • npm run check:content-template && npm run check:faq-schema
• Batch-level checks run:
  • npm run build
• Full CI:
  • Not run separately beyond this PR's remote checks to avoid repeated CI. Local npm run build passed once for the batch before PR creation.

[cloudflare-workers-and-pages]

Deploying byteflow with    Cloudflare Pages

Latest commit:	a633463
Status:	✅  Deploy successful!
Preview URL:	https://2ad1d0e9.byteflow-c58.pages.dev
Branch Preview URL:	https://codex-bf-p1-tool-actions-jso.byteflow-c58.pages.dev

View logs