Refactor/rename subscribers component #39
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Add SubscriptionTiersManager component for configuring relay subscription plans - Integrate subscription tiers with existing relay settings interface - Update Settings type to include subscription_tiers - Add UI for adding, removing, and editing subscription tiers - Match styling with existing dark theme components - Handle price values as strings for backend compatibility
- Update useBitcoinRates hook to properly parse TimestampHornets field - Fix data transformation to correctly display historical price data - Resolve invalid date display issues in chart visualization The hook now correctly converts backend timestamps to valid JavaScript dates, ensuring proper chronological display of Bitcoin price data in the chart.
- Fixed subscription tiers mapping between frontend and backend - Added proper interfaces for BackendSubscriptionTier with correct field names - Updated transformFromBackendSettings and transformToBackendSettings to handle lowercase fields - Added isFileStorageActive field mapping in settings transformations
- Add useTrendingCreators hook for fetching paid subscriber profiles - Implement automatic fallback to dummy profiles when no paid subscribers exist - Add proper authentication handling with token support - Update TrendingCreators component to use new hook - Fix profile image display by using imported assets - Add error handling and loading states - Add debug logging for troubleshooting This change improves the trending creators section by showing dummy profiles until paid subscribers are available, then seamlessly transitioning to real subscriber profiles once they exist.
- Transform subscription tiers into distinct cards with subtle shadow effects - Add tier titles (Free, Standard, Premium, Professional) with badges - Improve visual hierarchy with better typography and spacing - Add data and price icons for clearer information display - Enhance free tier toggle with tooltip information - Style buttons with better visual feedback and interaction states - Maintain the existing dark blue/purple color scheme
… data handling - Renamed hook to better reflect its actual purpose (fetching paid subscribers, not trending creators) - Fixed critical issue where real API data wasn't properly replacing dummy data - Added extensive logging throughout data flow for debugging - Enhanced error handling and data normalization - Improved type safety and validation - Added explicit check for placeholder avatars to properly replace them with default avatar - Maintained backwards compatibility by having useTrendingCreators re-export from usePaidSubscribers - Ensures paid subscribers are properly displayed once available from the API This change fixes the core issue where the application was always showing dummy data even when real subscriber data was available from the API.
- Fixed the duplicate image issue by implementing conditional rendering - Added responsive grid layout for when there are < 7 subscribers - Only enable carousel looping when there are >= 7 subscribers - Hide navigation buttons when there's only one subscriber - Added click functionality to display subscriber details - Improved UI adaptability for different subscriber counts - Enhanced mobile responsiveness This change improves the user experience by showing subscribers in a more appropriate layout based on count. The carousel no longer duplicates a single subscriber profile unnecessarily, and users can now click on a subscriber to view their detailed profile.
- Added new SubscriberDetailModal component with enhanced design - Created styled components for consistent look and feel - Implemented improved layout with avatar section and information cards - Added public key truncation and copy functionality with visual feedback - Enhanced user experience with easy-to-read layout and intuitive interactions - Used iconography to improve visual hierarchy and scannability - Implemented modern styling with gradients, shadows, and proper spacing - Made UI fully responsive and theme-compatible - Implemented feedback messages for user actions (e.g., copying) This modal provides a much more visually appealing and user-friendly way to display subscriber details compared to the previous simple implementation. It follows modern UI/UX principles with better information hierarchy and improved interactions.
- Removed the custom close button from the header section - Keep only the system modal close button that's built into Ant Design Modal - Ensures a cleaner UI with no duplicate close buttons - Simplifies the modal header design This change resolves the UI issue where two close buttons were appearing in the subscriber detail modal, creating a cleaner and more professional appearance.
- Addressed issue with duplicate close buttons appearing in the modal header - Removed custom close button from header section while retaining Ant Design's built-in close button - Changed modal configuration to properly display a single close button - Ensured a cleaner UI with better user experience This change ensures only one close button appears in the subscriber detail modal, creating a cleaner and more professional appearance.
Key improvements: - Add dedicated moderation notifications page - Implement direct content display in notifications - Show content directly in notification cards without popup/modal - Fix notification badge to only show unread notifications - Add proper 204 No Content response handling - Change default filter to unread - Fix View All navigation to moderation page - Correct markAsRead API format to match backend expectations
- Enhanced notification layout with clear labels and better spacing - Added explicit copy buttons with descriptive text for pubkeys and IDs - Fixed filtering behavior to only trigger API requests when explicitly requested - Applied consistent styling to both payment and moderation notifications - Improved user experience with better visual hierarchy and information display
- Added PaymentNotifications component with index file - Created paymentNotifications API module - Added PaymentNotificationsOverlay for dropdown menu - Added usePaymentNotifications hook for data management - Integrated PaymentNotificationsPage into router - Updated NotificationsDropdown to include payment notifications
- Added scrollable containers with 300px max height to both notification tabs - Implemented custom scrollbar styling for better UX - Created proper container structure with flex layout to maintain button visibility - NOTE: Some overlapping issues with buttons still exist and need to be fixed
…ponents, navigation, routing, and API integration
…ount display and add custom block reason modal
- Replace single text input with structured number + unit selector
- Add data parsing and formatting to maintain backend compatibility
- Fix React Hook dependency warning with functional update pattern
- Ensure consistent formatting of storage values ('X MB/GB per month')
- Improve error prevention by separating numeric value from unit
- Fix TypeScript type errors related to InputNumber and Select components
This change makes it easier for users to correctly set storage limits
while preventing format errors and maintaining the expected backend format.
…g and direct API calls for better reliability when fetching report notifications, marking notifications as read, and handling reported event actions
… reports remain accessible via notifications dropdown
- Add Reports tab alongside existing Moderation and Payments tabs - Integrate useReportNotifications hook for fetching and managing reports - Add report counter and unread notification tracking - Import ReportNotificationsOverlay for the dropdown display - Register report-notifications route in AppRouter
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
PR: Rename TrendingCreators to PaidSubscribers
This PR renames the TrendingCreators component to PaidSubscribers to better reflect its actual purpose. The
component displays paid subscribers rather than "trending creators", so this update improves code clarity and
semantics.
Changes
Why
This change makes the codebase more maintainable and easier to understand by using component names that
accurately reflect their functionality.