Development - mobile visualization

[BiancoGabry]

This pull request introduces significant improvements to the cashier interface, focusing on responsive design, code modularization, and user experience enhancements. The main changes include a refactor of the cashier page layout to support both mobile and desktop views, updates to the order form and payment sections for better usability, and adjustments to environment configuration for deployment flexibility.

Responsive and Modular Layout Refactor:

• Major refactor of CassaPage in app/cashier/CassaClient.tsx to use new DesktopCassaLayout and MobileCassaLayout components, passing shared props via a single layoutProps object. This enables a responsive UI that adapts to device type and removes duplicated code for layout management. Dialogs like EditItemDialog and OrderDetailDialog are now shown only on desktop, while mobile-specific components are conditionally rendered. [1] [2] [3]
• Toast notifications and daily order sidebar logic are adjusted to behave differently on mobile vs desktop, improving the mobile user experience. [1] [2] [3] [4] [5]

Order Form and Payment Section Enhancements:

• The order form in OrderForm.tsx now dynamically renders the table input field only when table input is enabled and not disabled, and the layout adjusts between one or two columns accordingly. [1] [2]
• The payment section in PaymentSection.tsx now supports an optional calculator button (for mobile), improves the order of payment method and cash details, and cleans up input validation logic. [1] [2] [3] [4] [5] [6]

Environment Configuration:

• Updates to .env.example change the default backend and auth URLs to match the new service names and ports, reflecting deployment or docker-compose changes.

These changes collectively improve maintainability, scalability, and user experience across devices.

---

Layout and Responsiveness:

• Refactored CassaPage to use new DesktopCassaLayout and MobileCassaLayout components with shared layoutProps, enabling true responsive design and reducing duplicated layout code. Dialogs are now conditionally rendered based on device type. [1] [2] [3]
• Adjusted toast notifications and daily orders sidebar logic to behave appropriately on mobile vs desktop, avoiding unnecessary popups and improving usability on smaller screens. [1] [2] [3] [4] [5]

Order Form Improvements:

• Updated OrderForm to only show the table input when enabled and not disabled, and to switch between single and double column layouts dynamically. [1] [2]

Payment Section Enhancements:

• Added optional calculator button for mobile in PaymentSection, reordered payment method and cash details, and improved input validation. [1] [2] [3] [4] [5] [6]

Configuration:

• Updated .env.example to reflect new service URLs and ports for backend and auth, improving deployment compatibility.