# muntasir-wsx/lifeshield-client architecture

> Architecture diagram of the GitHub repository muntasir-wsx/lifeshield-client, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-06-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/muntasir-wsx/lifeshield-client
- Repository: https://github.com/muntasir-wsx/lifeshield-client

## Overview

1. **Repository shape**
   - This is a **React/Vite single-page frontend** for the Life Shield insurance platform.
   - The repo is organized around **role-specific screens and route guards**, not around backend services. The actual API/business logic is expected to live in external endpoints consumed by this client.

2. **Bootstrap and runtime**
   - `src/main.jsx` and `src/App.jsx` are the entry points that mount the app.
   - Global styling comes from `src/index.css` and `src/App.css`, with UI behavior driven by React plus the styling stack described in the README: **Tailwind CSS, DaisyUI, and Framer Motion**.

3. **Top-level routing architecture**
   - `src/Router/Router.jsx` is the central route map.
   - `src/Routes/PrivateRoutes.jsx`, `AdminRoutes.jsx`, and `AgentRoutes.jsx` act as **access-control boundaries** around protected sections.
   - The route structure splits cleanly into **public marketing pages**, **auth pages**, and **dashboard pages** for different roles.

4. **Layout boundaries**
   - `src/Layouts/MainLayouts.jsx` is the shell for the public-facing site.
   - `src/Layouts/DashboardLayout.jsx` is the shell for authenticated dashboard flows.
   - Shared chrome is factored into `src/SharedComponents/Navbar`, `Footer`, `LifeShieldLogo`, and `Loading`, which keeps page components focused on content and workflows.

5. **Authentication and identity**
   - `src/Context/AuthProvider.jsx` and `src/Context/AuthContext.jsx` hold the app-wide auth state.
   - `src/Hooks/useAuth.jsx` exposes auth state to pages, while `src/Firebase/Firebase.init.js` contains client-side Firebase setup.
   - This suggests Firebase is used for **frontend auth/session integration**, while the app’s role model is enforced through the app’s route guards and role hooks.

6. **Role-based access model**
   - `src/Hooks/useRole.jsx` is the key abstraction for determining whether the current user is a **Customer, Agent, or Admin**.
   - The dashboard is partitioned accordingly:
     - **Customer**: policies, claims, payments
     - **Agent**: assigned customers, blog publishing, policy clearance
     - **Admin**: policy moderation, user management, applications, transactions, blogs
   - This is the primary architectural boundary in the app.

7. **API/data access layer**
   - `src/Hooks/UseAxiosPublic.jsx` and `src/Hooks/UseAxiosSecure.jsx` centralize HTTP access.
   - The “secure” client likely carries auth credentials or tokens, while the “public” client is for unauthenticated reads.
   - This separation is important because most pages are thin UI shells over backend resources such as policies, users, blogs, payments, claims, and transactions.

8. **Public marketing and discovery flow**
   - The public site includes `Home`, `AboutUs`, `AllPolicies`, `Blogs`, and `QuotePage`.
   - Home is composed from modular sections like **Banner, PopularPolicies, Agents, Testimonials, Articles, Newsletter**, indicating a marketing-oriented landing page built from reusable content blocks.
   - `AllPoliciesDetails.jsx` and `ArticleDetails.jsx` represent drill-down detail views from list pages.

9. **Customer workflow**
   - Customer-facing pages cover the core lifecycle: **browse policy → request/quote → pay → view payment status → manage active policies → submit claim request**.
   - Key screens are under `src/Pages/Customer/...`, including `MyPolicies`, `PaymentPage`, `PaymentStatus`, and `ClaimRequest`.
   - The payment flow includes `CheckoutForm.jsx`, and the README confirms **Stripe** is the external payment gateway.

10. **Agent workflow**
   - Agent pages support back-office content and customer operations: `AssignedCustomers`, `MyBlogs`, and `PolicyClearance`.
   - This indicates agents can both **manage content** and **process operational insurance tasks** for customers assigned to them.
   - The agent dashboard is a distinct workspace rather than just a filtered version of the admin panel.

11. **Admin control center**
   - Admin pages are concentrated under `src/Pages/Admin/...`: `ManageUsers`, `ManagePolicies`, `ManageApplications`, `Transactions`, and `AllBlogs`.
   - This is the platform’s governance layer: approve/reject/delete content, promote roles, and monitor financial activity.
   - The README’s RBAC description aligns with this structure: admin actions are broad and supervisory, not customer-facing.

12. **Cross-cutting UI and content concerns**
   - Shared UI components are separated from page logic, and the codebase uses many small page components (`Card`, `Details`, `Form`) rather than monoliths.
   - `react-helmet-async` is listed in the README, so pages likely manage document metadata per route.
   - Notification and feedback flows are probably handled with **SweetAlert2** and **React Hot Toast**, which are relevant because many dashboard actions are stateful and asynchronous.

13. **External/infrastructure boundaries**
   - `firebase.json`, `.firebaserc`, and the `.firebase` directory show the app is configured for **Firebase Hosting** deployment.
   - The frontend also depends on outside services for **authentication, payments, and image hosting** (per README: Firebase, Stripe, Cloudinary/ImgBB).
   - No backend source is present here, so the architecture diagram should show this repo as the **client-side presentation and orchestration layer** connecting to those external services and to a separate API backend.

Main entry points: [`src/Router/Router.jsx`](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Router/Router.jsx) (Router), [`src/Hooks/UseAxiosSecure.jsx`](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/UseAxiosSecure.jsx) (Secure API), [`src/Layouts/DashboardLayout.jsx`](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Layouts/DashboardLayout.jsx) (Dashboard layout), [`src/App.jsx`](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/App.jsx) (App)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_bootstrap["Bootstrap"]
  node_main["main<br/>entry<br/>[main.jsx]"]
  node_app["App<br/>shell<br/>[App.jsx]"]
end

subgraph group_routing["Routing"]
  node_router["Router<br/>route map<br/>[Router.jsx]"]
  node_private_routes["Private<br/>route guard<br/>[PrivateRoutes.jsx]"]
  node_admin_routes["Admin guard<br/>role guard<br/>[AdminRoutes.jsx]"]
  node_agent_routes["Agent guard<br/>role guard<br/>[AgentRoutes.jsx]"]
end

subgraph group_identity["Identity"]
  node_auth_provider["Auth provider<br/>state provider<br/>[AuthProvider.jsx]"]
  node_auth_context["Auth context<br/>[AuthContext.jsx]"]
  node_use_auth["useAuth<br/>hook<br/>[useAuth.jsx]"]
  node_use_role["useRole<br/>hook<br/>[useRole.jsx]"]
  node_axios_public["Public API<br/>http client<br/>[UseAxiosPublic.jsx]"]
  node_axios_secure["Secure API<br/>http client<br/>[UseAxiosSecure.jsx]"]
end

subgraph group_public["Public site"]
  node_home["Home<br/>landing page<br/>[Home.jsx]"]
  node_policies["Policies<br/>catalog<br/>[AllPolicies.jsx]"]
  node_policy_details["Policy details<br/>detail page"]
  node_blogs["Blogs<br/>content list<br/>[Blogs.jsx]"]
  node_article_details["Article details<br/>detail page<br/>[ArticleDetails.jsx]"]
  node_quote["Quote<br/>application form<br/>[QuotePage.jsx]"]
end

subgraph group_customer["Customer"]
  node_customer_policies["My policies<br/>customer workspace<br/>[MyPolicies.jsx]"]
  node_payment_page["Payment<br/>checkout<br/>[PaymentPage.jsx]"]
  node_checkout_form["Checkout<br/>payment form<br/>[CheckoutForm.jsx]"]
  node_payment_status["Payment status<br/>receipt<br/>[PaymentStatus.jsx]"]
  node_invoice["Invoice<br/>document<br/>[Invoice.jsx]"]
  node_claim_request["Claim request<br/>request form<br/>[ClaimRequest.jsx]"]
end

subgraph group_agent["Agent"]
  node_assigned_customers["Assigned customers<br/>agent workspace"]
  node_agent_blogs["My blogs<br/>content workspace<br/>[MyBlogs.jsx]"]
  node_policy_clearance["Policy clearance<br/>operations"]
end

subgraph group_admin["Admin"]
end

subgraph group_shared["Shared UI"]
  node_main_layout["Main layout<br/>site shell<br/>[MainLayouts.jsx]"]
  node_dashboard_layout["Dashboard layout<br/>dashboard shell"]
  node_navbar["Navbar<br/>chrome<br/>[Navbar.jsx]"]
  node_footer["Footer<br/>chrome<br/>[Footer.jsx]"]
  node_logo["Logo<br/>brand<br/>[LifeShieldLogo.jsx]"]
  node_loading["Loading<br/>status ui<br/>[Loading.jsx]"]
end

subgraph group_external["External services"]
  node_firebase_init["Firebase init<br/>auth config<br/>[Firebase.init.js]"]
end

node_main -->|"mounts"| node_app
node_app -->|"uses"| node_router
node_app -->|"wraps"| node_auth_provider
node_auth_provider -->|"publishes"| node_auth_context
node_use_auth -->|"consumes"| node_auth_context
node_use_role -->|"builds on"| node_use_auth
node_auth_provider -->|"integrates"| node_firebase_init
node_router -->|"protects"| node_private_routes
node_router -->|"restricts"| node_admin_routes
node_router -->|"restricts"| node_agent_routes
node_router -->|"renders"| node_main_layout
node_router -->|"renders"| node_dashboard_layout
node_main_layout -->|"includes"| node_navbar
node_main_layout -->|"includes"| node_footer
node_dashboard_layout -->|"includes"| node_navbar
node_dashboard_layout -->|"uses"| node_loading
node_navbar -->|"shows"| node_logo
node_router -->|"routes to"| node_home
node_router -->|"routes to"| node_policies
node_router -->|"routes to"| node_policy_details
node_router -->|"routes to"| node_blogs
node_router -->|"routes to"| node_article_details
node_router -->|"routes to"| node_quote
node_router -->|"routes to"| node_customer_policies
node_router -->|"routes to"| node_payment_page
node_payment_page -->|"contains"| node_checkout_form
node_router -->|"routes to"| node_payment_status
node_payment_status -->|"contains"| node_invoice
node_router -->|"routes to"| node_claim_request
node_router -->|"routes to"| node_assigned_customers
node_router -->|"routes to"| node_agent_blogs
node_router -->|"routes to"| node_policy_clearance
node_private_routes -->|"checks"| node_use_auth
node_admin_routes -->|"checks"| node_use_role
node_agent_routes -->|"checks"| node_use_role
node_home -->|"reads"| node_axios_public
node_policies -->|"reads"| node_axios_public
node_blogs -->|"reads"| node_axios_public
node_quote -->|"submits"| node_axios_secure
node_customer_policies -->|"reads"| node_axios_secure
node_payment_page -->|"submits"| node_axios_secure
node_claim_request -->|"submits"| node_axios_secure
node_assigned_customers -->|"reads"| node_axios_secure
node_agent_blogs -->|"writes"| node_axios_secure
node_policy_clearance -->|"updates"| node_axios_secure
node_admin_routes -->|"hosts"| node_dashboard_layout
node_agent_routes -->|"hosts"| node_dashboard_layout

click node_main "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/main.jsx"
click node_app "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/App.jsx"
click node_router "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Router/Router.jsx"
click node_private_routes "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Routes/PrivateRoutes.jsx"
click node_admin_routes "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Routes/AdminRoutes.jsx"
click node_agent_routes "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Routes/AgentRoutes.jsx"
click node_auth_provider "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Context/AuthProvider.jsx"
click node_auth_context "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Context/AuthContext.jsx"
click node_use_auth "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/useAuth.jsx"
click node_use_role "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/useRole.jsx"
click node_axios_public "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/UseAxiosPublic.jsx"
click node_axios_secure "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/UseAxiosSecure.jsx"
click node_firebase_init "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Firebase/Firebase.init.js"
click node_main_layout "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Layouts/MainLayouts.jsx"
click node_dashboard_layout "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Layouts/DashboardLayout.jsx"
click node_navbar "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/Navbar/Navbar.jsx"
click node_footer "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/Footer/Footer.jsx"
click node_logo "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/LifeShieldLogo/LifeShieldLogo.jsx"
click node_loading "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/Loading/Loading.jsx"
click node_home "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Home/Home.jsx"
click node_policies "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/AllPolicies/AllPolicies.jsx"
click node_policy_details "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/AllPolicies/AllPoliciesDetails.jsx"
click node_blogs "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Blogs/Blogs.jsx"
click node_article_details "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Home/Article/ArticleDetails.jsx"
click node_quote "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/QuotePage/QuotePage.jsx"
click node_customer_policies "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/MyPolicies/MyPolicies.jsx"
click node_payment_page "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentPage/PaymentPage.jsx"
click node_checkout_form "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentPage/CheckoutForm.jsx"
click node_payment_status "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentStatus/PaymentStatus.jsx"
click node_invoice "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentStatus/Invoice.jsx"
click node_claim_request "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/ClaimRequest/ClaimRequest.jsx"
click node_assigned_customers "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Agent/Assigned Customers/AssignedCustomers.jsx"
click node_agent_blogs "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Agent/My Blogs/MyBlogs.jsx"
click node_policy_clearance "https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Agent/Policy Clearance/PolicyClearance.jsx"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_main,node_app toneBlue
class node_router,node_private_routes,node_admin_routes,node_agent_routes,node_main_layout,node_dashboard_layout,node_navbar,node_footer,node_logo,node_loading toneAmber
class node_auth_provider,node_auth_context,node_use_auth,node_use_role,node_axios_public,node_axios_secure,node_firebase_init toneMint
class node_home,node_policies,node_policy_details,node_blogs,node_article_details,node_quote toneRose
class node_customer_policies,node_payment_page,node_checkout_form,node_payment_status,node_invoice,node_claim_request toneIndigo
class node_assigned_customers,node_agent_blogs,node_policy_clearance toneTeal
```

## Components

### Bootstrap

App entry and global styling

- [main](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/main.jsx): entry · React bootstrap entry point · `src/main.jsx`
- [App](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/App.jsx): shell · Top-level app composition · `src/App.jsx`

### Routing

Route map and access boundaries

- [Router](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Router/Router.jsx): route map · Central route configuration · `src/Router/Router.jsx`
- [Private](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Routes/PrivateRoutes.jsx): route guard · Authenticated access boundary · `src/Routes/PrivateRoutes.jsx`
- [Admin guard](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Routes/AdminRoutes.jsx): role guard · Admin-only access boundary · `src/Routes/AdminRoutes.jsx`
- [Agent guard](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Routes/AgentRoutes.jsx): role guard · Agent-only access boundary · `src/Routes/AgentRoutes.jsx`

### Identity

Auth state, role checks, and API clients

- [Auth provider](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Context/AuthProvider.jsx): state provider · App-wide auth state · `src/Context/AuthProvider.jsx`
- [Auth context](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Context/AuthContext.jsx): context · Auth context object · `src/Context/AuthContext.jsx`
- [useAuth](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/useAuth.jsx): hook · Auth state consumer hook · `src/Hooks/useAuth.jsx`
- [useRole](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/useRole.jsx): hook · Role resolution for customer, agent, admin · `src/Hooks/useRole.jsx`
- [Public API](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/UseAxiosPublic.jsx): http client · Unauthenticated API access · `src/Hooks/UseAxiosPublic.jsx`
- [Secure API](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Hooks/UseAxiosSecure.jsx): http client · Authenticated API access · `src/Hooks/UseAxiosSecure.jsx`

### Public site

Marketing and discovery pages

- [Home](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Home/Home.jsx): landing page · Marketing landing page · `src/Pages/Home/Home.jsx`
- [Policies](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/AllPolicies/AllPolicies.jsx): catalog · Public policy browsing · `src/Pages/AllPolicies/AllPolicies.jsx`
- [Policy details](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/AllPolicies/AllPoliciesDetails.jsx): detail page · Policy drill-down view · `src/Pages/AllPolicies/AllPoliciesDetails.jsx`
- [Blogs](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Blogs/Blogs.jsx): content list · Public blog listing · `src/Pages/Blogs/Blogs.jsx`
- [Article details](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Home/Article/ArticleDetails.jsx): detail page · Blog/article drill-down view · `src/Pages/Home/Article/ArticleDetails.jsx`
- [Quote](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/QuotePage/QuotePage.jsx): application form · Quote and application entry · `src/Pages/QuotePage/QuotePage.jsx`

### Customer

Customer dashboard workflows

- [My policies](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/MyPolicies/MyPolicies.jsx): customer workspace · Customer policy management · `src/Pages/Customer/MyPolicies/MyPolicies.jsx`
- [Payment](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentPage/PaymentPage.jsx): checkout · Customer payment flow · `src/Pages/Customer/PaymentPage/PaymentPage.jsx`
- [Checkout](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentPage/CheckoutForm.jsx): payment form · Stripe checkout form · `src/Pages/Customer/PaymentPage/CheckoutForm.jsx`
- [Payment status](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentStatus/PaymentStatus.jsx): receipt · Payment and invoice status · `src/Pages/Customer/PaymentStatus/PaymentStatus.jsx`
- [Invoice](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/PaymentStatus/Invoice.jsx): document · Invoice view · `src/Pages/Customer/PaymentStatus/Invoice.jsx`
- [Claim request](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Pages/Customer/ClaimRequest/ClaimRequest.jsx): request form · Customer claim submission · `src/Pages/Customer/ClaimRequest/ClaimRequest.jsx`

### Agent

Agent workspace

- [Assigned customers](https://github.com/muntasir-wsx/lifeshield-client/blob/HEAD/src/Pages/Agent/Assigned%20Customers/AssignedCustomers.jsx): agent workspace · Agent customer assignments · `src/Pages/Agent/Assigned Customers/AssignedCustomers.jsx`
- [My blogs](https://github.com/muntasir-wsx/lifeshield-client/blob/HEAD/src/Pages/Agent/My%20Blogs/MyBlogs.jsx): content workspace · Agent-authored content management · `src/Pages/Agent/My Blogs/MyBlogs.jsx`
- [Policy clearance](https://github.com/muntasir-wsx/lifeshield-client/blob/HEAD/src/Pages/Agent/Policy%20Clearance/PolicyClearance.jsx): operations · Agent policy processing · `src/Pages/Agent/Policy Clearance/PolicyClearance.jsx`

### Shared UI

Reusable chrome and utilities

- [Main layout](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Layouts/MainLayouts.jsx): site shell · Public-facing page shell · `src/Layouts/MainLayouts.jsx`
- [Dashboard layout](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Layouts/DashboardLayout.jsx): dashboard shell · Authenticated workspace shell · `src/Layouts/DashboardLayout.jsx`
- [Navbar](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/Navbar/Navbar.jsx): chrome · Top navigation · `src/SharedComponents/Navbar/Navbar.jsx`
- [Footer](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/Footer/Footer.jsx): chrome · Site footer · `src/SharedComponents/Footer/Footer.jsx`
- [Logo](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/LifeShieldLogo/LifeShieldLogo.jsx): brand · Brand mark component · `src/SharedComponents/LifeShieldLogo/LifeShieldLogo.jsx`
- [Loading](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/SharedComponents/Loading/Loading.jsx): status ui · Loading indicator · `src/SharedComponents/Loading/Loading.jsx`

### External services

Hosting and third-party platform dependencies

- [Firebase init](https://github.com/muntasir-wsx/lifeshield-client/blob/main/src/Firebase/Firebase.init.js): auth config · Client Firebase setup · `src/Firebase/Firebase.init.js`

## Connections

- main → App: mounts · Bootstraps the React app
- App → Router: uses · Delegates page selection to the route map
- App → Auth provider: wraps · Provides auth state to the tree
- Auth provider → Auth context: publishes · Exposes shared auth context
- useAuth → Auth context: consumes · Reads current auth state
- useRole → useAuth: builds on · Derives role from auth identity
- Auth provider → Firebase init: integrates · Uses Firebase client setup
- Router → Private: protects · Wraps authenticated sections
- Router → Admin guard: restricts · Applies admin-only access
- Router → Agent guard: restricts · Applies agent-only access
- Router → Main layout: renders · Public shell for marketing routes
- Router → Dashboard layout: renders · Authenticated dashboard shell
- Main layout → Navbar: includes · Shared public chrome
- Main layout → Footer: includes · Shared public chrome
- Dashboard layout → Navbar: includes · Shared workspace chrome
- Dashboard layout → Loading: uses · Loading state feedback
- Navbar → Logo: shows · Brand identity
- Router → Home: routes to · Landing experience
- Router → Policies: routes to · Public policy catalog
- Router → Policy details: routes to · Policy detail view
- Router → Blogs: routes to · Public content list
- Router → Article details: routes to · Article detail view
- Router → Quote: routes to · Quote application entry
- Router → My policies: routes to · Customer policy workspace
- Router → Payment: routes to · Customer checkout flow
- Payment → Checkout: contains · Payment form step
- Router → Payment status: routes to · Payment status view
- Payment status → Invoice: contains · Invoice rendering
- Router → Claim request: routes to · Customer claim submission
- Router → Assigned customers: routes to · Agent customer operations
- Router → My blogs: routes to · Agent content workspace
- Router → Policy clearance: routes to · Agent policy processing
- Private → useAuth: checks · Requires signed-in user
- Admin guard → useRole: checks · Requires admin role
- Agent guard → useRole: checks · Requires agent role
- Home → Public API: reads · Fetches public content
- Policies → Public API: reads · Loads policy catalog
- Blogs → Public API: reads · Loads blog content
- Quote → Secure API: submits · Authenticated application data
- My policies → Secure API: reads · Loads customer records
- Payment → Secure API: submits · Creates payment intent or order
- Claim request → Secure API: submits · Creates claim request
- Assigned customers → Secure API: reads · Loads assigned customer data
- My blogs → Secure API: writes · Publishes agent content
- Policy clearance → Secure API: updates · Processes policy actions
- Admin guard → Dashboard layout: hosts · Admin workspace routes
- Agent guard → Dashboard layout: hosts · Agent workspace routes