fix(help): remove broken attachment control from Log Issue (#103)#132
Conversation
The Capture/Upload screenshot UI in Help -> Log New Issue was structurally non-functional. The submit handler opens GitHub's web issue page via ?title=...&body=... URL params (or a mailto: link in the email fallback). Neither URL params nor mailto: can carry binary attachments. The Upload path read the file into React state and dropped it on submit (no clipboard write, nothing). The Capture path attempted a clipboard write via SVG foreignObject -> canvas, but cross-origin stylesheets/fonts fail to inline in production WebViews so the render was unreliable, and the dialog never told the user that paste was required on the GitHub page. Replaced the capture/upload column with a static "Attach an image?" callout that tells the user to drag-and-drop (or paste) into the GitHub page after it opens. Updated the post-submit confirmation screen to repeat the instruction so the next step is explicit. No new deps, no new IPC commands, no new permissions. Binary-upload via Tauri-side multipart to GitHub (PAT-authed) is a follow-up. Also rolls forward package-lock.json version drift to match package.json (1.0.19) after a clean npm install.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Rate limit exceeded
You’ve run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
📝 WalkthroughWalkthroughThe pull request removes the unreliable screenshot capture and upload control from the Help dialog's issue reporter and replaces it with static instructions guiding users to drag-and-drop or paste images directly into GitHub after the issue page opens. The changelog is updated accordingly. ChangesScreenshot Capture Removal and Drag-and-Drop Guidance
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/components/help/HelpDialog.tsx`:
- Around line 273-281: The instructional text in HelpDialog.tsx is using a
<label> (Attach an image?) which implies form semantics; replace that element
with a non-form semantic element such as a <p> or <div> (or <div role="note">
for extra accessibility) and remove any label-specific attributes so it no
longer associates with form controls; update the element rendering around the
Paperclip and guidance paragraph in the HelpDialog component to use the new
non-form element while preserving the existing classes and visual styling.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 4a791c68-d133-4c5c-bf31-be2855dacffc
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (2)
CHANGELOG.mdsrc/components/help/HelpDialog.tsx
# Conflicts: # CHANGELOG.md
It is instructional text, not a form-control label, so <label> can confuse assistive tech. Surfaced by CodeRabbit review on PR #132.
1 participant
Closes #103.
Root cause
The "Capture" / "Upload" screenshot UI in Help → Log New Issue was structurally non-functional. The submit handler opens GitHub's web issue page via
?title=...&body=...URL params (or amailto:link in the email-fallback flow), and neither URL params normailto:can carry binary attachments. The Upload path read the image into local React state and then dropped it on submit (no clipboard write, nothing). The Capture path did attempt anavigator.clipboard.write([ClipboardItem])after rendering the DOM through an SVGforeignObject→ canvas, but a) cross-origin stylesheets/fonts fail to inline in production WebViews (so the render was unreliable to begin with), and b) the dialog never told the user that paste-on-the-GitHub-page was the actual required next step. Reporter on Windows + WebView2 + v1.0.18 saw exactly this: clicked Upload, picked an image, hit Create Issue, image gone.Fix
Removed the capture/upload controls and the
screenshot/isCapturingstate. Replaced the column with a static "Attach an image?" callout that tells the user to drag-and-drop (or paste) into the GitHub page after it opens, and updated the post-submit confirmation screen to repeat the same instruction so the next step is explicit. Branched copy for the email fallback path so the instruction matches the destination (mailto opens an email client; "paste into the GitHub page" wouldn't apply).No new dependencies, no new Tauri IPC commands, no new permissions. A real binary-attachment path (Tauri-side multipart upload to GitHub via PAT, or a paste host) is much bigger scope and would warrant its own issue.
Also includes a
package-lock.jsonversion sync (1.0.13 → 1.0.19) that npm produced on a clean install — the lockfile was stale relative topackage.json.Test plan
npx tsc --noEmit— cleannpm test— 129/129 passtitle/body/labelsquery params, email fallback opensmailto:with the plaintext body. Confirmation screen shows "drag-and-drop or paste into the GitHub issue page" copy after submit.fileInputRef/Camera/Image/Trash2/Loader2icons.Summary by CodeRabbit
Bug Fixes
Improvements