@crimsonsunset/jsg-logger 1.1.1 → 1.1.3

package/config/config-manager.js

@@ -24,26 +24,18 @@ export class ConfigManager {
             let externalConfig = {};
 
             if (typeof configSource === 'string') {
-                // Load from file path
-                if (configSource.startsWith('./') || configSource.startsWith('../')) {
-                    // Relative path - attempt to load
-                    try {
-                        const response = await fetch(configSource);
-                        if (response.ok) {
-                            externalConfig = await response.json();
-                            this.loadedPaths.push(configSource);
-                        }
-                    } catch (error) {
-                        console.warn(`Failed to load config from ${configSource}:`, error.message);
-                    }
-                }
+                // Load from file path - handle all path formats
+                externalConfig = await this._loadConfigFromPath(configSource);
             } else if (typeof configSource === 'object') {
                 // Direct config object
                 externalConfig = configSource;
             }
 
-            // Merge configurations
-            this.config = this.mergeConfigs(this.config, externalConfig);
+            // Normalize external config to match expected structure
+            const normalizedConfig = this._normalizeConfigStructure(externalConfig);
+            
+            // Merge configurations - project configs override defaults
+            this.config = this.mergeConfigs(this.config, normalizedConfig);
 
             return this.config;
         } catch (error) {
@@ -52,6 +44,260 @@ export class ConfigManager {
         }
     }
 
+    /**
+     * Load configuration from a file path with environment detection
+     * @param {string} configPath - File path to load
+     * @returns {Promise<Object>} Configuration object
+     * @private
+     */
+    async _loadConfigFromPath(configPath) {
+        try {
+            // Normalize path - add ./ prefix if missing for relative paths
+            const normalizedPath = this._normalizePath(configPath);
+            
+            // Try different loading strategies based on environment
+            let config = null;
+            
+            // Strategy 1: Browser environment with fetch
+            if (typeof window !== 'undefined' && typeof fetch !== 'undefined') {
+                config = await this._loadConfigBrowser(normalizedPath);
+            }
+            
+            // Strategy 2: Node.js environment with dynamic import
+            if (!config && typeof process !== 'undefined') {
+                config = await this._loadConfigNode(normalizedPath);
+            }
+            
+            // Strategy 3: Fallback browser import (for bundlers like Vite)
+            if (!config && typeof window !== 'undefined') {
+                config = await this._loadConfigBrowserImport(normalizedPath);
+            }
+            
+            if (config) {
+                this.loadedPaths.push(configPath);
+                console.log(`[JSG-LOGGER] Successfully loaded config from: ${configPath}`);
+                return config;
+            } else {
+                console.warn(`[JSG-LOGGER] Could not load config from: ${configPath} - using defaults`);
+                return {};
+            }
+        } catch (error) {
+            console.warn(`[JSG-LOGGER] Failed to load config from ${configPath}:`, error.message);
+            return {};
+        }
+    }
+
+    /**
+     * Normalize file path for consistent handling
+     * @param {string} path - Original path
+     * @returns {string} Normalized path
+     * @private
+     */
+    _normalizePath(path) {
+        // Add ./ prefix for relative paths that don't have it
+        if (!path.startsWith('./') && !path.startsWith('../') && !path.startsWith('/')) {
+            return `./${path}`;
+        }
+        return path;
+    }
+
+    /**
+     * Load config in browser environment using fetch
+     * @param {string} path - File path
+     * @returns {Promise<Object|null>} Configuration object or null
+     * @private
+     */
+    async _loadConfigBrowser(path) {
+        try {
+            const response = await fetch(path);
+            if (response.ok) {
+                return await response.json();
+            }
+            return null;
+        } catch (error) {
+            return null;
+        }
+    }
+
+    /**
+     * Load config in Node.js environment
+     * @param {string} path - File path  
+     * @returns {Promise<Object|null>} Configuration object or null
+     * @private
+     */
+    async _loadConfigNode(path) {
+        // Only use Node.js APIs when actually in Node.js environment
+        if (typeof process === 'undefined' || !process.versions || !process.versions.node) {
+            return null;
+        }
+        
+        try {
+            // Try dynamic import first (works with ES modules)
+            const module = await import(path, { assert: { type: 'json' } });
+            return module.default || module;
+        } catch (error) {
+            try {
+                // Fallback to fs.readFile for broader compatibility
+                const fs = await import('fs/promises');
+                const fileContent = await fs.readFile(path, 'utf-8');
+                return JSON.parse(fileContent);
+            } catch (fsError) {
+                return null;
+            }
+        }
+    }
+
+    /**
+     * Load config in browser using dynamic import (for bundlers)
+     * @param {string} path - File path
+     * @returns {Promise<Object|null>} Configuration object or null  
+     * @private
+     */
+    async _loadConfigBrowserImport(path) {
+        try {
+            // Some bundlers can handle dynamic imports of JSON files
+            const module = await import(path);
+            return module.default || module;
+        } catch (error) {
+            return null;
+        }
+    }
+
+    /**
+     * Normalize config structure to handle different field naming conventions
+     * @param {Object} config - Raw configuration object
+     * @returns {Object} Normalized configuration
+     * @private
+     */
+    _normalizeConfigStructure(config) {
+        const normalized = {...config};
+        
+        // Handle displayOptions -> display mapping
+        if (config.displayOptions && !config.display) {
+            normalized.display = this._mapDisplayOptions(config.displayOptions);
+            delete normalized.displayOptions;
+        }
+        
+        // Handle environment-specific configurations 
+        if (config.environments) {
+            // For now, just log that environment configs exist
+            // TODO: Implement environment-based config selection
+            console.log(`[JSG-LOGGER] Found environment configs for: ${Object.keys(config.environments).join(', ')}`);
+        }
+        
+        // Normalize component configurations
+        if (config.components) {
+            normalized.components = this._normalizeComponents(config.components);
+        }
+        
+        return normalized;
+    }
+    
+    /**
+     * Map displayOptions to display format
+     * @param {Object} displayOptions - Original display options
+     * @returns {Object} Normalized display configuration
+     * @private
+     */
+    _mapDisplayOptions(displayOptions) {
+        return {
+            timestamp: displayOptions.showTimestamp ?? true,
+            emoji: true, // Always enabled for JSG Logger
+            component: displayOptions.showComponent ?? true,
+            level: displayOptions.showLevel ?? false,
+            message: true, // Always enabled
+            jsonPayload: true, // Default enabled
+            stackTrace: true, // Default enabled
+            environment: displayOptions.showEnvironment ?? false
+        };
+    }
+    
+    /**
+     * Normalize component configurations
+     * @param {Object} components - Raw component config
+     * @returns {Object} Normalized component config
+     * @private
+     */
+    _normalizeComponents(components) {
+        const normalized = {};
+        
+        for (const [name, config] of Object.entries(components)) {
+            normalized[name] = {
+                emoji: config.emoji || this._getDefaultEmoji(name),
+                color: config.color || this._getDefaultColor(name),
+                name: config.name || this._formatComponentName(name),
+                level: config.level || 'info',
+                enabled: config.enabled ?? true,
+                description: config.description // Preserve description for documentation
+            };
+        }
+        
+        return normalized;
+    }
+    
+    /**
+     * Get default emoji for component
+     * @param {string} componentName - Component name
+     * @returns {string} Default emoji
+     * @private
+     */
+    _getDefaultEmoji(componentName) {
+        const emojiMap = {
+            'astro-build': '🚀',
+            'astro-integration': '⚙️', 
+            'content-processing': '📝',
+            'text-utils': '📄',
+            'date-utils': '📅',
+            'react-components': '⚛️',
+            'astro-components': '🌟',
+            'pages': '📄',
+            'config': '⚙️',
+            'seo': '🔍',
+            'performance': '⚡',
+            'dev-server': '🛠️'
+        };
+        
+        return emojiMap[componentName] || '🎯';
+    }
+    
+    /**
+     * Get default color for component
+     * @param {string} componentName - Component name
+     * @returns {string} Default color
+     * @private
+     */
+    _getDefaultColor(componentName) {
+        const colorMap = {
+            'astro-build': '#FF5D01',
+            'astro-integration': '#4A90E2',
+            'content-processing': '#00C896',
+            'text-utils': '#9B59B6',
+            'date-utils': '#3498DB',
+            'react-components': '#61DAFB',
+            'astro-components': '#FF5D01',
+            'pages': '#2ECC71',
+            'config': '#95A5A6',
+            'seo': '#E74C3C',
+            'performance': '#F39C12',
+            'dev-server': '#8E44AD'
+        };
+        
+        return colorMap[componentName] || '#4A90E2';
+    }
+    
+    /**
+     * Format component name for display
+     * @param {string} componentName - Raw component name
+     * @returns {string} Formatted display name
+     * @private
+     */
+    _formatComponentName(componentName) {
+        return componentName
+            .split('-')
+            .map(word => word.charAt(0).toUpperCase() + word.slice(1))
+            .join('');
+    }
+
     /**
      * Set current file context for override resolution
      * @param {string} filePath - Current file path being logged from

package/docs/roadmap.md

@@ -21,9 +21,9 @@
 
 ## 🎯 Current Status
 **Last Updated:** August 21, 2025  
-**Current Phase:** Phase 8 Complete - API Enhancement Success  
-**Status:** ✅ **ENHANCED & SIMPLIFIED** - v1.1.0 eliminates project boilerplate with 82% reduction  
-**Next Session Goal:** Phase 6 - DevTools Panel implementation (optional enhancement)
+**Current Phase:** Phase 9 - Genericize Logger (Remove CACP Hardcoding)  
+**Status:** 🚀 **IN PROGRESS** - Making JSG Logger truly generic by removing CACP-specific hardcoded components  
+**Current Issue:** Logger still loads CACP defaults instead of project-specific `logger-config.json` files
 
 ### Progress Overview
 - ✅ **COMPLETED:** Multi-environment logger with smart detection
@@ -339,6 +339,19 @@ Console filtering updates
 
 ## 📈 Recent Progress
 
+### August 21, 2025 - Phase 9 Discovery: CACP Hardcoding Issues 🔍
+- 🐛 **Critical Discovery**: JSG Logger still deeply hardcoded for CACP use cases
+- 🔍 **Issue Identified**: `logger-config.json` files being ignored, falling back to CACP defaults
+- 📋 **Root Causes Documented**: 6 major areas requiring genericization
+  1. `CACPLogger` class name and all references
+  2. Default config with 10 hardcoded CACP components
+  3. Component schemes duplication 
+  4. Hardcoded legacy aliases for CACP components
+  5. Core component dependency on 'cacp' logger
+  6. Config loading path resolution issues
+- 🎯 **Phase 9 Planned**: Complete roadmap for making logger truly generic
+- ✅ **Testing Successful**: JSG Logger v1.1.0 API features work, but components wrong
+
 ### August 21, 2025 - Phase 8 API Enhancement Complete ✅
 - ✅ **JSG Logger v1.1.0** - Major API simplification enhancements shipped
 - ✅ **Static Singleton Pattern** - `CACPLogger.getInstance()` with auto-initialization
@@ -403,7 +416,7 @@ Console filtering updates
 
 ## 🎯 Next Steps
 
-### **Phase 8: API Enhancement for Project Simplification** 🚀 IN PROGRESS
+### **Phase 8: API Enhancement for Project Simplification** ✅ COMPLETED
 **Goal**: Eliminate boilerplate code that every project needs to implement when using JSG Logger
 
 #### **Background - The Problem**
@@ -553,6 +566,142 @@ export { logger, JSGLogger };
 5. Test and validate 93% boilerplate reduction
 6. Document new API in README examples
 
+#### **🎯 Actual Impact Achieved** 
+- ✅ **82% Boilerplate Reduction**: 220 lines → 40 lines in jsg-tech-check-site
+- ✅ **Version Published**: JSG Logger v1.1.0 live on NPM
+- ✅ **All Features Working**: Singleton pattern, auto-discovery, performance logging, non-destructive errors
+- ✅ **Build Integration**: Works in both Astro build-time and client-side contexts
+
+---
+
+### **Phase 9: Genericize Logger (Remove CACP Hardcoding)** 🚀 IN PROGRESS
+**Goal**: Make JSG Logger truly generic by removing all CACP-specific hardcoded components and references
+
+#### **Background - The Problem**
+During Phase 8 integration testing with jsg-tech-check-site, we discovered the logger is still deeply hardcoded for CACP (Chrome Audio Control Panel) use cases:
+
+**Observable Issues:**
+```
+[JSG-LOGGER] Component 'astro-build' not found. Available: cacp, soundcloud, youtube, site-detector, websocket, popup, background, priority-manager, settings, test, siteDetector, priorityManager
+```
+
+Despite providing a proper `logger-config.json` with Astro-specific components, the logger falls back to CACP defaults instead of loading the project's configuration.
+
+#### **Root Causes - What Makes It CACP-Specific**
+
+##### **1. Class Name & Core References**
+- `CACPLogger` class name should be `JSGLogger` or `GenericLogger`
+- All static method references (`CACPLogger.getInstance()`, etc.)
+- Error messages mentioning "CACP Logger"
+- `window.CACP_Logger` global should be `window.JSG_Logger`
+
+##### **2. Default Configuration Hardcoding**
+**File:** `/config/default-config.json`
+- **Hardcoded project name**: `"CACP Logger"`
+- **10 CACP-specific components**:
+  - `cacp` (🎯 CACP-CORE) - should be generic `core`
+  - `soundcloud` (🎵 SoundCloud) 
+  - `youtube` (📹 YouTube)
+  - `site-detector` (🔍 SiteDetector)
+  - `websocket` (🌐 WebSocket)
+  - `popup` (🎛️ Popup)
+  - `background` (🔧 Background)
+  - `priority-manager` (⚖️ PriorityManager)
+  - `settings` (⚙️ Settings)
+  - `test` (🧪 Test)
+
+##### **3. Component Schemes Duplication**
+**File:** `/config/component-schemes.js`
+- Duplicates the same 10 hardcoded CACP components
+- Should be empty/minimal by default for generic usage
+
+##### **4. Hardcoded Legacy Aliases**
+```javascript
+// In createAliases() method:
+this.loggers.siteDetector = this.loggers['site-detector'];
+this.loggers.priorityManager = this.loggers['priority-manager'];
+```
+
+##### **5. Core Component Dependency**
+```javascript
+// Initialization requires 'cacp' component:
+if (this.loggers.cacp) {
+    this.loggers.cacp.info('CACP Logger initialized', {...});
+}
+```
+
+##### **6. Config Loading Path Issue** 
+- **Critical**: The logger isn't loading our `logger-config.json` properly
+- Falls back to default CACP config instead of using project-specific configurations
+- **Why our Astro config is ignored**: Path resolution or config merging logic issues
+
+#### **🔧 Implementation Plan**
+
+##### **Fix 1: Make Default Config Truly Generic**
+**Target**: `/config/default-config.json`
+```json
+{
+  "projectName": "JSG Logger",
+  "globalLevel": "info",
+  "components": {
+    "core": { 
+      "emoji": "🎯", 
+      "color": "#4A90E2", 
+      "name": "Logger-Core", 
+      "level": "info" 
+    }
+  }
+}
+```
+
+##### **Fix 2: Rename Core Class**
+**Target**: `/index.js`
+- `CACPLogger` → `JSGLogger`
+- Update all static method references
+- Update error messages
+- Update browser global: `window.CACP_Logger` → `window.JSG_Logger`
+
+##### **Fix 3: Fix Config Loading**
+**Target**: Config manager and initialization
+- Debug why `configPath: 'logger-config.json'` isn't loading properly
+- Ensure project configs override defaults instead of falling back
+- Fix path resolution for various environments (Node.js vs browser)
+
+##### **Fix 4: Remove CACP-Specific Logic**
+**Target**: `/index.js` `createAliases()` method
+- Remove hardcoded legacy aliases for `siteDetector`, `priorityManager`
+- Make aliases configurable if needed, not hardcoded
+
+##### **Fix 5: Use Configurable Core Component**
+**Target**: Initialization logging
+- Replace `this.loggers.cacp.info()` with configurable core component
+- Use `this.loggers.core` or first available component
+- Graceful fallback if no components configured
+
+##### **Fix 6: Clean Component Schemes**
+**Target**: `/config/component-schemes.js`
+- Remove all CACP-specific hardcoded components
+- Keep only minimal example or make it empty
+- Let projects define their own components
+
+#### **🎯 Success Criteria**
+1. ✅ **Generic by Default**: Fresh installations work without CACP references
+2. ✅ **Config Loading Works**: Project-specific `logger-config.json` files are properly loaded
+3. ✅ **No CACP Dependencies**: Logger works without any CACP-specific components
+4. ✅ **Clean API**: `JSGLogger.getInstance()` instead of `CACPLogger.getInstance()`
+5. ✅ **Test with Real Project**: jsg-tech-check-site loads Astro components correctly
+
+#### **📋 Implementation Steps**
+1. **Debug config loading** - Fix why `logger-config.json` is ignored
+2. **Rename core class** - `CACPLogger` → `JSGLogger`
+3. **Replace default config** - Remove 10 CACP components, use minimal generic
+4. **Remove hardcoded aliases** - Make legacy aliases configurable
+5. **Fix core component** - Use configurable core for init logging
+6. **Update browser global** - `window.JSG_Logger`
+7. **Test with jsg-tech-check-site** - Verify Astro components load correctly
+8. **Version bump** - Patch or minor version for breaking changes
+9. **Publish updated package** - Deploy generic version to NPM
+
 ---
 
 ### **Previous Optional Enhancements** (Lower Priority)

package/formatters/cli-formatter.js

@@ -4,6 +4,8 @@
  */
 
 import { COMPONENT_SCHEME, LEVEL_SCHEME } from '../config/component-schemes.js';
+import pinoColada from 'pino-colada';
+// Note: pino-pretty imported conditionally to avoid browser bundle issues
 
 /**
  * Create CLI formatter using pino-colada or pino-pretty
@@ -11,33 +13,44 @@ import { COMPONENT_SCHEME, LEVEL_SCHEME } from '../config/component-schemes.js';
  */
 export const createCLIFormatter = () => {
   try {
-    // Try to use pino-colada if available
-    const pinoColada = require('pino-colada');
-    return pinoColada();
+    // Try pino-colada first (best formatting)
+    const colada = pinoColada();
+    colada.pipe(process.stdout);
+    return colada;
   } catch (error) {
-    // Fallback to pino-pretty if pino-colada not available
-    try {
-      const pinoPretty = require('pino-pretty');
-      return pinoPretty({
-        colorize: true,
-        translateTime: 'HH:MM:ss.l',
-        messageFormat: (log, messageKey, levelLabel) => {
+    // Ultimate fallback - basic formatted output (works in all environments)
+    return {
+      write: (chunk) => {
+        try {
+          const log = JSON.parse(chunk);
+          
+          // Get component info
           const component = COMPONENT_SCHEME[log.name] || COMPONENT_SCHEME['cacp'];
           const componentName = component.name.toUpperCase().replace(/([a-z])([A-Z])/g, '$1-$2');
+          
+          // Get level info  
           const level = LEVEL_SCHEME[log.level] || LEVEL_SCHEME[30];
-          return `${level.emoji} [${componentName}] ${log[messageKey]}`;
-        },
-        customPrettifiers: {
-          level: () => '', // Hide level since we show it in messageFormat
-          time: (timestamp) => timestamp,
-          name: () => '' // Hide name since we show it in messageFormat
+          
+          // Format timestamp like pino-pretty
+          const timestamp = new Date(log.time).toLocaleTimeString('en-US', {
+            hour12: false,
+            hour: '2-digit', 
+            minute: '2-digit',
+            second: '2-digit',
+            fractionalSecondDigits: 1
+          });
+          
+          // Format message like pino-pretty messageFormat
+          const message = `${level.emoji} [${componentName}] ${log.msg || ''}`;
+          
+          // Output with timestamp prefix
+          console.log(`${timestamp} ${message}`);
+          
+        } catch (error) {
+          // Raw fallback
+          console.log(chunk);
         }
-      });
-    } catch (error) {
-      // Ultimate fallback - basic JSON
-      return {
-        write: (data) => console.log(data)
-      };
-    }
+      }
+    };
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crimsonsunset/jsg-logger",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "type": "module",
   "description": "JSG Logger - Multi-environment logger with smart detection, file-level overrides, and beautiful console formatting",
   "main": "index.js",