be9da50fc5
🎯 Component Architecture: - Created standalone CustomPagination component in src/components/ - Fully reusable across Product and Project Tracker - Props-based configuration for maximum flexibility - Built-in theme detection and switching 🎨 Feature-Rich Implementation: - Compact and full-size modes (compact prop) - Configurable page size options - Show/hide info and page size selector - Custom class names for styling - Loading states and disabled handling 📋 Props Interface: - currentPage, pageSize, totalCount, totalPages - loading, onPageChange, onPageSizeChange - pageSizeOptions, showInfo, showPageSizeSelector - compact, className for customization 🌓 Theme Integration: - Automatic dark/light mode detection - Redux state, localStorage, and document attribute fallbacks - Real-time theme switching with MutationObserver - Force re-render mechanism for theme changes 🔧 Technical Features: - Built-in theme change listeners - Proper event cleanup - Dynamic styling based on theme and compact mode - Hover effects and animations - Professional button styling 🚀 Usage Examples: - Project Tracker: compact={true} for smaller size - Product List: compact={false} for full size - Consistent API across all components - Easy to maintain and extend ✅ Code Quality: - Clean component separation - No code duplication - Proper prop validation - Consistent styling patterns - Reusable across entire application
Dreams POS React Template
A modern Point of Sale (POS) system built with React.js.
Features
- Modern and responsive UI
- Complete POS functionality
- Inventory management
- Sales and purchase tracking
- User management
- Reports and analytics
- Mobile-friendly design
Installation
- Clone the repository
git clone https://github.com/anhtuanbtx1/dreamspos-react.git
- Install dependencies
npm install
- Start the development server
npm start
Technologies Used
- React.js
- React Router
- Redux
- Bootstrap
- SCSS
- Axios
License
This project is licensed under the MIT License.