Popup box for feedback issue #169 #335
Conversation
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
Greptile Summary
This PR implements a feedback collection system for issue #169 by adding a modal popup with a 5-star rating system and text input that appears when users click the "Run Code" button. The implementation spans three files:
Core Implementation (pages/editor.html): A modal dialog is embedded directly in the HTML with inline CSS styling and JavaScript functionality. The modal includes an interactive star rating system with hover effects and a textarea for comments. The JavaScript handles star selection, hover animations, and modal show/hide functionality.
Styling Updates (styles/challenges.css): Several color changes were made, including hardcoded color values for text elements and a new .clearFilters button class. Font sizes were also adjusted for button consistency.
Minor Change (pages/challenges.html): The Clear Filters button class was updated from btn to clear_btn for more specific CSS targeting.
The feedback system integrates with the existing CodeClip editor interface, replacing the original code execution functionality with feedback collection. When users click "Run Code," they now see a popup asking for their experience rating and optional comments. The implementation uses modern JavaScript event handling and CSS transitions for a smooth user experience.
Confidence score: 1/5
• This PR has serious issues that make it unsafe to merge and will likely break existing functionality
• The feedback modal completely replaces code execution instead of complementing it, breaking core editor functionality. Additionally, inline styles violate the codebase's CSS architecture, hardcoded colors break the theming system, and there's no data persistence or validation
• All three files need attention, but pages/editor.html requires the most work due to architectural issues and functionality replacement
3 files reviewed, 3 comments
| runCodeBtn.addEventListener("click", () => { | ||
| feedbackModal.style.display = "flex"; | ||
| }); |
There was a problem hiding this comment.
logic: Run Code button now only shows feedback modal without actually executing code. This breaks the core functionality.
|
|
||
| .challenge-card__actions { | ||
| text-align: right; | ||
| color:white |
There was a problem hiding this comment.
syntax: Missing semicolon and hardcoded color breaks theme consistency
2 participants
Issue #169 has been successfully resolved.
The problem required displaying a custom feedback form (including a 5-star rating system and a text input for comments) when a user clicked the “Run Code” button.
The fix involved implementing:
-A custom modal popup for user feedback
-An interactive 5-star rating system using JavaScript
-A feedback textarea
this involved JavaScript logic for interactivity (hover, selection, dynamic updates), @adityai0 @Shrutik-0101 please update this issue from Level 1 to Level 2 to reflect the actual scope and complexity of work completed.