@Dream.mf Dev Portal

DMF Logging Package

The @dream.mf/logging package provides a comprehensive logging solution for Dream Packages applications, supporting various log types and custom log handlers.

Installation

npm install @dream.mf/logging
# or
yarn add @dream.mf/logging

Core Features

Logger Creation

createScopedLogger(properties: LogCommon)

Creates a scoped logger instance with common properties that will be included in all log entries.

Types
interface LogCommon {
  properties?: Record<string, string>;
}
Example
import { createScopedLogger } from '@dream.mf/logging';

const logger = createScopedLogger({
  properties: {
    app: 'my-app',
    version: '1.0.0',
    environment: 'production'
  }
});

Log Types

The logger supports multiple types of logs, each with its own interface and purpose:

Info Logs

Used for general information and debug messages.

interface LogInfo {
  message: string;
  level?: typeof LogLevel;
}

// Example
logger.logInfo({
  message: 'Application started successfully',
  level: LogLevel.Information // 0
});

Exception Logs

Used for error tracking and debugging.

interface LogException {
  type: string;
  error: string | Error | Object;
}

// Example
try {
  // Some code that might throw
} catch (error) {
  logger.logException({
    type: 'RuntimeError',
    error: error
  });
}

Page View Logs

Used for tracking user navigation and page visits.

interface LogPageView {
  url: string;
}

// Example
logger.logPageView({
  url: window.location.pathname
});

Event Logs

Used for tracking custom events and user interactions.

interface LogEvent {
  eventName: string;
  details?: string | Object;
}

// Example
logger.logEvent({
  eventName: 'button_click',
  details: {
    buttonId: 'submit-form',
    timestamp: new Date().toISOString()
  }
});

Log Configuration

The logger can be configured with custom handlers for each log type:

interface LogConfig {
  debug: Boolean;
  logInfo?: Function;
  logException?: Function;
  logPageView?: Function;
  logEvent?: Function;
}

Setting up the Runtime Logger

import { setupRuntime } from '@dream.mf/logging';

setupRuntime({
  debug: true,
  logInfo: (info) => {
    console.log('[INFO]', info);
  },
  logException: (error) => {
    console.error('[ERROR]', error);
  },
  logPageView: (pageView) => {
    console.log('[PAGE_VIEW]', pageView);
  },
  logEvent: (event) => {
    console.log('[EVENT]', event);
  }
});

Log Listener

The package includes a log listener component that can be used to subscribe to global log events:

import { DreamMFLogListener } from '@dream.mf/logging';

function App() {
  return (
    <DreamMFLogListener
      config={{
        debug: true,
        logInfo: (info) => {
          // Send to your logging service
          analyticsService.logInfo(info);
        },
        logException: (error) => {
          // Send to your error tracking service
          errorTrackingService.captureException(error);
        }
      }}
    >
      <YourApp />
    </DreamMFLogListener>
  );
}

Log Levels

The package includes predefined log levels for categorizing log messages:

const LogLevel = {
  Information: 0,
  Warning: 1,
  Error: 2
};

Log Types

Predefined log type constants for categorizing different types of logs:

const LogType = {
  Info: "INFO",
  Exception: "EXCEPTION",
  PageView: "PAGE_VIEW",
  Event: "EVENT"
};

Types

LogConfig

interface LogConfig {
  debug: Boolean;
  logInfo?: Function;
  logException?: Function;
  logPageView?: Function;
  logEvent?: Function;
}

LogEvent

interface LogEvent {
  eventName: string;
  details?: string | Object;
}

LogException

interface LogException {
  type: string;
  error: string | Error | Object;
}

LogPageView

interface LogPageView {
  url: string;
}

Example Usage

import { createScopedLogger, DreamMFLogListener } from '@dream.mf/logging';

// Create a listener
const listener = DreamMFLogListener({
  config: {
    debug: true,
    logInfo: (info) => {
      // Send to your logging service
      console.log(info);
    }
  }
});

// Create a logger
const logger = createScopedLogger({
  properties: {
    app: 'my-app',
    environment: 'production'
  }
});

// Log events
logger.logInfo({
  message: 'Application initialized',
  level: 'info'
});

logger.logEvent({
  eventName: 'user_action',
  details: { action: 'login' }
});