fix(forum): enable topic interactions and fix footer layout#632
Conversation
Allow community replies, make replies visible, add voting system, and resolve footer overlap issues. Fixes alphaonelabs#614
WalkthroughThe forum topic template is updated to introduce a voting interface, allowing users to upvote or downvote topics. The delete button for the topic author is moved to a separate section. The JavaScript handling voting actions is revised to use the correct login URL for unauthenticated users. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant ForumTopicPage
participant Server
User->>ForumTopicPage: Loads topic page
User->>ForumTopicPage: Clicks upvote/downvote button
ForumTopicPage->>User: Checks authentication (JS)
alt Not authenticated
ForumTopicPage->>User: Redirects to login page with next=topic URL
else Authenticated
ForumTopicPage->>Server: Sends POST vote request (AJAX, CSRF)
Server-->>ForumTopicPage: Returns updated vote state/score
ForumTopicPage->>User: Updates vote UI (score, button highlights)
alt Error
ForumTopicPage->>User: Reloads page
end
end
Assessment against linked issues
Assessment against linked issues: Out-of-scope changes
Possibly related PRs
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hello @alimurtzaa, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
Summary of Changes
Hello! Gemini here, providing a summary of this pull request. This PR aims to enhance the forum functionality by enabling community interactions on topics, specifically adding a voting system and making replies visible (as per the description). It also addresses a layout issue related to the footer overlapping content. The primary changes involve modifying the topic detail template (web/templates/web/forum/topic.html) to include the voting UI, adjusting the login redirect for users attempting to interact, and ensuring these elements are visible to all users.
Highlights
- Enable Topic Voting: Implemented a voting system (upvote/downvote) directly on the topic view, allowing users to interact with the topic's content.
- Fix Login Redirect for Interactions: Corrected the redirect URL for unauthenticated users attempting interactions (like voting) from the signup page to the login page, ensuring they are sent back to the topic after logging in.
- Enable Community Interactions: Modified the template structure to ensure voting and potentially other interaction elements (like replies, mentioned in description) are visible and accessible to all users, not just the topic author.
- Resolve Footer Layout Issue: Addressed an issue where the footer was overlapping content (as mentioned in the PR description).
Changelog
- web/templates/web/forum/topic.html
- Moved the topic voting UI and content display outside of the author-only conditional block, making it visible to all users (lines 171-210).
- Implemented the visual structure for upvote/downvote buttons and the vote score display using Tailwind CSS classes and SVG icons (lines 175-209).
- Corrected the JavaScript login redirect URL from
/signupto/loginwith anextparameter pointing back to the current topic page (line 433). - Removed a conditional block (
{% endif %}) wrapping the main content and script, ensuring these elements are always rendered (lines 527-528 removed).
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist is currently in preview and may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments to provide feedback.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
Votes appear for all,
Login sends you back to view,
Forum comes alive.
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
There was a problem hiding this comment.
Code Review
This pull request aims to enhance forum topic interactions by enabling replies, making them visible, adding a voting system, and fixing footer layout issues. The changes to the login URL for interactions and the script loading are positive improvements.
However, there are a couple of significant issues in web/templates/web/forum/topic.html that need addressing: the main topic content is currently not being displayed, and the functionality for topic authors to delete their own topics appears to have been removed.
I haven't reviewed the footer layout fix as it's not present in the provided diffs for topic.html, but I trust it has been handled elsewhere.
Summary of Findings
- Missing Topic Content: The main content of the forum topic (
{{ topic.content|linebreaks }}) is no longer displayed after the changes inweb/templates/web/forum/topic.html. This is a critical issue as users cannot read the topic. - Missing Delete Topic Functionality: The functionality for a topic author to delete their own topic has been removed from
web/templates/web/forum/topic.html. This is a significant loss of functionality if unintentional. - Improved Login Redirect for Interactions: The JavaScript logic for redirecting unauthenticated users now correctly points to the login page (
account_login) instead of signup, and includes anextparameter for a better user experience. This is a good fix. - Script Loading Optimization: The removal of the
{% if user.is_authenticated %}condition around the JavaScript block is a good change, as the script itself handles authentication checks and redirection.
Merge Readiness
This pull request introduces valuable features for forum interaction. However, there are critical and high-severity issues that need to be addressed before this PR is ready for merging. Specifically, the topic content display must be restored, and the removal of the 'Delete Topic' functionality needs to be clarified and potentially reinstated.
I am unable to approve pull requests directly. Please ensure these issues are resolved and consider further review before merging.
![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
🔭 Outside diff range comments (1)
web/templates/web/forum/topic.html (1)
171-249: 💡 Verification agent🧩 Analysis chain
Voting Interface: Context & Accessibility Check
Ensure the view provides all required context variables (
user_topic_vote,topic.vote_score,topic.upvote_count,topic.downvote_count). Consider refactoring the voting UI into a reusable partial include to reduce duplication with the replies section and improve maintainability. From an accessibility standpoint:
- Wrap the vote buttons in a
role="group"and add anaria-label(e.g.aria-label="Topic Voting Controls").- Confirm that
aria-pressedtoggles correctly and that color changes are perceivable for screen readers.- Test responsive behavior to prevent layout shifts, especially on smaller viewports.
🏁 Script executed:
#!/bin/bash # Verify context variables are referenced in the codebase rg -n "user_topic_vote" . rg -n "topic.vote_score" . rg -n "upvote_count" . rg -n "downvote_count" . # Check for duplicated voting markup in other templates rg -n "vote-btn" web/templatesLength of output: 3555
Voting Interface: Refactor & Accessibility
The required context variables (
user_topic_vote,topic.vote_score,topic.upvote_count,topic.downvote_count) are already supplied in web/views.py. To improve maintainability and accessibility:
Extract common markup
• Create a partial (e.g.templates/web/forum/_vote_controls.html) and include it in both the topic and reply templates to remove duplicated<button class="vote-btn">…blocks.Add ARIA grouping
• Wrap the up/down vote buttons in a container with
role="group"and
aria-label="Topic Voting Controls"
to convey their relationship to assistive technologies.Ensure correct
aria-pressedtoggling
• In the JavaScript (around line 511), verify that each click updates thearia-pressedattribute on the button and that the change is programmatically announced.Provide non-color cues
• Since color alone (text-teal vs. text-red) isn’t perceivable to all users, consider adding visually hidden text (e.g.<span class="sr-only">Upvoted</span>) oraria-checked/aria-labelupdates.Test responsive behavior
• Review the component at small breakpoints to prevent layout shifts when the vote controls appear below or beside the content.
alimurtzaa
left a comment
alimurtzaa
left a comment
There was a problem hiding this comment.
The requested change has been addressed and the conversation is resolved.
2 participants
Allow community replies, make replies visible, add voting system, and resolve footer overlap issues.
Related issues
Fixes #614
Checklist
Summary by CodeRabbit