flowchart TD
%% ============================================
%% FRONTEND LAYER - React/TypeScript
%% ============================================
START("fa:fa-play Start: User")
UI("fa:fa-desktop React UI<br/>pi-box-calculator/")
COMPONENTS("fa:fa-shapes Components<br/>src/components/")
REDUX("fa:fa-cogs Redux Store<br/>src/app/configurationSlice.ts")
%% Modułowe komponenty
TERMINALS("fa:fa-plug Terminale<br/>564 modele")
GLANDS("fa:fa-circle-dot Dławiki<br/>Rozmiar, materiał")
BUTTONS("fa:fa-toggle-on Przyciski<br/>Pojedyncze/Podwójne")
LAMPS("fa:fa-lightbulb Lampki<br/>5 kolorów")
ENCLOSURES("fa:fa-box Obudowy<br/>Dobór optymalnej")
SWITCHES("fa:fa-sliders Przełączniki<br/>ON/OFF")
VOLTMETERS("fa:fa-gauge Woltomierze<br/>5 zakresów")
AMMETERS("fa:fa-arrows-rotate Amperomierze<br/>Pomiar bezpośredni/CT")
ADDITIONAL("fa:fa-plus-circle Dodatkowe<br/>Akcesoria")
%% ============================================
%% API COMMUNICATION LAYER
%% ============================================
API_REST("fa:fa-network-wired REST API<br/>calculator/api/")
API_OPTIONS("GET /api/modular-configuration/options/")
API_CREATE("POST /api/modular-configuration/create/")
%% ============================================
%% BACKEND LAYER - Django DDD
%% ============================================
DJANGO("fa:fa-server Django Backend<br/>calculator/")
API_VIEWS("fa:fa-code API Views<br/>modular_configuration_views.py")
DOMAIN_SERVICES("fa:fa-sitemap Domain Services<br/>domain/services/")
REPOSITORIES("fa:fa-database Repository Pattern<br/>infrastructure/repositories/")
MODELS("fa:fa-table Django Models<br/>models.py")
%% Serwisy biznesowe
ORDER_SERVICE("fa:fa-calculator Order Service<br/>order_service.py")
MODULAR_SERVICE("fa:fa-puzzle-piece Modular Config Service<br/>modular_configuration_service.py")
DIMENSIONS("fa:fa-cube Component Dimensions<br/>Wymiary, kolizje, siatka")
%% ============================================
%% DATA LAYER
%% ============================================
DATABASE("fa:fa-database PostgreSQL<br/>Products, Orders, Configurations")
%% Modele danych
MODEL_ORDER("Order<br/>JSON structure")
MODEL_ENCLOSURE("Enclosure<br/>Wymiary, certyfikaty")
MODEL_TERMINAL("Terminal<br/>Przekrój, kolor, napięcie")
MODEL_GLAND("Gland<br/>Parametry techniczne")
MODEL_CONFIG("ModularConfiguration<br/>JSONField specifications")
%% ============================================
%% ORDER MANAGEMENT
%% ============================================
ORDER_MGMT("fa:fa-shopping-cart Order Management")
PRICE_CALC("fa:fa-euro-sign Obliczanie cen<br/>Decimal precision")
XML_GEN("fa:fa-file-code XML Generation<br/>Towary i usługi")
ORDER_SUMMARY("fa:fa-chart-line Order Summary<br/>Top 20, statystyki")
ORDER_DETAILS("fa:fa-list Order Details<br/>Akordeony, pełna zawartość")
%% ============================================
%% CONNECTIONS - User Flow
%% ============================================
START --> UI
UI --> COMPONENTS
COMPONENTS --> REDUX
%% Redux do komponentów modułowych
REDUX --> TERMINALS
REDUX --> GLANDS
REDUX --> BUTTONS
REDUX --> LAMPS
REDUX --> ENCLOSURES
REDUX --> SWITCHES
REDUX --> VOLTMETERS
REDUX --> AMMETERS
REDUX --> ADDITIONAL
%% Komponenty do API
TERMINALS --> API_REST
GLANDS --> API_REST
BUTTONS --> API_REST
LAMPS --> API_REST
ENCLOSURES --> API_REST
SWITCHES --> API_REST
VOLTMETERS --> API_REST
AMMETERS --> API_REST
ADDITIONAL --> API_REST
%% API endpoints
API_REST --> API_OPTIONS
API_REST --> API_CREATE
%% API do Django
API_OPTIONS --> DJANGO
API_CREATE --> DJANGO
DJANGO --> API_VIEWS
API_VIEWS --> DOMAIN_SERVICES
%% Domain Services do Repository
DOMAIN_SERVICES --> REPOSITORIES
REPOSITORIES --> MODELS
%% Serwisy biznesowe
DOMAIN_SERVICES --> ORDER_SERVICE
DOMAIN_SERVICES --> MODULAR_SERVICE
DOMAIN_SERVICES --> DIMENSIONS
%% Modele do bazy danych
MODELS --> MODEL_ORDER
MODELS --> MODEL_ENCLOSURE
MODELS --> MODEL_TERMINAL
MODELS --> MODEL_GLAND
MODELS --> MODEL_CONFIG
MODEL_ORDER --> DATABASE
MODEL_ENCLOSURE --> DATABASE
MODEL_TERMINAL --> DATABASE
MODEL_GLAND --> DATABASE
MODEL_CONFIG --> DATABASE
%% Repository do bazy
REPOSITORIES --> DATABASE
%% Zarządzanie zamówieniami
ORDER_SERVICE --> ORDER_MGMT
ORDER_MGMT --> PRICE_CALC
ORDER_MGMT --> XML_GEN
ORDER_MGMT --> ORDER_SUMMARY
ORDER_MGMT --> ORDER_DETAILS
%% Powrót do UI (dla widoków Django)
ORDER_SUMMARY -.-> UI
ORDER_DETAILS -.-> UI
%% ============================================
%% STYLING
%% ============================================
style START color:#FFFFFF, fill:#2196F3, stroke:#2196F3
style UI color:#FFFFFF, fill:#4CAF50, stroke:#4CAF50
style REDUX color:#FFFFFF, fill:#FF9800, stroke:#FF9800
style API_REST color:#FFFFFF, fill:#9C27B0, stroke:#9C27B0
style DJANGO color:#FFFFFF, fill:#F44336, stroke:#F44336
style DOMAIN_SERVICES color:#FFFFFF, fill:#00BCD4, stroke:#00BCD4
style DATABASE color:#FFFFFF, fill:#607D8B, stroke:#607D8B
style ORDER_MGMT color:#FFFFFF, fill:#795548, stroke:#795548
style XML_GEN color:#FFFFFF, fill:#E91E63, stroke:#E91E63
style PRICE_CALC color:#FFFFFF, fill:#FF5722, stroke:#FF5722