@syntropysoft/syntropyfront 0.2.2 → 0.2.4

package/README.md

@@ -7,13 +7,17 @@
 <p align="center">
   <strong>From Chaos to Clarity</strong>
   <br />
-  The Observability Framework for High-Performance Teams
+  The Observability Library for High-Performance Teams
 </p>
 
 <p align="center">
   <a href="https://www.npmjs.com/package/@syntropysoft/syntropyfront"><img src="https://img.shields.io/npm/v/@syntropysoft/syntropyfront.svg" alt="NPM Version"></a>
   <a href="https://github.com/Syntropysoft/SyntropyLog/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@syntropysoft/syntropyfront.svg" alt="License"></a>
   <a href="#"><img src="https://img.shields.io/badge/status-ready%20for%20production-brightgreen.svg" alt="Ready for Production"></a>
+  <a href="#"><img src="https://github.com/Syntropysoft/syntropyfront/workflows/CodeQL/badge.svg" alt="CodeQL"></a>
+  <a href="#"><img src="https://img.shields.io/badge/dependabot-enabled-brightgreen.svg" alt="Dependabot"></a>
+  <a href="#"><img src="https://img.shields.io/badge/mutation%20score-75.94%25-brightgreen.svg" alt="Mutation Score"></a>
+  <a href="#"><img src="https://img.shields.io/badge/test%20coverage-91%2B%25-brightgreen.svg" alt="Test Coverage"></a>
 </p>
 
 ---
@@ -37,14 +41,14 @@ SyntropyFront automatically captures user interactions, errors, HTTP calls, and
 ### Basic Usage (1 line of code!)
 
 ```javascript
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 // That's it! Auto-initializes and captures everything automatically
 ```
 
 ### With Custom Configuration
 
 ```javascript
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 
 // Option 1: Console only (default)
 syntropyFront.configure({
@@ -93,7 +97,9 @@ syntropyFront.configure({
 ## 📦 Installation
 
 ```bash
-npm install syntropyfront
+npm install @syntropysoft/syntropyfront
+```
+
 ## 🎯 How It Works
 
 SyntropyFront automatically:
@@ -240,7 +246,7 @@ SyntropyFront captures the essentials by default, but you can extend it to captu
 ### Adding Custom Event Capture
 
 ```javascript
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 
 // Add scroll tracking
 window.addEventListener('scroll', () => {
@@ -317,7 +323,7 @@ SyntropyFront works with any JavaScript framework:
 
 ```jsx
 import React from 'react';
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 
 function App() {
   // SyntropyFront auto-initializes on import
@@ -339,7 +345,7 @@ function App() {
 </template>
 
 <script>
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 
 export default {
   methods: {
@@ -354,7 +360,7 @@ export default {
 ### Manual Error Reporting
 
 ```javascript
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 
 try {
   // Your code here
@@ -370,7 +376,7 @@ syntropyFront.sendError(new Error('Something went wrong'));
 ### Extending with Custom Events
 
 ```javascript
-import syntropyFront from 'syntropyfront';
+import syntropyFront from '@syntropysoft/syntropyfront';
 
 // Add your custom event listeners
 window.addEventListener('scroll', () => {
@@ -397,6 +403,89 @@ window.addEventListener('load', () => {
 });
 ```
 
+## 🏗️ Architecture & Code Quality
+
+SyntropyFront follows SOLID principles and maintains high code quality through:
+
+### Modular Architecture
+
+The codebase is organized into focused modules with single responsibilities:
+
+```
+src/core/
+├── agent/           # Core Agent components
+│   ├── Agent.js              # Main coordinator
+│   ├── ConfigurationManager.js # Configuration handling
+│   ├── QueueManager.js        # Batching and queuing
+│   └── HttpTransport.js       # HTTP communication
+├── database/        # IndexedDB management
+│   ├── DatabaseManager.js     # Database coordinator
+│   ├── DatabaseConfigManager.js # Configuration
+│   ├── DatabaseConnectionManager.js # Connection handling
+│   ├── DatabaseTransactionManager.js # Transaction management
+│   ├── StorageManager.js      # CRUD operations
+│   └── SerializationManager.js # Data serialization
+├── retry/           # Retry system
+│   ├── RetryManager.js        # Retry coordination
+│   └── RetryLogicManager.js   # Retry logic
+├── persistent/      # Persistent buffer
+│   └── PersistentBufferManager.js # Buffer management
+├── breadcrumbs/     # Event tracking
+│   ├── BreadcrumbManager.js   # Breadcrumb coordination
+│   └── BreadcrumbStore.js     # Breadcrumb storage
+├── context/         # Context collection
+│   └── ContextCollector.js    # Context gathering
+└── utils/           # Utilities
+    ├── Logger.js              # Logging utilities
+    └── ErrorManager.js        # Error handling
+```
+
+### Design Principles
+
+- **Single Responsibility Principle (SRP)**: Each class has one clear purpose
+- **Dependency Injection**: Components receive dependencies through constructors
+- **Declarative Error Handling**: Structured error responses with fallbacks
+- **Comprehensive Testing**: 484 tests with 77.60% mutation score
+- **Optimized Performance**: Timeouts optimized for faster execution
+
+## 🧪 Testing & Quality
+
+SyntropyFront maintains high code quality through comprehensive testing:
+
+### Test Coverage & Mutation Testing
+
+- **Mutation Score**: 77.60% - Our tests effectively detect code changes
+- **Test Coverage**: 92.22% - Comprehensive unit test coverage
+- **Key Components Performance**:
+  - `Agent.js`: 87.23% mutation score
+  - `ConfigurationManager.js`: 100% mutation score
+  - `QueueManager.js`: 97.37% mutation score
+  - `HttpTransport.js`: 86.96% mutation score
+  - `BreadcrumbManager.js`: 100% mutation score
+  - `BreadcrumbStore.js`: 95.00% mutation score
+  - `SerializationManager.js`: 100% mutation score
+  - `DatabaseTransactionManager.js`: 100% mutation score
+
+### Testing Stack
+
+- **Jest**: Unit testing framework
+- **Stryker**: Mutation testing for test quality validation
+- **IndexedDB Mocking**: Browser storage testing
+- **Fetch Mocking**: HTTP request testing
+
+### Running Tests
+
+```bash
+# Run all tests
+npm test
+
+# Run with coverage
+npm run test:coverage
+
+# Run mutation testing
+npm run test:mutation
+```
+
 ## 🔍 Debugging
 
 SyntropyFront logs helpful information to the console:
@@ -417,4 +506,4 @@ Contributions are welcome! Please feel free to submit a Pull Request.
 
 ---
 
-**Made with ❤️ for better web observability** 
+**Made with ❤️ for better web observability**