- Add closeOthersSignal to success notification store
- Create useCloseOnSuccessNotification hook for modals to subscribe
- Update TopUpModal to auto-close on success events
- Update InsufficientBalancePrompt to auto-close on success events
- Update Subscription page to close all modals/forms on success events
This ensures that when a WebSocket event indicates successful payment
or subscription purchase, all related modals close automatically,
providing clear feedback to users.
- Add zustand store for global success notifications
- Create SuccessNotificationModal component with prominent UI
- Update WebSocketNotifications to show modal for important events:
- balance.topup shows balance topped up modal
- subscription.activated shows activation modal
- subscription.renewed shows renewal modal
- Add translations for all locales (ru, en, zh, fa)
- Extend WSMessage interface with balance, subscription, autopay, account, referral fields
- Create WebSocketNotifications component to handle all WS events
- Add component to Layout for global event listening
- Show toasts and invalidate queries on subscription/balance events
- Add translations for all notification types (ru, en, zh, fa)
- Introduced SettingsSidebar for improved navigation and organization.
- Added SettingsSearch and its mobile variant for enhanced search functionality.
- Updated AdminSettings to utilize new components, streamlining the layout and improving user experience.
- Search across all settings regardless of active section
- Search by translated names, descriptions, and categories
- Add clear search button (X icon)
- Show search results count
- Add EditIcon component to icons.tsx
- Enhance SettingInput with textarea for long/JSON values
- Improve SettingRow styling and long value handling
- Fix CORE category translation (Ядро → Бот)
- Add auto-resize for textarea and Ctrl+Enter save shortcut
- Added visualViewport API detection for keyboard state
- Bottom nav fades out when keyboard opens (opacity + pointer-events)
- Prevents nav from jumping up with keyboard on mobile
- Updated ColorPicker component styles for better visual consistency and usability.
- Adjusted button sizes and input fields for a more cohesive design.
- Introduced theme presets in AdminSettings for quick color scheme selection, enhancing user experience.
- Added new color schemes with predefined colors for easier theme management.
- Added new BentoCard and BentoSkeleton components for consistent card styling.
- Refactored existing components to utilize BentoCard for improved visual consistency.
- Updated Tailwind configuration to include new spacing and border radius utilities.
- Enhanced global styles with custom scrollbar and noise texture for better aesthetics.
- Introduced color conversion utilities for improved color handling across components.
- Introduced HSL color conversion functions for enhanced color manipulation.
- Updated state management to synchronize HSL values with color input changes.
- Improved picker positioning logic for better usability.
- Enhanced the color picker UI with sliders for hue, saturation, and lightness adjustments.
- Refactored event handling for opening and closing the color picker, including click outside detection.
- Rendered the color picker in a portal for better positioning and accessibility.
- Added RGB value updates on color input changes and preset selections.
- Refactored RGB sliders to always be visible, enhancing user experience across devices.
- Improved range input styles for better accessibility and visual feedback.
- Updated number input fields for RGB values to hide spinners and ensure a cleaner look.
- Enhanced auto-focus functionality to work on mobile devices, specifically in Telegram WebApp.
- Added a small delay to ensure the DOM is ready before focusing the input.
- Implemented scrolling into view for iOS Safari to trigger the keyboard when the input is focused.
