Commit Graph
4 Commits
Author SHA1 Message Date
s0lrayandPaperclip 7412c6ab19 Add Phase 3 community voting and issue reporting (THE-109, THE-110)
Backend (src/worker.js):
- Add POST /api/vote: upvote/downvote with toggle behavior, one vote per
  session per tool, returns net score
- Add POST /api/report: flag tools as dead_link/paywalled/incorrect_info;
  auto-creates GitHub issue via GitHub API when REPORT_THRESHOLD (3) unique
  reports of the same type are received (requires GITHUB_TOKEN secret)
- Update GET /api/tool-stats to include votes { up, down, score }
- Extract validateCommon() and isRateLimited() helpers to reduce duplication

Frontend (public/js/arf.js):
- Replace static rating placeholder with _renderVoteUI(): renders thumbs
  up/down buttons, reads cached vote from sessionStorage, fetches live score
  async from /api/tool-stats
- Add _castVote(): fires POST /api/vote, updates button active state and
  score display, persists user vote in sessionStorage
- Add _resetReportButtons() and _submitReport(): wire report buttons per
  panel open, POST /api/report, show inline feedback message

HTML (public/index.html):
- Replace static rating span with vote row (thumbs up, score, thumbs down)
- Replace static GitHub report link with three report buttons + feedback div

CSS (public/css/panel.css):
- Add .vote-btn, .vote-score (.positive/.negative/.zero) styles
- Add .report-btn, .panel-report-feedback styles
- Remove old #panel-report-link styles (replaced by button row)

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-03-26 00:56:24 -04:00
s0lrayandPaperclip 8c5ab92c88 Fix mobile panel to full-screen overlay per board (THE-104)
Board confirmed: mobile panel should be full-screen overlay with X button,
not a bottom sheet. Simplified @media breakpoint to 100vw/100vh with no
border-radius and inherited slide-right animation from desktop.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-03-25 23:07:07 -04:00
s0lrayandPaperclip 9600931365 Add enrichment badge rendering and panel data fields (THE-107)
- Status (live/down/degraded/unknown) and pricing (free/freemium/paid/unknown)
  pill badges always shown in panel badges row with semantic colors
- OPSEC section now renders colored badge (passive/active/unknown) + opsecNote text
- Description section always visible; shows italic placeholder when no data
- Usage context renders bestFor and input→output mapping; hidden when all empty
- CTA button label now shows "Open [Tool Name] ↗" with actual tool name
- Added badge pill CSS (.badge-live, .badge-down, etc.) to panel.css
- Seeded Shodan (Discovery subcategory) with all new enrichment fields as demo

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-03-25 23:05:55 -04:00
s0lrayandPaperclip 0e7fdcfdbf Add tool details panel UI and D3 wiring (THE-104, THE-105)
THE-104: Build panel UI component
- New public/css/panel.css using existing design tokens
- Fixed-position slide-in panel (340px desktop, 100vw bottom-sheet on mobile)
- 250ms GPU-accelerated translateX() slide animation with will-change
- All section placeholders: header, breadcrumb, badges, description, usage,
  OPSEC, rating, report link, CTA button
- Dark mode via body.light-mode CSS variable overrides
- Graceful empty states (sections hidden via .empty class)

THE-105: Wire panel to D3 tree interactions
- Leaf-node clicks (nodes with url, no children) open panel instead of navigating
- parseName() for clean title + badge rendering
- Breadcrumb built by walking parent chain to root
- Selected-node ring via _panelSelected flag + stroke style in nodeUpdate
- Close triggers: ✕ button, Escape key, overlay click, canvas click, same-node re-click
- Clicking another leaf swaps panel content in-place
- Session hash via crypto.randomUUID() stored in sessionStorage

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-03-25 23:00:21 -04:00