usamamuneerchaudhary/commentify 3.0

v3.0

on GitHub

🎉 Major Features Added

1. Comment Sorting System

• Multiple sorting options: Users can now sort comments by:
  • Newest first (default)
  • Oldest first
  • Most liked
  • Most replied
• Configurable default sort: Set default sorting behavior via config/commentify.php
• Toggle sorting UI: Enable/disable sorting dropdown via enable_sorting config option
• Automatic pagination reset: Page resets to 1 when sort order changes
• Database optimizations: Efficient queries using Eloquent scopes (mostLiked(), mostReplied())

2. Comment Reporting System

• User-friendly reporting: Users can report inappropriate comments with predefined reasons
• Predefined report reasons: Configurable reasons including:
  • Spam
  • Inappropriate content
  • Offensive content
  • Other (with additional details field)
• Duplicate prevention: Each user can only report a comment once (prevents abuse)
• Guest reporting support: Guests can report comments using IP address tracking
• Report management: Full Filament admin integration for managing reports
• Report status tracking: Reports can be marked as pending, reviewed, or dismissed
• Configurable: Enable/disable reporting via enable_reporting config option

3. Emoji Picker Integration

• Rich emoji support: Modern emoji picker for enhanced commenting experience
• Theme-aware: Automatically adapts to light/dark mode
• Framework support: Works seamlessly with both Tailwind CSS and Bootstrap 5
• Easy insertion: Click emoji to insert at cursor position
• Configurable: Enable/disable via enable_emoji_picker config option
• CDN-based: Uses emoji-picker-element for lightweight integration

4. Theme System (Dark/Light/Auto Mode)

• Three theme modes:
  • light: Always use light theme
  • dark: Always use dark theme
  • auto: Automatically detect system preference (default)
• System preference detection: Uses prefers-color-scheme media query for auto mode
• Framework-specific implementation:
  • Tailwind CSS: Uses .dark class with dark: utilities
  • Bootstrap 5: Uses data-bs-theme="dark" attribute
• Complete dark mode support: All components styled for dark mode including:
  • Comment cards
  • Forms and inputs
  • Dropdowns and menus
  • Buttons and links
  • Emoji picker
  • Alerts and notifications
• Configurable: Set theme mode via theme config option

5. Bootstrap 5 Support

• Dual framework support: Choose between Tailwind CSS or Bootstrap 5
• Separate view directories: Framework-specific views in resources/views/tailwind/ and resources/views/bootstrap/
• Dynamic view loading: Views automatically load based on css_framework config option
• Complete Bootstrap implementation: All components recreated with Bootstrap 5:
  • Cards for comments
  • Form controls and inputs
  • Dropdown menus
  • Buttons and badges
  • Alerts and modals
  • Pagination
• Bootstrap dark mode: Full support for Bootstrap 5's native dark mode
• Publishable views: Separate publish tags for Tailwind and Bootstrap views
• Configurable: Switch frameworks via css_framework config option ('tailwind' or 'bootstrap')

6. Filament Admin Panel Integration

• Comment Resource: Full CRUD interface for managing comments
  • View all comments with pagination
  • See comment details (body, user, likes count, created date)
  • Edit and delete comments
  • Filter and search functionality
• Replies Relation Manager: View and manage nested comment replies
  • See all replies for a specific comment
  • Edit reply content
  • View reply metadata
• Reports Relation Manager: Comprehensive report management
  • View all reports with status badges
  • Filter by status (pending, reviewed, dismissed)
  • Mark reports as reviewed or dismissed
  • Bulk actions for multiple reports
  • View reporter information (user or guest)
  • Track review history (reviewed by, reviewed at)
• Settings Page: Centralized configuration management
  • Manage all Commentify settings from Filament
  • Change CSS framework on the fly
  • Configure sorting, reporting, and other options
  • Real-time config updates
• Filament 4 compatibility: Fully updated for Filament v4 syntax and features
• Framework-independent: Filament views work with both Tailwind and Bootstrap

7. Notifications System

• Multiple notification channels:
  • Database notifications (stored in database)
  • Email notifications (via Laravel Mail)
  • Broadcast notifications (real-time via Laravel Broadcasting)
• Event-driven: Notifications triggered by comment events:
  • New comment posted
  • Comment replied to
  • Comment liked
  • Comment reported
• Configurable channels: Choose which channels to use via notification_channels config
• Easy setup: Comprehensive setup guide in NOTIFICATIONS_SETUP.md
• Extensible: Easy to add custom notification channels

8. Performance Optimizations

• N+1 query prevention: Eager loading for comment relationships
  • Optimized likes relationship loading
  • Eager loading for children and user relationships
  • Collection-based checks when relationships are already loaded
• Efficient sorting queries: Database-level sorting using Eloquent scopes
• Optimized like checking: Uses collection methods when relationships are loaded

🔧 Configuration Options Added

New Config Options:

• css_framework: Choose between 'tailwind' or 'bootstrap' (default: 'tailwind')
• default_sort: Set default comment sort order (default: 'newest')
• enable_sorting: Enable/disable sorting dropdown (default: true)
• enable_reporting: Enable/disable comment reporting (default: true)
• report_reasons: Array of predefined report reasons (default: ['spam', 'inappropriate', 'offensive', 'other'])
• theme: Theme mode - 'light', 'dark', or 'auto' (default: 'auto')
• enable_emoji_picker: Enable/disable emoji picker (default: true)
• enable_notifications: Enable/disable notifications (default: false)
• notification_channels: Array of notification channels (default: ['database'])

📦 New Database Tables

comment_reports Table

• Stores user reports for comments
• Tracks reporter (user or guest via IP)
• Status tracking (pending, reviewed, dismissed)
• Review history (reviewed_by, reviewed_at)
• Reason field with support for predefined reasons + additional details

🎨 UI/UX Improvements

• Improved dropdown menus: Better styling and behavior for sort and options dropdowns
• Enhanced form validation: Better error messages and validation feedback
• Loading states: Improved loading indicators for all actions
• Responsive design: Better mobile experience for all components
• Accessibility: Improved ARIA labels and keyboard navigation
• Visual feedback: Better hover states and active states for interactive elements

📚 Documentation

• Updated README: Comprehensive documentation for all new features
• Setup guides:
  • FILAMENT_SETUP.md: Guide for Filament integration
  • NOTIFICATIONS_SETUP.md: Guide for notification setup
• Configuration examples: Detailed examples for all config options
• Framework-specific guides: Instructions for both Tailwind and Bootstrap

🧪 Testing

• Comprehensive test coverage:
  • 58 tests covering all new features
  • 112 assertions
  • Tests for comment sorting (8 tests)
  • Tests for comment reporting (9 tests)
  • Tests for like functionality
  • Tests for comment CRUD operations
• PHPUnit 11 compatibility: All tests updated to use test_ prefix (no deprecated @test annotations)
• No risky tests: Proper cleanup of error handlers and exception handlers

🔄 Breaking Changes

• Filament 4 required: If using Filament integration, Filament v4 is now required
• View structure changed: Views are now organized by framework (tailwind/bootstrap)
• Config file updated: New config options added (backward compatible)

🚀 Migration Guide

Updating from Previous Version:

1. Update config file: Add new config options to config/commentify.php
2. Run migrations: New comment_reports table will be created
3. Choose CSS framework: Set css_framework to 'tailwind' or 'bootstrap'
4. Publish views (optional): If you've customized views, republish them:

   php artisan vendor:publish --tag="commentify-tailwind-views"
   # OR
   php artisan vendor:publish --tag="commentify-bootstrap-views"

5. Update Filament (if using): Ensure Filament v4 is installed

📝 Additional Notes

• All new features are backward compatible
• Existing installations will continue to work without changes
• New features can be enabled/disabled via configuration
• Both Tailwind CSS v4 and Bootstrap 5 are fully supported
• Dark mode works seamlessly with both frameworks
• All components are fully responsive and mobile-friendly