- Added a key to the ProgressiveImage component to ensure proper reactivity when the image source changes.
- Implemented a watcher in the ProgressiveImage component to reset loading state on source changes, improving user experience during image transitions.
These changes enhance the reliability and responsiveness of image handling in the application.
- Removed unused `closeOnBackdropClick` option from `useImageLightbox` for cleaner code.
- Simplified the product assignment in `ProductDetailPage` by creating a mutable copy of product data, ensuring proper handling of images and categories.
These changes enhance the maintainability and clarity of the image handling components in the application.
- Added ImageLightbox component to provide a modal view for images with navigation and keyboard support.
- Implemented ImageViewer component to display images with features like thumbnails, cycling controls, and lightbox integration.
- Updated ProgressiveImage component for improved loading and error handling.
- Refactored image imports in ProductCard, ProductDetailPage, and CheckoutPage to align with new component structure.
These changes significantly enhance the user experience for viewing and interacting with product images across the application.
- ProductDetailPage is being used in lieu of a modal becaues Lightbox
image gallery (modal) being embedded in another modal was causing too
much buggy behavior
- Added ImageViewer component to manage and display product images with
features like lightbox, thumbnails, and image cycling controls.
- Replaced ProgressiveImageGallery with ImageViewer in
ProductDetailDialog and ProductDetailPage for improved user experience
and maintainability.
- Implemented useImageLightbox composable to handle lightbox
functionality, including keyboard navigation and swipe gestures.
- Updated routing to include a dedicated product detail page for better
navigation and user flow.
These changes significantly enhance the image viewing experience in the
product detail context, providing a more dynamic and user-friendly
interface.
- Introduced ProductDetailDialog component for displaying detailed product information, including images, price, and availability.
- Implemented image cycling functionality in ProductCard for better user experience when viewing multiple product images.
- Enhanced CreateProductDialog to support image uploads with improved validation and navigation protection during form editing.
- Added logic to manage uploaded images and ensure proper handling of existing product images.
- Updated MarketPage to integrate the new ProductDetailDialog, allowing users to view product details seamlessly.
These changes significantly improve the product management experience, enhancing both the display and interaction with product images.
- Introduced Alert, AlertDescription, and AlertTitle components to enhance user notification capabilities.
- Implemented alertVariants for customizable alert styles based on different variants.
- Added TypeScript support for props in each component, ensuring type safety and better integration.
These changes provide a structured approach to displaying alerts, improving user experience and flexibility in notifications.
- Updated the ProgressiveImage component to display a dynamic error message based on the image availability, including a specific message for no-image scenarios.
- Modified ProductCard, ProductDetailDialog, and CheckoutPage components to utilize the enhanced ProgressiveImage, ensuring a consistent user experience when images are unavailable.
- Improved visual feedback by adding a placeholder for missing images across various components.
These changes enhance the user experience by providing clearer messaging and visual cues when images fail to load or are not available.
refactor: update background colors and gradients for theme-aware semantic styling consistency across components
- Changed background colors in ProgressiveImage, ProductCard, ProductDetailDialog, and CheckoutPage components to utilize theme-aware colors instead of fixed values.
- Enhanced gradient backgrounds to ensure better visual integration with the overall theme, improving the user interface and experience.
These updates promote a more cohesive design and improve maintainability by leveraging theme variables.
- Added a new ProgressiveImage component to handle image loading with a blur effect and loading indicators.
- Updated ProductCard and ProductDetailDialog components to utilize ProgressiveImage, improving image loading performance and user experience.
- Configured properties such as blur radius, transition duration, and loading indicators for better customization.
These changes enhance the visual presentation of images and optimize loading behavior across market components.
- Introduced Collapsible, CollapsibleContent, and CollapsibleTrigger components for improved UI interactions.
- Added FeedFilters component to allow users to customize content visibility in the NostrFeed.
- Updated NostrFeed and Home components to integrate new filtering capabilities, enhancing user experience with customizable content display.
- Implemented content filter logic in FeedService to support dynamic filtering based on user selections.
These changes enhance the modularity and interactivity of the feed system, providing users with greater control over the content they see.
- Introduced a new QRScanner component to facilitate QR code scanning
within the application.
- Integrated QR code scanning capabilities into the SendDialog.vue,
allowing users to scan QR codes for payment destinations.
- Updated package.json and package-lock.json to include the qr-scanner
library for QR code processing.
- Enhanced user experience by providing visual feedback and error
handling during the scanning process.
These changes improve the payment workflow by enabling users to easily
scan QR codes for transactions.
Enhance QR code interaction in ReceiveDialog.vue
- Updated the QR code display to include a clickable area that allows
users to copy the invoice directly to the clipboard.
- Added a descriptive message below the QR code to inform users about
the copy functionality, improving usability and accessibility.
These changes enhance the user experience by making it easier to
interact with the QR code for invoice management.
Fix QR scanner loading state condition and remove unused video element
reference
- Updated the loading state condition in qr-scanner.vue to check for
camera permission correctly.
- Removed the unused videoElement reference in useQRScanner.ts to clean
up the code.
These changes improve the functionality and clarity of the QR scanner
component.
- Updated the loading state condition in qr-scanner.vue to check for camera permission correctly.
- Removed the unused videoElement reference in useQRScanner.ts to clean up the code.
These changes improve the functionality and clarity of the QR scanner component.
- Introduced a new QRScanner component to facilitate QR code scanning within the application.
- Integrated QR code scanning capabilities into the SendDialog.vue, allowing users to scan QR codes for payment destinations.
- Updated package.json and package-lock.json to include the qr-scanner library for QR code processing.
- Enhanced user experience by providing visual feedback and error handling during the scanning process.
These changes improve the payment workflow by enabling users to easily scan QR codes for transactions.
- Install Shadcn Form components (FormControl, FormDescription, FormItem, FormLabel, FormMessage)
- Add vee-validate 4.15.1 for form validation
- Add zod 3.25.76 for schema validation
- Add @vee-validate/zod 4.15.1 for integration
- Update reka-ui to 2.5.0
- Prepare foundation for proper form handling with type-safe validation
- Enables proper checkbox array handling and form accessibility
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove obsolete LogoutDialog component that displayed private keys
- Replace nostrStore.account references with authService.user in market module
- Fix property access paths to use authService.user.value instead of currentUser
- Update connection state checks to use relayHub instead of nostrStore
- Clean up TODOs and remove unused nostrStore imports
- Introduce a comprehensive roadmap for integrating nostr-market-app purchasing functionality into the web-app.
- Outline key components of the shopping cart system, checkout process, and order management.
- Detail phased implementation strategy, including enhanced user experience and advanced features.
- Include security, performance, and testing considerations to ensure robust integration.
feat: Enhance market store with new order and cart management features
- Introduce new interfaces for Order, OrderItem, ContactInfo, and ShippingZone to support enhanced order management.
- Update Stall and Product interfaces to include currency and shipping details.
- Implement a comprehensive shopping cart system with stall-specific carts, including methods for adding, removing, and updating items.
- Add payment-related interfaces and methods for managing payment requests and statuses.
- Enhance filter options to include in-stock status and payment methods, improving product filtering capabilities.
- Refactor computed properties and methods for better cart management and checkout processes.
feat: Implement shopping cart functionality with new components and routing
- Add ShoppingCart, CartItem, and CartSummary components to manage cart items and display summaries.
- Introduce Cart.vue page to serve as the main shopping cart interface, integrating cart and summary components.
- Update Navbar.vue to include a cart icon with item count, enhancing user navigation.
- Implement cart management features in the market store, including item addition, quantity updates, and removal.
- Establish routing for the cart page, ensuring seamless navigation for users.
- Enhance ProductCard.vue to support adding items to the cart directly from the product listing.
feat: Update cart and checkout functionality with improved navigation and button labels
- Change "Proceed to Checkout" button text to dynamic "Place Order" based on context in CartSummary.vue.
- Update "Continue Shopping" button to "Back to Cart" in CartSummary.vue for clearer navigation.
- Modify routing for checkout to include stall ID in ShoppingCart.vue, enhancing checkout process.
- Simplify Cart.vue by removing CartSummary component and focusing on ShoppingCart display.
- Add new route for checkout with stall ID in router configuration for better handling of checkout flows.
feat: Enhance cart and checkout components with improved shipping address handling
- Update CartSummary.vue to use readonly types for cart items and shipping zones, ensuring immutability.
- Modify Checkout.vue to conditionally display the shipping address field based on the selected shipping zone's requirements for physical shipping.
- Add a digital delivery note for products that do not require a shipping address.
- Introduce a computed property to determine if a shipping address is required, improving validation logic during checkout.
- Update market store to include a new property for shipping zones indicating if physical shipping is required.
feat: Implement order placement functionality in checkout process
- Add a "Place Order" button in Checkout.vue that triggers the order placement process.
- Introduce loading state during order placement to enhance user experience.
- Implement createAndPlaceOrder method in market store to handle order creation and status updates.
- Include error handling for order placement failures, providing user feedback on errors.
- Update checkout logic to validate shipping zone and contact information before proceeding.
feat: Add Order History page and update Navbar for order tracking
- Introduce a new OrderHistory.vue page to display users' past orders with filtering and sorting options.
- Update Navbar.vue to include an "Order History" option with a badge showing the count of orders.
- Implement computed properties for order count and enhance user navigation experience.
feat: Integrate Nostr functionality for order management and user notifications
- Add NostrExtensionGuide component to inform users about the required Nostr extension for order transmission.
- Implement useNostrOrders composable to manage Nostr connection, event creation, and order sending.
- Update Checkout.vue to display Nostr connection status and provide feedback on order transmission.
- Enhance OrderHistory.vue to show Nostr transmission status and details for each order.
- Modify market store to handle Nostr event details and errors during order placement, ensuring local fallback.
- Introduce types for Nostr events to improve type safety and integration with the existing order management system.
refactor: Update Nostr relay configuration to use environment variable
- Change DEFAULT_RELAYS to dynamically retrieve relay URLs from the VITE_MARKET_RELAYS environment variable.
- Add error handling to ensure relays are configured before establishing a connection.
- Modify createBlankEvent function to return a more precise type.
- Update event signing process to ensure the event ID is generated correctly before signing.
refactor: useAuth switch Enhance Nostr order management with authentication checks
- Integrate user authentication checks to ensure Nostr features are only accessible to authenticated users.
- Replace direct window.nostr calls with auth store methods for retrieving public and private keys.
- Implement a helper function for signing events and mock encryption for order content.
- Remove obsolete Nostr type definitions to streamline the codebase.
feat: Enhance Checkout.vue with Nostr processing feedback and cleanup
- Update the checkout button to disable based on order placement state.
- Simplify order placement feedback by removing unnecessary Nostr processing checks.
- Introduce a new visual indicator for Nostr order processing status.
- Refactor computed properties for better clarity and efficiency in shipping zone handling.
refactor: Streamline Nostr order handling and integrate buyer public key retrieval
- Remove redundant Nostr relay tag from order event creation in useNostrOrders.
- Update Checkout.vue to retrieve the buyer's public key from the auth store, enhancing order placement logic.
- Modify createAndPlaceOrder method in market store to accept an optional Nostr orders instance for improved flexibility in order processing.
refactor: Remove Nostr-related components and streamline order processing
- Delete NostrExtensionGuide.vue and associated type definitions to simplify the codebase.
- Remove unused useNostr.ts file and related logic from useNostrOrders.ts.
- Update order handling in market store to directly integrate Nostr publishing without relying on external components.
- Enhance Checkout.vue and Cart.vue to reflect changes in Nostr integration and provide clearer order status feedback.
feat: Enhance Nostr chat functionality with malformed message handling
- Introduce tracking for malformed message IDs to prevent repeated processing attempts.
- Implement functions to mark messages as malformed, clean up old entries, and retrieve statistics on malformed messages.
- Add periodic cleanup of malformed messages to manage memory usage.
- Enhance message processing logic to skip previously identified malformed messages and provide detailed error handling for decryption failures.
- Update the return object to include new functions for managing malformed messages.
ZZ feat: Implement Lightning invoice management in market store
- Add functionality to create and manage Lightning invoices for orders.
- Introduce payment monitoring and status updates for invoices.
- Implement payment confirmation messaging via Nostr upon successful payment.
- Enhance order interface to include new fields for Lightning invoice details and payment status.
ZZ feat: Enhance OrderHistory.vue with payment status indicators and invoice management
- Add visual indicators for payment status, including 'Paid' and
'Payment Pending' badges.
- Implement expandable payment display for orders with Lightning
invoices.
- Introduce functionality to toggle payment display and generate
Lightning invoices.
- Update order status messaging to reflect payment requirements and
invoice generation status.
ZZ feat: Enhance OrderHistory.vue with payment status indicators and invoice management
- Add visual indicators for payment status, including 'Paid' and
'Payment Pending' badges.
- Implement expandable payment display for orders with Lightning
invoices.
- Introduce functionality to toggle payment display and generate
Lightning invoices.
- Update order status messaging to reflect payment requirements and
invoice generation status.
feat: Implement order event handling in useOrderEvents composable
- Introduce useOrderEvents composable to manage subscription and processing of order-related events.
- Define order event types and interfaces for better type safety and clarity.
- Implement methods to handle payment requests, order status updates, and invoice generation.
- Enhance OrderHistory.vue to display order event subscription status and last update timestamp.
- Update market store to include order update functionality for better integration with order events.
FIX: Build errors
refactor: Update component styles and improve UI consistency across market pages
- Replace various color classes with updated design tokens for better consistency.
- Change background colors of components to align with the new design system.
- Update text colors to enhance readability and maintain a cohesive look.
- Refactor class names in CartItem.vue, CartSummary.vue, DashboardOverview.vue, and other components to use the new color scheme.
- Ensure all components reflect the updated design guidelines for a unified user experience.
refactor: Remove Order History references from Navbar component
- Eliminate order count computation and related UI elements from the Navbar.
- Streamline the Navbar by removing the Order History button and badge.
- Maintain existing functionality for other menu items, ensuring a cleaner user interface.
feat: Implement QR code generation and download functionality in PaymentDisplay component
- Add QR code generation for payment requests using the qrcode library.
- Enhance UI to display loading states and error messages during QR code generation.
- Introduce a download button for users to save the generated QR code.
- Implement logic to regenerate QR code when the invoice changes.
refactor: Replace useRelayHub with relayHubComposable across components
- Update imports in multiple components and composables to use the new relayHubComposable for better consistency and maintainability.
- Enhance OrderHistory.vue with debug information for development, displaying key states related to orders, authentication, and relay hub connectivity.
- Remove unnecessary reconnect button from RelayHubStatus.vue to streamline user interactions.
- Improve logging in useOrderEvents for better debugging and monitoring of order event subscriptions.
refactor: Update OrderHistory.vue styles for improved UI consistency
- Replace color classes with updated design tokens for better alignment with the new design system.
- Enhance readability by adjusting text colors and background styles for payment status indicators.
- Ensure a cohesive look across the component by standardizing class names and styles.
refactor: Update component styles for improved UI consistency across checkout pages
- Replace color classes with updated design tokens for better alignment with the new design system.
- Enhance readability by adjusting text colors and background styles in CartSummary.vue, PaymentDisplay.vue, Checkout.vue, and OrderHistory.vue.
- Standardize class names and styles to ensure a cohesive look across all components.
feat: Implement invoice generation and Nostr integration in MerchantStore component
- Add functionality to generate Lightning invoices for orders and send them to customers via Nostr.
- Introduce a new sendInvoiceToCustomer method to update order details and publish invoice information.
- Enhance order event handling in useOrderEvents to update existing orders with new invoice data.
- Improve error handling and logging for invoice generation and sending processes.
feat: Enhance MerchantStore and PaymentDisplay components for improved invoice handling
- Add wallet indicator in MerchantStore to display the selected wallet name during pending orders.
- Implement temporary fixes for missing buyer and seller public keys when generating invoices.
- Update invoice generation logic to utilize the first available wallet and improve error handling.
- Modify PaymentDisplay to use the new bolt11 field for payment requests and enhance date formatting.
- Refactor order event handling to ensure accurate updates and invoice management across components.
feat: Enhance order event processing in useOrderEvents composable
- Refactor processOrderEvent to handle incoming Nostr market order events with improved validation and logging.
- Implement logic to update existing orders or create new ones based on event data, ensuring accurate order management.
- Add detailed console logging for better debugging and tracking of order events and their statuses.
- Ensure compatibility with market order structure and invoice details for seamless integration with payment processing.
feat: Enhance order management with localStorage persistence
- Update createOrder method to optionally accept an order ID from events, improving order tracking.
- Convert items from readonly to mutable for better manipulation.
- Implement localStorage persistence for orders, ensuring data is saved and loaded across sessions.
- Add methods to save and load orders from localStorage, enhancing user experience and data reliability.
feat: Update invoice creation to support additional metadata and nostrmarket compatibility
- Modify createInvoice method to accept an optional extra parameter for additional metadata.
- Change invoice tag to 'nostrmarket' for improved compatibility with Nostr market.
- Include merchant and buyer public keys in the invoice data for better integration.
- Update invoice creation in market store to utilize new parameters for enhanced functionality.
feat: Enhance order and invoice handling for Nostr market compatibility
- Add originalOrderId to order events for tracking Nostr order IDs.
- Update invoice creation to utilize original Nostr order ID when generating invoices.
- Improve logging for invoice requests to LNBits, providing better visibility into the data being sent.
- Ensure compatibility with nostrmarket by adjusting order ID handling in the market store.
fix: Refine invoice creation logic for Nostr market compatibility
- Adjust order ID handling in invoice creation to prioritize originalOrderId for better compatibility with nostrmarket.
- Enhance logging to provide clearer insights into the order ID being used during invoice generation.
feat: Integrate nostrmarket service for order publishing and merchant catalog management
- Implement functionality to publish orders via the nostrmarket protocol, replacing the previous Nostr integration.
- Add methods to publish merchant catalogs, including stalls and products, to nostrmarket with event ID tracking.
- Enhance order interface to include nostrEventId for better integration with nostrmarket.
- Improve error handling and logging for nostrmarket publishing processes.
refactor: Simplify order creation logic in useOrderEvents and update contact structure in nostrmarketService
- Streamline order creation by using event.id and defaulting to 'unknown' for stallId.
- Update contact structure to include address and message, removing optional email and phone fields for clarity.
- Ensure compatibility with new order data structure for improved integration with nostrmarket.
feat: Add bech32 to hex conversion utility and integrate into nostrmarketService
- Implement a new utility function to convert bech32 keys to hex format, enhancing key handling.
- Update nostrmarketService to utilize the new conversion function for user public and private keys.
- Modify contact structure to include additional fields for improved order information management.
feat: Add nostrclient configuration to AppConfig for enhanced Nostr integration
- Introduce a new nostrclient property in AppConfig to manage Nostr client settings.
- Include url and enabled fields to configure the Nostr client connection dynamically.
- Ensure compatibility with environment variables for flexible deployment configurations.
feat: Introduce comprehensive order management and fulfillment documentation
- Add ORDER_MANAGEMENT_FULFILLMENT.md to detail the complete order lifecycle, including order states, data models, and merchant/customer interfaces.
- Implement test scripts for verifying order and payment request formats in test-nostrmarket-format.js.
- Create PaymentRequestDialog.vue for handling payment requests with dynamic options and QR code generation.
- Enhance useOrderEvents.ts to process nostrmarket protocol messages for order management.
- Update nostrmarketService.ts to handle payment requests and order status updates, ensuring seamless integration with the marketplace.
- Integrate payment request dialog in Market.vue and manage its state in the market store.
refactor: Remove obsolete test script for nostrmarket order format
- Delete test-nostrmarket-format.js as it is no longer needed for verifying order and payment request formats.
- Update PaymentRequestDialog.vue to enhance UI components and integrate QR code generation for payment requests.
- Refactor payment handling and notification logic to utilize toast notifications instead of Quasar's notify system.
feat: Enhance OrderHistory component with payment request handling and QR code generation
- Add UI elements to display payment request status and options in OrderHistory.vue.
- Implement functions to copy payment requests, open Lightning wallets, and download QR codes.
- Update nostrmarketService to generate QR codes for payment requests and manage order statuses effectively.
- Remove obsolete PaymentRequestDialog integration from Market.vue for a cleaner UI.
feat: Add debug information and toast notifications in OrderHistory component
- Introduce debug info display for payment requests and hashes in OrderHistory.vue.
- Implement toast notifications for actions like copying payment requests, opening wallets, and downloading QR codes.
- Enhance error handling with user feedback for various order-related actions.
- Remove obsolete payment request dialog methods from market store for cleaner code.
feat: Revamp CartItem and ShoppingCart components for improved layout and functionality
- Enhance CartItem.vue with responsive design for desktop and mobile views, including better organization of product details, price, quantity controls, and remove button.
- Update ShoppingCart.vue to separate desktop and mobile layouts, improving the user experience with clearer action buttons and cart summary display.
- Implement consistent styling and layout adjustments for better visual coherence across different screen sizes.
- Remove the showLogoutConfirm state variable from Navbar.vue to streamline the logout confirmation process.
- Update the LogoutConfirmDialog component to manage its own visibility state internally, enhancing encapsulation.
- Refactor the logout button to directly trigger the confirmation dialog, improving code clarity and user experience.
feat: Enhance Logout Confirmation Handling Across Components
- Introduce a showLogoutConfirm state variable in ProfileDialog.vue, UserProfile.vue, and Navbar.vue to manage the visibility of the Logout Confirmation dialog.
- Refactor logout buttons in these components to trigger the confirmation dialog, improving user experience and preventing accidental logouts.
- Update the LogoutConfirmDialog component to accept an isOpen prop for better control of its visibility, ensuring consistent functionality across the application.
- Add a state variable to manage the visibility of the Logout Confirmation dialog in Navbar.vue.
- Update the LogoutConfirmDialog component to accept an isOpen prop and emit an update event for improved visibility control.
- Refactor the logout button in Navbar.vue to trigger the confirmation dialog, enhancing user experience by preventing accidental logouts.
- Add a new state variable to manage the visibility of the Logout Confirmation dialog in Navbar.vue.
- Update the LogoutConfirmDialog component to accept an isOpen prop and emit an update event for better control of its visibility.
- Refactor the logout button in Navbar.vue to trigger the confirmation dialog, improving user experience by preventing accidental logouts.
- Introduce a new LogoutConfirmDialog component to confirm user logout actions.
- Update ProfileDialog.vue, UserProfile.vue, and Navbar.vue to utilize the new dialog for logout confirmation, enhancing user experience and preventing accidental logouts.
- Ensure consistent styling and functionality across all instances where logout confirmation is required.
- Update CurrencyDisplay.vue to use formattedCurrency for gold, silver, and copper values, ensuring consistent two-digit formatting.
- Modify formatEverQuestCurrency function in currency.ts to pad currency values with leading zeros, enhancing visual consistency in currency representation.
- Modify the class prop in FuzzySearch.vue to accept both string and array types for greater flexibility.
- Adjust the template to correctly reference props.class for consistent styling.
- Remove unused variables in FuzzySearchDemo.vue to streamline the code.
- Update the updateData function in useFuzzySearch.ts for better parameter clarity.
- Change the private key field name from "prvkey" to "prvkey_hex" in the CHAT_INTEGRATION.md file for clarity and consistency with expected data formats.
feat: Add Fuzzy Search Component and Composable
- Introduce a new FuzzySearch component for Vue 3, leveraging Fuse.js for intelligent search capabilities.
- Implement a useFuzzySearch composable for flexible search functionality, allowing configuration of search options.
- Create demo and README files to showcase usage and features of the fuzzy search implementation.
- Update package.json and package-lock.json to include @vueuse/integrations version 13.6.0 for enhanced performance.
- Upgrade reka-ui to version 2.4.1 in package.json and package-lock.json for improved features and bug fixes.
- Introduce new Checkbox, HoverCard, Popover, Progress, RadioGroup, Separator, Skeleton, Slider, Switch, Tooltip components to enhance UI functionality.
- Ensure all new components utilize reactive props and maintain consistent styling with utility classes.
- Comment out the wallet balance display section in Navbar.vue to prepare for potential redesign or feature updates.
- Remove the border from the CurrencyDisplay component.
- Remove conditional rendering for currency denominations in CurrencyDisplay.vue, ensuring consistent display regardless of value.
- Enhance code clarity by streamlining the template structure while maintaining visual representation of wallet contents.
- Replace formatted balance display with CurrencyDisplay component in Navbar.vue, enhancing the visual representation of wallet balances.
- Introduce CurrencyDisplay.vue to handle the display of various currency denominations, improving clarity for users regarding their wallet contents.
- Integrate Reka UI Tabs component for event browsing
- Create useEvents composable for event data management
- Implement events API integration with error handling
- Add events page with upcoming and past events sections
- Configure environment variables for API connection
- Add internationalization support for events navigation
- Introduce `isConnecting` state in useNostr composable
- Update ConnectionStatus component to handle connecting state
- Add warning variant to Badge for connecting status
- Implement dynamic status text, color, and animation for connection states
- Modify App.vue to pass new isConnecting prop to ConnectionStatus
- Add animated ping effect to ConnectionStatus badge
- Update Badge variants with more subtle color schemes
- Implement success variant for online/offline states
- Reduce text size and improve visual hierarchy
- Use rounded-full badge design for better aesthetics
- Change Badge component from div to span for semantic correctness
- Add whitespace-nowrap to prevent text wrapping
- Remove unnecessary shadow classes from default and destructive variants
- Enhance outline variant with border and hover states
- Update variant prop handling in Badge component
- Add DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, and DropdownMenuItem components
- Refactor LanguageSwitcher to use new Dropdown Menu components
- Update Navbar to use LanguageSwitcher component with improved language selection UI
- Remove legacy language toggle logic from Navbar
