frosty-site

As a Frontend Developer, I want to implement the Hero page based on the existing Hero (v2) JSX design so that users can view a premium landing experience with a rotating interactive 3D data sphere, dynamic gradient background animation, node hover/click interactions, and prominent 'Explore Solutions' and 'Contact Us' CTA buttons with pulsating animations. This page is the entry point for both Guest and User flows (see user flow: Hero → Services / Contact / Language Switch).

As a Frontend Developer, I want to implement the Login page based on the existing Login (v2) JSX design so that admins can sign in to access the dashboard. The page should include email/password fields, validation feedback, and a styled submit button consistent with the frosty-site theme. (User flow: Login → Dashboard).

As a Frontend Developer, I want to implement the Services page based on the existing Services (v1) JSX design so that guests and users can browse Marinfor's IT solution offerings, view individual service details, and navigate from the Hero page CTA. (User flow: Hero → Services → Service Detail; Guest: Services → View Service Info).

As a Frontend Developer, I want to implement the Contact page based on the existing Contact (v1) JSX design so that guests and users can view Marinfor's contact information and submit inquiries via a form. (User flow: Hero CTA → Contact → Submit Inquiry; User flow: Products → Contact → Submit Inquiry).

As a Frontend Developer, I want to implement the Dashboard page based on the existing Dashboard (v1) JSX design so that admins can view website analytics, monitor user interactions, and navigate to Products, Media, and Settings sub-sections. (Admin flow: Login → Dashboard → Analytics / Monitor Interactions / Upload Content / Configure Site).

As a Frontend Developer, I want to implement the Products page based on the existing Products (v2) JSX design so that users can browse IT solutions, view product information, and admins can upload and manage product/service content. (User flow: Services → Products → View Product Info; Admin: Dashboard → Products → Manage Services).

As a Frontend Developer, I want to implement the Media management page based on the existing Media (v1) JSX design so that admins can update animations and edit 3D elements. (Admin flow: Products → Media → Update Animations → Edit 3D Elements).

As a Frontend Developer, I want to implement the Settings page based on the existing Settings (v1) JSX design so that admins can configure site-wide settings. (Admin flow: Dashboard → Settings → Configure Site).

As a Backend Developer, I want to implement a FastAPI endpoint for submitting contact inquiries so that guests and users can send messages from the Contact page. The API should validate inputs, store the inquiry in the MySQL/MariaDB database, and return appropriate success/error responses.

As a Backend Developer, I want to implement FastAPI endpoints for website analytics and user interaction tracking so that admins can monitor site performance from the Dashboard. This includes page view counts, inquiry counts, and basic interaction metrics stored in MySQL/MariaDB.

As a Frontend Developer, I want to implement French and Arabic language switching so that guests and users can toggle between the two languages from the Hero page. This includes setting up i18n/localization infrastructure (e.g., react-i18next), RTL layout support for Arabic, and translation files for all public-facing pages. (User flow: Hero → Switch Language).

As a Backend Developer, I want to implement FastAPI CRUD endpoints for products and services so that admins can upload, update, and manage IT solution content from the Dashboard/Products pages. Endpoints must be secured with admin authentication.

As an AI Engineer, I want to integrate GPT-5.4 via Langchain and Litellm for LLM routing so that users can receive user-friendly AI-powered responses on the platform. This includes setting up the AI assistant backend service, configuring Litellm routing, and connecting it to relevant frontend pages.