chore(compass-web): do not expose internal logger details to web onLog hook

Instead, pass the processed log contents to it.

Author: addaleax

packages/compass-web/src/logger-and-telemetry.spec.tsx

@@ -42,7 +42,8 @@ describe('useCompassWebLoggerAndTelemetry', function () {
   beforeEach(cleanup);
 
   it('should call callback props when logger is called', function () {
-    const onLog = Sinon.stub();
+    const logs: any[] = [];
+    const onLog = Sinon.stub().callsFake((entry) => logs.push(entry));
     const onTrack = Sinon.stub();
     const onDebug = Sinon.stub();
 
@@ -54,13 +55,16 @@ describe('useCompassWebLoggerAndTelemetry', function () {
     loggerAndTelemetry.log.info(mongoLogId(123), 'Ctx', 'msg', { attr: 1 });
 
     expect(onDebug).to.have.been.calledOnceWith('TEST', 'foo bar');
-    expect(onLog).to.have.been.calledOnceWith(
-      'info',
-      'TEST',
-      mongoLogId(123),
-      'Ctx',
-      'msg',
-      { attr: 1 }
-    );
+    expect(logs).to.deep.equal([
+      {
+        t: logs[0].t,
+        s: 'I',
+        c: 'TEST',
+        id: 123,
+        ctx: 'Ctx',
+        msg: 'msg',
+        attr: { attr: 1 },
+      },
+    ]);
   });
 });

packages/compass-web/src/logger-and-telemetry.tsx

@@ -1,8 +1,6 @@
-import type {
-  Logger,
-  MongoLogWriter,
-} from '@mongodb-js/compass-logging/provider';
-import { Writable } from 'stream';
+import type { Logger } from '@mongodb-js/compass-logging/provider';
+import { MongoLogWriter } from 'mongodb-log-writer/mongo-log-writer';
+import { PassThrough } from 'stream';
 import { mongoLogId } from '@mongodb-js/compass-logging/provider';
 import { useRef } from 'react';
 
@@ -11,83 +9,18 @@ export type TrackFunction = (
   properties: Record<string, any>
 ) => void;
 
-export type LogFunction = (
-  type: 'debug' | 'info' | 'warn' | 'error' | 'fatal',
-  ...args: any[]
-) => void;
+export type LogFunction = (message: {
+  id: number;
+  t?: { $date: string };
+  s: 'F' | 'E' | 'W' | 'I' | 'D1' | 'D2' | 'D3' | 'D4' | 'D5';
+  c: string;
+  ctx: string;
+  msg: string;
+  attr?: any;
+}) => void;
 
 export type DebugFunction = (...args: any[]) => void;
 
-class CompassWebLogWriter extends Writable implements MongoLogWriter {
-  _logId = '';
-  get logId() {
-    return this._logId;
-  }
-  _logFilePath = null;
-  get logFilePath() {
-    return this._logFilePath;
-  }
-  _target = {} as Writable;
-  get target() {
-    return this._target;
-  }
-  _now = () => {
-    return new Date();
-  };
-  constructor(private callbackRef: { current: { onLog?: LogFunction } }) {
-    super();
-  }
-  private _log = (
-    type: 'debug' | 'info' | 'warn' | 'error' | 'fatal',
-    ...args: any[]
-  ) => {
-    this.callbackRef?.current.onLog?.(type, ...args);
-  };
-  mongoLogId = mongoLogId;
-  flush = () => {
-    return Promise.resolve();
-  };
-  debug = (...args: any[]) => {
-    this._log('debug', ...args);
-  };
-  info = (...args: any[]) => {
-    this._log('info', ...args);
-  };
-  warn = (...args: any[]) => {
-    this._log('warn', ...args);
-  };
-  error = (...args: any[]) => {
-    this._log('error', ...args);
-  };
-  fatal = (...args: any[]) => {
-    this._log('fatal', ...args);
-  };
-  bindComponent = (component: string) => {
-    return {
-      component,
-      unbound: this as CompassWebLogWriter,
-      debug: (...args: any[]) => {
-        return this.info(component, ...args);
-      },
-      info: (...args: any[]) => {
-        return this.info(component, ...args);
-      },
-      warn: (...args: any[]) => {
-        return this.warn(component, ...args);
-      },
-      error: (...args: any[]) => {
-        return this.error(component, ...args);
-      },
-      fatal: (...args: any[]) => {
-        return this.fatal(component, ...args);
-      },
-      write: () => {
-        return true;
-      },
-    };
-  };
-}
-
 type Debugger = Logger['debug'];
 
 function createCompassWebDebugger(
@@ -133,9 +66,13 @@ export class CompassWebLoggerAndTelemetry implements Logger {
       };
     }
   ) {
-    this.log = new CompassWebLogWriter(this.callbackRef).bindComponent(
+    const passThrough = new PassThrough({ objectMode: true });
+    this.log = new MongoLogWriter('', '', passThrough).bindComponent(
       this.component
     );
+    passThrough.on('data', (line) => {
+      callbackRef.current.onLog?.(JSON.parse(line));
+    });
 
     this.debug = createCompassWebDebugger(this.component, this.callbackRef);
   }

packages/compass-web/tsconfig.json

@@ -1,7 +1,9 @@
 {
   "extends": "@mongodb-js/tsconfig-compass/tsconfig.react.json",
   "compilerOptions": {
-    "outDir": "dist"
+    "outDir": "dist",
+    "moduleResolution": "node16",
+    "module": "node16"
   },
   "include": [
     "src/**/*",