keystone-design-bootstrap 1.0.97 → 1.0.99

package/src/tracking/logging.ts

@@ -27,9 +27,20 @@ type OTelInitOptions = {
   accountId?: number;
   accountName?: string;
 };
+
+type PendingShipLog = {
+  level: LogLevel;
+  channel: string;
+  event: string;
+  detail: Record<string, unknown>;
+};
+
+const MAX_PENDING_POSTHOG_LOGS = 500;
 let otelProvider: LoggerProvider | null = null;
 let otelLogger: ReturnType<typeof logs.getLogger> | null = null;
 let otelInitFingerprint = '';
+const pendingPostHogLogs: PendingShipLog[] = [];
+const browserConsole = globalThis?.['console'];
 
 /**
  * Channel → accent colour. Unregistered channels fall through to gray.
@@ -88,6 +99,23 @@ function stripTrailingSlash(host: string): string {
   return host.replace(/\/+$/, '');
 }
 
+function enqueuePendingPostHogLog(entry: PendingShipLog): void {
+  if (pendingPostHogLogs.length >= MAX_PENDING_POSTHOG_LOGS) {
+    pendingPostHogLogs.shift();
+  }
+  pendingPostHogLogs.push(entry);
+}
+
+function flushPendingPostHogLogs(): void {
+  if (!otelLogger || pendingPostHogLogs.length === 0) return;
+
+  while (pendingPostHogLogs.length > 0) {
+    const entry = pendingPostHogLogs.shift();
+    if (!entry) break;
+    emitToPostHog(entry.level, entry.channel, entry.event, entry.detail);
+  }
+}
+
 export function initializePostHogLogging(options: OTelInitOptions): void {
   if (typeof window === 'undefined') return;
   if (!options.apiKey?.trim()) return;
@@ -129,6 +157,7 @@ export function initializePostHogLogging(options: OTelInitOptions): void {
   logs.setGlobalLoggerProvider(otelProvider);
   otelLogger = logs.getLogger(serviceName);
   otelInitFingerprint = fingerprint;
+  flushPendingPostHogLogs();
 }
 
 function isConsoleEnabled(): boolean {
@@ -167,18 +196,18 @@ function emitConsole(
   const detailStyle = 'color:#999; font-weight:normal';
 
   if (level === 'error') {
-    console.error(message, channelStyle, eventStyle, detailStyle);
+    browserConsole?.error?.(message, channelStyle, eventStyle, detailStyle);
     return;
   }
   if (level === 'warn') {
-    console.warn(message, channelStyle, eventStyle, detailStyle);
+    browserConsole?.warn?.(message, channelStyle, eventStyle, detailStyle);
     return;
   }
-  console.log(message, channelStyle, eventStyle, detailStyle);
+  browserConsole?.log?.(message, channelStyle, eventStyle, detailStyle);
 }
 
-function emitToPostHog(level: LogLevel, channel: string, event: string, detail: Record<string, unknown>): void {
-  if (!otelLogger) return;
+function emitToPostHog(level: LogLevel, channel: string, event: string, detail: Record<string, unknown>): boolean {
+  if (!otelLogger) return false;
 
   const severityText = level === 'warn' ? 'WARNING' : level === 'error' ? 'ERROR' : 'INFO';
   const attributes = flattenAttributes({ channel, ...detail });
@@ -188,6 +217,7 @@ function emitToPostHog(level: LogLevel, channel: string, event: string, detail:
     body: event,
     attributes,
   });
+  return true;
 }
 
 function emit(level: LogLevel, channel: string, event: string, detail: Record<string, unknown>, options?: LogOptions): void {
@@ -197,7 +227,10 @@ function emit(level: LogLevel, channel: string, event: string, detail: Record<st
     emitConsole(level, channel, event, detail);
   }
   if (shouldShip) {
-    emitToPostHog(level, channel, event, detail);
+    const shipped = emitToPostHog(level, channel, event, detail);
+    if (!shipped) {
+      enqueuePendingPostHogLog({ level, channel, event, detail });
+    }
   }
 }