bitsfront/bitsfront-mvp

Purpose and Entry Points

This is a React/TypeScript security-intelligence dashboard, organized as a single-page client application with many operational views: threat monitoring, incidents, exposure, governance, reporting, and asset intelligence. The browser entry chain is index.html → src/main.tsx → src/App.tsx. A separate server.ts suggests an optional server-side runtime or local integration boundary.

Application Shell and Navigation

src/App.tsx is the likely orchestration point for application state, screen selection, authentication gating, and composition of dashboard modules. Identity and access UI are separated into src/components/LoginView.tsx, src/components/AuthModal.tsx, and src/components/LockScreen.tsx; these form the primary user-session boundary before protected operational views are shown.

Operational Dashboard Domains

The component layer is partitioned by security workflow rather than generic UI primitives:

• Command, overview, and live status: src/components/AICommandCenter.tsx, src/components/OverviewDashboard.tsx, src/components/ActiveMonitoring.tsx.

• Threat and breach intelligence: src/components/ThreatIntelligenceFeeds.tsx, src/components/BreachIntelligence.tsx, src/components/DarkWebMonitoring.tsx.

• Incident handling and response: src/components/IncidentsView.tsx, src/components/TriageView.tsx, src/components/ResponseView.tsx.

• Asset, people, and exposure analysis: src/components/DigitalAssetInventory.tsx, src/components/PeopleIntelligence.tsx, src/components/ExposureView.tsx.

• Governance and reporting: src/components/GovernanceEndpoints.tsx, src/components/ReportingView.tsx, src/components/RegulatoryOverviewDashboard.tsx.

These views are likely selected from the shell and consume shared local, Firebase-backed, or AI-derived data.

Data and Intelligence Inputs

The repository contains bundled datasets that can seed or drive dashboard visualizations: src/data/breachData.ts, src/data/incidentData.ts, src/data/threatFeedsData.ts, src/data/sampleAssets.ts, and src/data/vulnerabilities.json. This establishes a local-data boundary: UI components can render meaningful security scenarios without requiring live external feeds. Domain typing begins with src/types/asset.ts.

External-Service Boundaries

Firebase is the principal persistence/authentication integration, isolated in src/lib/firebase.ts, with access controls represented by firestore.rules and DRAFT_firestore.rules. The repository also includes Firebase deployment/configuration artifacts: firebase-applet-config.json and firebase-blueprint.json.

Generative-AI integration is isolated behind src/services/geminiService.ts; AI-facing screens such as src/components/CognitionEngine.tsx and src/components/AIAgentsInventory.tsx should depend on that service boundary rather than call providers directly.

Reporting and Output

PDF/report export capability is encapsulated in src/lib/pdfExport.ts, separating document generation from operational screens such as src/components/ReportingView.tsx and src/components/PostMortemView.tsx. This is an important output boundary for regulatory or incident-response workflows.

Runtime and Delivery Shape

The frontend is a Vite-based React application, indicated by vite.config.ts, src/main.tsx, and index.html, with Bun/npm lockfiles (bun.lock, package-lock.json) supporting JavaScript package execution. Client environment values are expected through .env.example; Firebase and Gemini credentials/configuration should remain outside the UI components and flow through their respective integration modules.