How hazrat-ali9/manufacturer-client works
Hazrat Ali is a React storefront for mobile accessories, with public product and informational pages, Firebase-backed user access, purchasing, reviews, and role-based dashboards. The principal customer workflow is browse products, view a product, place an order, and access order/payment features; administrators also manage products, users, and fulfillment. The graph preserves documented public pages and the major dashboard stages. Some implementation files were not excerpted, so their internal behavior and connections are not asserted.
Main entry points: App.js Route shell · Dashboard.js Dashboard shell · Home.js Home page · Register.js Registration
Components 30
Application
- Route shell
src/App.js
Storefront
- Home page
src/Component/Home/Home.js - Product catalog
src/Component/Product/Product.js - Product card
src/Component/Product/ProductCard.js - Reviews
src/Component/Review/Reviews.js - Write review
src/Component/Review/AddReview.js - Review display
src/Component/Review/ReviewCard.js - About page
src/Component/About/About.js - Portfolio page
src/Component/Portfolio/Portfolio.js - Blog page
src/Component/Blog/Blog.js - Contact page
src/Component/Contact/Contact.js
Identity
- Registration
src/Component/User/Register.js - Login
src/Component/User/Login.js - Social sign-in
src/Component/User/Social.js - Authentication guard
src/Component/RequireAuth/RequireAuth.js - Current-user lookup
src/Component/Hook/useUser.js - Firebase Auth
src/Component/Firebase/firebase.init.js
Commerce
- Product details
src/Component/Product/ProductDetails.js - Place order
src/Component/Product/Order.js - Customer orders
src/Component/Dashboard/Orders.js - Payment
src/Component/Dashboard/Payment.js
Dashboard
- All orders
src/Component/Dashboard/AllOrders.js - Dashboard shell
src/Component/Dashboard/Dashboard.js - Manage products
src/Component/Dashboard/ManageProduct.js - Add product
src/Component/Dashboard/AddProduct.js - Manage users
src/Component/Dashboard/AllUsers.js - User profile
src/Component/Dashboard/Profile.js
Other components
- Visitor
- Application API
- Image upload service
Connections 45
- Visitor → Route shell: opens
src/App.js - Route shell → Home page: routes to
src/App.js - Route shell → Product catalog: routes to
src/App.js - Route shell → Product details: routes to
src/App.js - Route shell → Dashboard shell: routes to
src/App.js - Route shell → Registration: routes to
src/App.js - Route shell → Login: routes to
src/App.js - Route shell → Reviews: routes to
src/App.js - Route shell → About page: routes to
src/App.js - Route shell → Portfolio page: routes to
src/App.js - Route shell → Blog page: routes to
src/App.js - Route shell → Contact page: routes to
src/App.js - Home page → Application API: fetches products
src/Component/Home/Home.js - Home page → Application API: fetches reviews
src/Component/Home/Home.js - Home page → Product card: renders
src/Component/Home/Home.js - Home page → Review display: renders
src/Component/Home/Home.js - Product catalog → Product card: renders
src/Component/Product/Product.js - Product details → Place order: renders
src/Component/Product/ProductDetails.js - Route shell → Authentication guard: protects routes
src/App.js - Authentication guard → Firebase Auth: checks identity
src/Component/RequireAuth/RequireAuth.js - Registration → Firebase Auth: creates account
src/Component/User/Register.js - Registration → Image upload service: uploads image
src/Component/User/Register.js - Registration → Application API: creates user profile
src/Component/User/Register.js - Registration → Social sign-in: renders
src/Component/User/Register.js - Login → Firebase Auth: authenticates
src/Component/User/Login.js - Login → Social sign-in: renders
src/Component/User/Login.js - Social sign-in → Firebase Auth: authenticates
src/Component/User/Social.js - Route shell → Current-user lookup: loads current user
src/App.js - Current-user lookup → Firebase Auth: reads auth state
src/Component/Hook/useUser.js - Current-user lookup → Application API: fetches user
src/Component/Hook/useUser.js - Dashboard shell → Current-user lookup: checks role
src/Component/Dashboard/Dashboard.js - Dashboard shell → Customer orders: shows customer orders
src/App.js - Dashboard shell → All orders: shows admin orders
src/App.js - Dashboard shell → Manage products: routes to
src/App.js - Dashboard shell → Add product: routes to
src/App.js - Dashboard shell → Manage users: routes to
src/App.js - Dashboard shell → User profile: routes to
src/App.js - Dashboard shell → Payment: routes to
src/App.js - Customer orders → Payment: renders payment
src/Component/Dashboard/Orders.js - All orders → Payment: renders payment
src/Component/Dashboard/AllOrders.js - All orders → Application API: manages orders
src/Component/Dashboard/AllOrders.js - Reviews → Application API: fetches reviews
src/Component/Review/Reviews.js - Reviews → Write review: renders form
src/Component/Review/Reviews.js - Reviews → Review display: renders cards
src/Component/Review/Reviews.js - Write review → Application API: submits review
src/Component/Review/AddReview.js