- Added CategoryFilterBar.vue to manage category filtering with AND/OR toggle options and clear all functionality.
- Implemented ProductGrid.vue to display products with loading and empty states, improving user experience.
- Refactored MarketPage.vue to utilize the new components, streamlining the layout and enhancing responsiveness.
- Updated StallView.vue to incorporate ProductGrid for consistent product display across views.
These changes enhance the overall usability and visual appeal of the market components, providing users with a more intuitive filtering and browsing experience.
- Replace dual Product interfaces with unified domain model in types/market.ts
- Rename API response type to ProductApiResponse for clarity
- Add mapApiResponseToProduct() function for clean API-to-domain conversion
- Update MerchantStore.vue to use mapping function instead of manual property assignment
- Fix CreateProductDialog.vue to properly handle type conversions for API calls
- Resolve TypeScript readonly type conflicts using type assertions instead of array spreading
- Add missing reactive references (searchQuery) and remove unused imports
- Prevent Vue 3 recursion issues by maintaining original reactive object references
This eliminates confusion between API response structure and application domain model,
following single source of truth principle for better maintainability and type safety.
- Updated the product enrichment logic in MerchantStore.vue to ensure all necessary properties match the Product interface, improving data consistency.
- Added optional properties for active status, pending state, and configuration in the Product interface within market.ts, enhancing flexibility for merchant store management.
- Improved type assertions in MarketPage.vue and StallView.vue to ensure proper type handling for product data, enhancing type safety and clarity.
These changes improve the robustness and reliability of product data handling across the market components, enhancing the overall user experience.
- Updated the searchInputRef initialization to remove the explicit type declaration, simplifying the code.
- Enhanced input focus and blur handling by ensuring the existence of the $el property before accessing the input element, improving robustness.
- Streamlined the focus management logic in the handleClear and handleKeydown functions for better user experience.
These changes enhance the reliability and clarity of the MarketFuzzySearch component, improving overall usability.
- Added a computed property to dynamically filter products based on search results, enhancing the user experience by displaying relevant products when available.
- Updated the `useCategoryFilter` integration to utilize the new computed property, streamlining the filtering logic and improving overall performance.
These changes provide users with a more responsive and relevant product display in the MarketPage, improving the effectiveness of category filtering.
- Redesigned the Stall Info Card to improve responsiveness and aesthetics, incorporating a more compact layout and enhanced logo display.
- Updated the styling of stall statistics and category badges for better alignment with the design system, improving user interaction.
- Enhanced the overall structure and clarity of stall information, making it more visually engaging and user-friendly.
These changes provide a more cohesive and appealing interface in the StallView component, improving the overall user experience.
- Adjusted padding, margins, and font sizes throughout the StallView component to enhance mobile responsiveness and overall user experience.
- Updated the styling of various elements, including buttons, statistics, and category badges, to ensure better alignment with the design system and improved accessibility.
- Enhanced the layout of the stall information and search/filter bar for a more cohesive appearance across different screen sizes.
These changes provide a more visually appealing and user-friendly interface in the StallView component.
- Updated the keyboard shortcuts hint to display only on desktop devices, improving usability for users on larger screens.
- Introduced responsive breakpoints to manage the visibility of the enhanced placeholder, ensuring a better user experience across different device sizes.
These changes refine the search component by tailoring the interface to the user's device, enhancing accessibility and interaction.
- Updated the active filters summary section to focus on product count when filters are active, enhancing clarity for users.
- Simplified the layout by removing unnecessary elements, improving the overall user experience and accessibility.
These changes streamline the display of active filters, making it easier for users to understand the number of products available based on their selected categories.
- Optimized the Market Header and Fuzzy Search components for better mobile display, enhancing usability on smaller screens.
- Adjusted spacing and font sizes for various elements to ensure a cohesive look across devices.
- Improved the active filters summary and category filters for better accessibility and visual clarity.
These changes enhance the overall user experience by providing a more responsive and visually appealing interface in the MarketPage.
- Added focus and blur event handlers to manage input focus state.
- Updated suggestion display to show both search suggestions and recent searches in a unified dropdown.
- Improved styling for suggestion buttons to enhance user interaction.
- Ensured input field is focused after clearing search, improving usability.
These changes enhance the search experience by providing clearer suggestions and better input management.
- Adjusted the typo tolerance threshold in the fuzzy search options from 0.6 to 0.4, allowing for more flexible matching of product names and descriptions.
- This change enhances the search experience by accommodating a wider range of user input variations, improving product discoverability.
- Updated background and text colors in StallView to align with the new design system, enhancing overall aesthetics and readability.
- Adjusted styles for logo and product statistics to ensure better integration with the updated theme.
- Improved accessibility by refining text colors for better contrast and visibility.
These changes enhance the user experience by providing a more cohesive and visually appealing interface in the StallView component.
- Added support for AND/OR filtering modes in the `useCategoryFilter` composable, allowing users to filter products based on all or any selected categories.
- Introduced reactive state management for filter mode and updated the filtering logic to accommodate the new functionality.
- Enhanced the MarketPage UI with a toggle for selecting filter modes, improving user experience and accessibility.
- Updated ARIA attributes for better screen reader support in the filter mode selection.
These changes significantly enhance the category filtering capabilities, providing users with more control over product visibility.
Refactor CreateProductDialog and MarketPage for improved category handling
- Updated CreateProductDialog to utilize `model-value` and `@update:model-value` for the CategoryInput component, enhancing reactivity in category selection.
- Enhanced MarketPage filtering logic to support AND/OR modes, allowing for more flexible product filtering based on selected categories.
- Improved category normalization and matching logic to ensure accurate filtering results.
These changes streamline the category management and filtering processes, providing users with a more intuitive experience when creating and finding products.
- Updated CreateProductDialog to use `model-value` for Checkbox components, enhancing reactivity and consistency.
- Modified MerchantStore to only add active products to the market store, improving product visibility and management.
These changes streamline the product creation and management processes, ensuring better user experience and data integrity.
- Introduced a new CategoryInput component to facilitate category selection with suggestions and popular categories.
- Updated CreateProductDialog to integrate the CategoryInput, enhancing the user experience for adding product categories.
- Improved accessibility and usability by allowing users to add categories via keyboard shortcuts and providing visual feedback for selected categories.
These changes enhance the product creation process by streamlining category management.
- Changed background and text colors in the active filters summary to improve visual consistency and accessibility.
- Updated ARIA attributes to enhance screen reader support for better usability.
These changes refine the user interface and accessibility of the category filtering features in the MarketPage.
- Introduced a new `useCategoryFilter` composable to manage category filtering functionality, providing reactive state management and optimized performance for product filtering based on selected categories.
- Updated `MarketPage` to integrate the new composable, enhancing the UI with improved accessibility features, including ARIA roles and labels for category filters and active filters summary.
- Refactored category filtering logic to streamline product display based on selected categories, improving user experience in navigating and filtering products.
These changes enhance the overall functionality and usability of category filtering within the market module.
- Added functionality to extract categories from Nostr event tags in the useMarket composable, improving product categorization.
- Updated MarketPage layout to ensure proper rendering of category filters, enhancing the user interface for browsing by category.
These changes improve the clarity and usability of product categorization within the market module.
- Added a new function `clearCategoryFilters` in the market store to reset selected category filters.
- Updated MarketPage to include an enhanced category filter UI with a clear all button, active filters summary, and improved badge styling for selected categories.
- Introduced computed properties for tracking selected categories and their count, improving user experience in managing filters.
These changes provide a more intuitive and user-friendly interface for category filtering in the market module.
- Introduced a new MarketFuzzySearch component to provide an advanced search interface with keyboard shortcuts, search suggestions, and recent searches functionality.
- Updated MarketPage and StallView to integrate the new fuzzy search component, replacing the previous search input implementations.
- Enhanced search capabilities with configurable options for better user experience and product discovery.
These changes improve the search functionality across the market module, making it easier for users to find products efficiently.
- Introduced a new route for viewing individual stalls, allowing users to navigate to a specific stall's page.
- Created a ProductDetailDialog component to display detailed information about products, including images, descriptions, and stock status.
- Updated MarketPage to handle stall navigation and integrate the new dialog for product details.
These enhancements improve the user experience by providing more detailed product information and easier navigation within the market module.
- Enriched products with stall names in MerchantStore, ensuring each product displays the associated stall name or 'Unknown Stall' if not available.
- Updated product addition logic in useMarket to include stall names, improving clarity and consistency across the application.
- Enhanced error handling for product loading to maintain robust functionality.
These changes improve the user experience by providing clearer product information in the market interface.
- Updated README.md to include new capabilities for Lightning invoice creation, smart payment scanning, universal payment support, and smart amount fields.
- Enhanced wallet-module documentation to reflect comprehensive Lightning Network wallet functionality, including detailed descriptions of payment processing, QR code scanning, and invoice management features.
- Added new sections for QR scanner component and payment flow architecture, improving clarity and usability for developers.
These changes provide clearer guidance on the application's features and improve the overall documentation quality.
- Closed the handleQRClick function properly by adding a closing brace, ensuring correct function definition and preventing potential runtime errors.
This change enhances the code structure and maintains the integrity of the QR code handling functionality.
- Simplified the form validation schema to always include an optional amount field, enhancing consistency across payment types.
- Updated the custom validation logic to ensure proper handling of required fields based on payment type, improving user experience.
- Adjusted the effective amount computation to default to zero when no amount is provided, ensuring accurate state management.
These changes streamline the form validation process, making it more intuitive for users while maintaining robust payment handling.
- Added a new function to normalize payment requests by stripping URI prefixes (lightning: and lnurl:) and handling BIP-21 Bitcoin URIs with Lightning fallback.
- Updated the destination parsing logic to utilize the normalization function, ensuring consistent handling of various payment formats.
- Enhanced the payment submission process by using the normalized destination for sending payments.
These changes improve the robustness of payment handling in the SendDialog, providing better support for different payment request formats.
- Added support for parsing BOLT11 invoices, LNURLs, and Lightning addresses to improve payment destination handling.
- Implemented dynamic form validation schema based on detected payment type, ensuring appropriate fields are required.
- Introduced computed properties for displaying parsed invoice details, including amount and description.
- Enhanced user feedback by conditionally rendering input fields and descriptions based on payment type.
These changes streamline the payment process by providing clearer guidance and validation for different payment methods.
- Added initialDestination prop to SendDialog for pre-filling the destination field.
- Implemented a watcher to update the destination field when initialDestination changes.
- Integrated QRScanner component into WalletPage, allowing users to scan QR codes for payment destinations.
- Updated SendDialog to accept scanned destination and improved user feedback with toast notifications.
These changes streamline the payment process by enabling QR code scanning directly within the wallet interface.
- Cleaned up the scanned result by removing the "lightning:" prefix if present before setting it in the destination field.
- Improved user feedback by ensuring only the cleaned result is processed, enhancing the overall scanning functionality.
These changes enhance the accuracy of QR code scanning results for payment destinations.
- 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.
- Removed unused tab components and associated state management to simplify the codebase.
- Improved button and QR code display elements for better interaction and visibility.
- Adjusted layout for transaction history to enhance readability and organization.
- Cleaned up commented-out code and unnecessary variables, improving overall code clarity.
These changes contribute to a more efficient and user-friendly wallet interface.
- Increased the size of the QR code display elements to enhance visibility and user interaction.
- Adjusted the layout to maintain consistency across different screen sizes, ensuring a better user experience.
These changes contribute to a more visually appealing and functional wallet interface.
- Adjusted spacing and padding in the WalletPage layout for better visual consistency across different screen sizes.
- Updated text sizes and button dimensions to enhance readability and usability.
- Improved the structure of transaction and address sections for a more organized presentation of information.
- Enhanced QR code display and interaction elements for better user experience.
These changes streamline the user interface, making it more intuitive and visually appealing.
- Updated README.md to include new capabilities for Lightning invoice creation, smart payment scanning, universal payment support, and smart amount fields.
- Enhanced wallet-module documentation to reflect comprehensive Lightning Network wallet functionality, including detailed descriptions of payment processing, QR code scanning, and invoice management features.
- Added new sections for QR scanner component and payment flow architecture, improving clarity and usability for developers.
These changes provide clearer guidance on the application's features and improve the overall documentation quality.
- Closed the handleQRClick function properly by adding a closing brace, ensuring correct function definition and preventing potential runtime errors.
This change enhances the code structure and maintains the integrity of the QR code handling functionality.
- Simplified the form validation schema to always include an optional amount field, enhancing consistency across payment types.
- Updated the custom validation logic to ensure proper handling of required fields based on payment type, improving user experience.
- Adjusted the effective amount computation to default to zero when no amount is provided, ensuring accurate state management.
These changes streamline the form validation process, making it more intuitive for users while maintaining robust payment handling.
- Added a new function to normalize payment requests by stripping URI prefixes (lightning: and lnurl:) and handling BIP-21 Bitcoin URIs with Lightning fallback.
- Updated the destination parsing logic to utilize the normalization function, ensuring consistent handling of various payment formats.
- Enhanced the payment submission process by using the normalized destination for sending payments.
These changes improve the robustness of payment handling in the SendDialog, providing better support for different payment request formats.
- Added support for parsing BOLT11 invoices, LNURLs, and Lightning addresses to improve payment destination handling.
- Implemented dynamic form validation schema based on detected payment type, ensuring appropriate fields are required.
- Introduced computed properties for displaying parsed invoice details, including amount and description.
- Enhanced user feedback by conditionally rendering input fields and descriptions based on payment type.
These changes streamline the payment process by providing clearer guidance and validation for different payment methods.
- Added initialDestination prop to SendDialog for pre-filling the destination field.
- Implemented a watcher to update the destination field when initialDestination changes.
- Integrated QRScanner component into WalletPage, allowing users to scan QR codes for payment destinations.
- Updated SendDialog to accept scanned destination and improved user feedback with toast notifications.
These changes streamline the payment process by enabling QR code scanning directly within the wallet interface.
- Updated styling for various components to improve visual hierarchy and responsiveness, including adjustments to padding, font sizes, and element spacing.
- Enhanced form field labels and descriptions for better clarity and accessibility.
- Improved error message display and button sizes for a more consistent user experience.
- Refined layout for invoice details and payment status messages to ensure better readability across different screen sizes.
These changes enhance the overall user experience by providing a more polished and responsive interface for managing Bitcoin payments.
- Cleaned up the scanned result by removing the "lightning:" prefix if present before setting it in the destination field.
- Improved user feedback by ensuring only the cleaned result is processed, enhancing the overall scanning functionality.
These changes enhance the accuracy of QR code scanning results for payment destinations.
- Introduced guidelines for handling complex object reactivity in Vue, addressing common issues such as input components not updating and computed properties not recalculating.
- Provided solutions including using Object.assign for object reactivity, dynamic keys for component re-renders, and safe navigation with fallbacks.
- Included practical examples to illustrate the application of these patterns in real scenarios, enhancing developer understanding of Vue's reactivity system.
- 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 invoice assignment to ensure reactivity by using Object.assign, improving state management.
- Enhanced QR code generation logic to utilize either payment_request or bolt11 for better flexibility.
- Added conditional rendering for payment status messages, providing clear feedback for confirmed and failed payments.
- Improved input handling for displaying payment request and hash, ensuring accurate data representation.
These changes enhance the user experience by providing clearer feedback on payment statuses and improving invoice management functionality.
- 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.
- Introduced computed properties in ReceiveDialog.vue to dynamically display payment status, including color coding and status text based on transaction updates.
- Updated WalletService.ts to improve payment status mapping, handling various payment states more explicitly and ensuring accurate timestamp parsing.
- Adjusted the transaction display logic to convert amounts from millisats to sats for better clarity.
These changes improve the user experience by providing real-time feedback on payment statuses and ensuring accurate transaction information.
- 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.
