Fix: Manage bug page and redesign UI/UX of manage bug hunt page #4573
Conversation
WalkthroughConverted Django MIDDLEWARE to a list. Major rewrite of hunt controller JS into an IIFE with validation, image previews, prize CRUD, and publish flow. Overhauled bughunt add/edit/manage templates and organization dashboard templates. Updated company views for domain normalization, date parsing, and hunt annotations. Expanded issue view domain resolution and error handling. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
participant U as User
participant T as Add/Edit Bughunt Template
participant JS as hunt_controller.js
participant S as Server (Django)
U->>T: Load page
T->>JS: Initialize event listeners (IIFE)
U->>JS: Add Prize (form submit)
JS->>JS: Validate inputs, build prize_data
JS-->>T: Render prize card in list
U->>JS: Publish / Save as Draft
JS->>JS: Validate form, ensure prizes
JS->>T: Inject hidden inputs (prizes JSON, publish flag)
T->>S: POST add_bughunt
S->>S: Parse dates (MM/DD/YYYY) or return error
S-->>T: Response (success/error)
T-->>U: Navigate or show errors
sequenceDiagram
autonumber
participant U as Reporter
participant V as IssueView (POST)
participant D as Domain Model/DB
U->>V: Submit bug with URL
V->>V: Try parse/validate URL
alt Parse fails
V->>D: Lookup domain by variants (exact, no-www, netloc, icontains)
alt Found
V->>V: Proceed with bug creation
else Not found
V-->>U: Show error / prompt to add domain
end
else Parse OK
V->>D: Lookup or create Domain
V->>V: Create bug and continue
end
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Pre-merge checks and finishing touches❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
✨ 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 |
There was a problem hiding this comment.
Actionable comments posted: 7
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
website/templates/organization/dashboard/add_domain.html (1)
216-246: Do not remove the notification opt-in controlsCommenting out this block removes the only UI that lets org admins decide whether to get bug report / bug closed emails when creating a domain. With the inputs gone, the POST payload will never include
comments/candidates, so the backend will interpret both as false—new domains can no longer enable notifications at all.Reinstate these controls (or surface equivalent toggles elsewhere) so the form still submits the expected flags.
🧹 Nitpick comments (1)
website/templates/organization/dashboard/organization_manage_bugs.html (1)
49-104: Wrap the table for small-screen overflowOn phone-width viewports the five-column table overflows the card without horizontal scrolling, forcing the entire page to scroll sideways. A simple
overflow-x-autowrapper keeps the layout responsive.Here’s a diff to contain the table and establish a sensible minimum width:
- <table class="w-full"> + <div class="overflow-x-auto"> + <table class="w-full min-w-[640px]"> @@ - </table> + </table> + </div>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Knowledge base: Disabled due to Reviews -> Disable Knowledge Base setting
📒 Files selected for processing (11)
blt/settings.py(2 hunks)website/static/organization/js/hunt_controller.js(2 hunks)website/templates/organization/bughunt/add_bughunt.html(1 hunks)website/templates/organization/bughunt/edit_bughunt.html(1 hunks)website/templates/organization/bughunt/organization_manage_bughunts.html(1 hunks)website/templates/organization/dashboard/add_domain.html(4 hunks)website/templates/organization/dashboard/edit_domain.html(1 hunks)website/templates/organization/dashboard/organization_manage_bugs.html(1 hunks)website/templates/organization/dashboard/organization_manage_domains.html(2 hunks)website/views/company.py(3 hunks)website/views/issue.py(2 hunks)
🧰 Additional context used
🪛 Ruff (0.13.1)
website/views/issue.py
869-869: Do not catch blind exception: Exception
(BLE001)
874-874: Use explicit conversion flag
Replace with conversion flag
(RUF010)
909-909: Do not catch blind exception: Exception
(BLE001)
910-910: Use logging.exception instead of logging.error
Replace with exception
(TRY400)
910-910: Use explicit conversion flag
Replace with conversion flag
(RUF010)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Run Tests
- GitHub Check: docker-test
website/templates/organization/bughunt/organization_manage_bughunts.html
Show resolved
Hide resolved
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (1)
website/views/company.py (1)
754-762: Domain name capitalization issue persistsThis segment still destroys user-provided capitalization when the name matches the hostname. For example, "Acme-Corp.com" will be lowercased to "acme-corp.com" because the comparison is case-insensitive but the assignment uses the lowercase
normalized_domain.The past review suggested comparing in a case-insensitive way but only normalizing when an exact (case-insensitive) match is found, while preserving the user's original capitalization otherwise. The current fix still forces lowercase when names match the hostname.
Reference: Previous review comment on lines 754-762.
🧹 Nitpick comments (2)
website/templates/organization/bughunt/add_bughunt.html (1)
99-127: Consider date picker for better UXThe date inputs now require manual entry in MM/DD/YYYY format rather than using a date picker widget. While this aligns with the server-side parsing, it's less user-friendly and more error-prone. Users may enter dates in different formats (DD/MM/YYYY, YYYY-MM-DD, etc.), leading to validation errors.
Consider reintroducing a date picker widget (like Flatpickr or native HTML5 date input with format conversion) to improve user experience and reduce input errors. The server-side validation with the descriptive error message provides a safety net, but preventing the error in the first place would be better.
website/static/organization/js/hunt_controller.js (1)
233-234: Remove duplicate commentLines 233-234 contain the same comment twice: "Remove from array (mutate in place to keep window.prize_array in sync)". This is just a minor code quality issue.
Apply this diff to remove the duplicate:
- // Remove from array (mutate in place to keep window.prize_array in sync) - // Remove from array (mutate in place to keep window.prize_array in sync) const idx = prize_array.findIndex(prize => prize.id === prize_id);
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Knowledge base: Disabled due to Reviews -> Disable Knowledge Base setting
📒 Files selected for processing (4)
website/static/organization/js/hunt_controller.js(2 hunks)website/templates/organization/bughunt/add_bughunt.html(1 hunks)website/templates/organization/dashboard/organization_manage_bugs.html(1 hunks)website/views/company.py(3 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Run Tests
- GitHub Check: docker-test
🔇 Additional comments (9)
website/views/company.py (2)
1588-1598: LGTM - Date parsing with clear error handlingThe MM/DD/YYYY parsing with conversion to database format is well-implemented. The descriptive error message helps users understand the expected format. Note that times are hardcoded to 00:00, which appears intentional given the form design.
1689-1707: LGTM - Hunt query enrichmentThe addition of
total_prizeannotation and expanded field selection provides the necessary data for the redesigned UI. The query structure is sound.website/templates/organization/dashboard/organization_manage_bugs.html (2)
76-80: Status badge issue resolvedThe past review concern about collapsing all non-open statuses into "Closed" has been properly addressed. The template now uses
{{ issue.get_status_display }}to show the correct status label for each issue state.
19-134: Well-structured UI redesignThe redesigned manage bugs page features:
- Clear header section with page title and primary action button
- Responsive table layout with appropriate columns (Description, Created, Type, Status, Action)
- Hover states and visual feedback for better UX
- Thoughtful empty state with clear call-to-action
The implementation aligns well with the PR's objective to redesign the UI/UX of the manage bug page.
website/templates/organization/bughunt/add_bughunt.html (2)
136-256: LGTM - Asset management with previewsThe asset upload section provides a good user experience with:
- Live image previews for both logo and banner
- Clear visual feedback and hover states
- Remove functionality with confirmation
- Proper error message containers for validation feedback
- Delegated to centralized
hunt_controller.jsfunctionsThe implementation is clean and aligns with modern file upload UX patterns.
367-382: Past issue resolved - proper delegation to hunt_controller.jsThe inline script correctly delegates image preview functions to the shared
hunt_controller.jsrather than duplicating them. TheorganizationIdexposure is necessary for prize CRUD operations. This addresses the past review concern about overriding shared preview helpers.website/static/organization/js/hunt_controller.js (3)
451-454: Past issue resolved - handler assignment via closureThe prize ID quoting issue from the past review has been properly addressed. The handler now uses a function closure (
addPrizeButton.onclick = function() { updatePrize(prizeId, organizationId); }) instead of string interpolation, which correctly preserves theprizeIdstring argument and avoidsReferenceError.
509-517: Past issue resolved - complete state restorationThe button state restoration issue from the past review has been properly addressed. The code now:
- Uses programmatic handler assignment (
addPrizeButton.onclick = add_prize)- Restores
number_of_winning_projectsvisibility and enabled state (lines 510-511)- Completely resets the form to the default add-prize workflow
This ensures the form works correctly after editing prizes.
1-117: Excellent error handling and validationThe rewrite into an IIFE with comprehensive error handling is a significant improvement:
- Defensive element lookups with clear error messages
- Input validation for all required fields
- Proper type conversions for numeric values
- XSS protection via
escapeHTMLutility- Clear user feedback via alerts
The code demonstrates good defensive programming practices and should be more robust in production.
fixes #4572
Description:
This PR addresses critical domain validation issues and provides a complete redesign of manage bug page and manage bug bounties with consistent, clean table layouts.
Manage bug page:
Manage bug bounties page
Summary by CodeRabbit