Log.js

/**
 * @license
 * Copyright 2019-2020 CERN and copyright holders of ALICE O2.
 * See http://alice-o2.web.cern.ch/copyright for details of the copyright holders.
 * All rights not expressly granted are reserved.
 *
 * This software is distributed under the terms of the GNU General Public
 * License v3 (GPL Version 3), copied verbatim in the file "COPYING".
 *
 * In applying this license CERN does not waive the privileges and immunities
 * granted to it by virtue of its status as an Intergovernmental Organization
 * or submit itself to any jurisdiction.
 */

import { Observable, RemoteData } from '/js/src/index.js';
import LogFilter from '../logFilter/LogFilter.js';
import ContextMenu from './ContextMenu.js';
import { MODE } from '../constants/mode.const.js';
import { TIME_MS } from '../common/Timezone.js';
import { jsonPost } from '../common/jsonPost.js';

/**
 * Model Log, encapsulate all log management and queries
 */
export default class Log extends Observable {
  /**
   * Instantiate Log class and its internal LogFilter
   * @param {Model} model - root model of the application
   */
  constructor(model) {
    super();

    this.model = model;

    this.filter = new LogFilter(model);
    this.filter.bubbleTo(this);
    this.filter.observe(this.onFilterChange.bind(this));

    this.focus = { // show date picker on focus
      timestampSince: false,
      timestampUntil: false,
    };

    this.isTimeDropdownEnabled = false;
    this.timeFormat = TIME_MS;

    this.limit = 100000;
    this.applicationLimit = 500000; // browser can be slow is `list` array is bigger
    this.limitReached = null;

    this.queryResult = RemoteData.notAsked();
    this.queryAbortController = null;

    this.list = [];
    this.item = null;
    this.autoScrollToItem = false; // go to an item
    this.autoScrollLive = false; // go at bottom on Live mode
    this.activeMode = MODE.QUERY;
    this.liveStartedAt = null;
    this.liveInterval = null; // 1s interval to update chrono
    this.resetStats();

    this.scrollTop = 0; // position of table scrollbar
    this.scrollHeight = 0; // height of content viewed in the scroll table

    this.statusDropdown = false;

    this.download = {
      fullContent: '',
      visibleOnlyContent: '',
      isVisible: false,
    };

    this.dom = {
      table: '',
    };

    this.contextMenu = new ContextMenu();
    this.contextMenu.bubbleTo(this);
  }

  /**
   * Method to return if the current mode is Query
   * @returns {boolean} - is it query mode
   */
  isActiveModeQuery() {
    return this.activeMode === MODE.QUERY;
  }

  /**
   * Toggle a dropdown with the full SQL query
   */
  toggleStatusDropdown() {
    this.statusDropdown = !this.statusDropdown;
    this.notify();
  }

  /**
   * Set all stats severities to 0
   */
  resetStats() {
    this.stats = {
      debug: 0,
      info: 0,
      warning: 0,
      error: 0,
      fatal: 0,
    };
  }

  /**
   * Increments stats of the severity of the log passed
   * @param {Log} log - log to be added to stats
   * @param {number} increment - value to increment the stat by
   */
  addStats(log, increment = 1) {
    switch (log.severity) {
      case 'F':
        this.stats.fatal += increment;
        break;
      case 'E':
        this.stats.error += increment;
        break;
      case 'W':
        this.stats.warning += increment;
        break;
      case 'I':
        this.stats.info += increment;
        break;
      case 'D':
        this.stats.debug += increment;
    }
  }

  /**
   * Show/Hide dropdown for time(s/ms) selection
   */
  toggleTimeFormat() {
    this.isTimeDropdownEnabled = !this.isTimeDropdownEnabled;
    this.notify();
  }

  /**
   * Used to display of not timestamp input panel
   * @param {string} property - timestampSince or timestampUntil
   * @param {boolean} value - true or false
   */
  setFocus(property, value) {
    this.focus[property] = value;
    this.notify();
  }

  /**
   * Set "level" filter (shift, oncall, etc.)
   * @param {number} level - level to be set
   */
  setLevel(level) {
    this.level = level;
    this.notify();
  }

  /**
   * Set current `item`, if the reference is contained
   * in `list`, it is also considered as selected in the list.
   * @param {object} item - log to be set as current item
   */
  setItem(item) {
    this.item = item;
    this.autoScrollToItem = false;
    this.notify();
  }

  /**
   * Set "limit" filter (1k, 10k, 100k, 1M)
   * If the limit is being decreased:
   * * Splices the current log list to the passed limit
   * * Updates stat box at the bottom if the limit is being decreased
   * @param {number} limit - limit to be set
   */
  setLimit(limit) {
    if (limit < this.limit) {
      this.resetStats();
      this.list.splice(0, this.list.length - limit);
      this.list.forEach((log) => this.addStats(log));
    }

    // Reset limitReached to null on limit changes since only a fresh query knows the true state
    if (limit !== this.limit) {
      this.limitReached = null;
    }

    this.limit = limit;
    this.notify();
  }

  /**
   * Set `item` as first row in the `list` to have an error/fatal
   * if no error, do nothing.
   */
  firstError() {
    if (!this.stats.error && !this.stats.fatal) {
      this.model.notification.show('No error or fatal found.', 'primary');
      return;
    }

    this.item = this.list.find((item) => item.severity === 'E' || item.severity === 'F');
    this.autoScrollToItem = true;
    this.autoScrollLive = false;

    this.notify();
  }

  /**
   * Find previous `item` in `list` to have an error/fatal
   * starting from current `item`.
   * if no current `item`, find last error/fatal.
   * if no error, do nothing.
   */
  previousError() {
    if (!this.stats.error && !this.stats.fatal) {
      this.model.notification.show('No error or fatal found.', 'primary');
      return;
    }

    if (!this.item) {
      this.lastError();
      return;
    }

    const currentIndex = this.list.indexOf(this.item);
    // find previous one, if any
    for (let i = currentIndex - 1; i >= 0; i--) {
      if (this.list[i].severity === 'E' || this.list[i].severity === 'F') {
        this.item = this.list[i];
        this.autoScrollToItem = true;
        this.autoScrollLive = false;
        this.notify();
        break;
      }
    }
  }

  /**
   * Find next `item` in `list` to have an error/fatal
   * starting from current `item`.
   * if no current `item`, find first error/fatal.
   * if no error, do nothing.
   */
  nextError() {
    if (!this.stats.error && !this.stats.fatal) {
      this.model.notification.show('No error or fatal found.', 'primary');
      return;
    }

    if (!this.item) {
      this.firstError();
      return;
    }

    const currentIndex = this.list.indexOf(this.item);
    // find next one, if any
    for (let i = currentIndex + 1; i < this.list.length; i++) {
      if (this.list[i].severity === 'E' || this.list[i].severity === 'F') {
        this.item = this.list[i];
        this.autoScrollToItem = true;
        this.autoScrollLive = false;
        this.notify();
        break;
      }
    }
  }

  /**
   * Set `item` as first row in the `list` to have an error/fatal
   * if no error, do nothing.
   */
  lastError() {
    if (!this.stats.error && !this.stats.fatal) {
      this.model.notification.show('No error or fatal found.', 'primary');
      return;
    }

    for (let i = this.list.length - 1; i >= 0; --i) {
      const item = this.list[i];
      if (item.severity === 'E' || item.severity === 'F') {
        this.item = item;
        break;
      }
    }

    this.autoScrollToItem = true;
    this.autoScrollLive = false;
    this.notify();
  }

  /**
   * Select previous `item` after current `item` or first of `list`
   */
  previousItem() {
    this.goToItem(Math.max(this.list.indexOf(this.item) - 1, 0));
  }

  /**
   * Select next `item` after current `item` or first of `list`
   */
  nextItem() {
    this.goToItem(Math.min(this.list.indexOf(this.item) + 1, this.list.length - 1));
  }

  /**
   * Select last `item` from the `list`
   */
  goToLastItem() {
    this.goToItem(this.list.length - 1);
  }

  /**
   * Go to the `item` in the `list` with the corresponding index
   * @param {number} index - index of the item to go to
   */
  goToItem(index) {
    if (!this.list.length || index >= this.list.length) {
      return;
    }

    this.item = this.list[index];
    this.autoScrollToItem = true;
    this.notify();
  }

  /**
   * Method to execute a query with the current filters configuration via button click or "Enter" keypress on filters.
   * (thus, check of DB status still needed)
   * If the user has no filters set, a prompt is shown to confirm the execution
   * If the user is in live mode, first stop live mode and then execute query in order to have a consistent result
   * Recalculate the stats and go to last log once query is executed
   * If the query is aborted by user, restore previous query result and do nothing
   * @returns {Promise<null|object>} null if query is aborted, result of the query otherwise
   */
  async query() {
    if (!this.model.frameworkInfo.isSuccess() || !this.model.frameworkInfo.payload.mysql.status.ok) {
      throw new Error('Query service is not available');
    }

    if (!this.filter.hasActiveTextFilters()) {
      if (!window.confirm('No date or text filters set.'
        + ' This will return a large amount of data. Execute query anyway?')) {
        return;
      }
    }

    if (this.isLiveModeRunning()) {
      this.liveStop(MODE.QUERY);
    } else {
      this.activeMode = MODE.QUERY;
    }

    const previousQueryResult = this.queryResult;
    this.queryResult = RemoteData.loading();
    this.notify();

    const abortController = new AbortController();
    this.queryAbortController = abortController;

    let result = 'Unable to execute query';
    try {
      result = await jsonPost('/api/query', {
        body: {
          criterias: this.filter.criterias,
          options: { limit: this.limit },
        },
        signal: abortController.signal,
      });
      this.resetStats();
      this.queryResult = RemoteData.success(result);
      this.list = result.rows;
      this.list.forEach((log) => this.addStats(log));
      this.goToLastItem();

      this.limitReached = result.count === this.limit;
      if (this.limitReached) {
        this.model.notification.show(
          `Matching results reached the buffer size of ${this.limit.toLocaleString('en-US')}.`
          + ' There might be more logs that match your filters but are not shown, consider refining your filters.',
          'warning',
        );
      }
    } catch (error) {
      if (abortController.signal.aborted) {
        this.queryResult = previousQueryResult;
      } else {
        result = { message: error.message || result };
        this.queryResult = RemoteData.failure(result.message);
        this.list = [];
        this.resetStats();
      }
    } finally {
      this.queryAbortController = null;
    }
    this.notify();
  }

  /**
   * Method to allow for cancellation of ongoing HTTP request for query mode if:
   * - a query is still ongoing
   * - an abort controller is present.
   * If the query is successfully aborted, a notification is shown to user.
   * @returns {void}
   */
  cancelQuery() {
    if (!this.queryResult.isLoading() || !this.queryAbortController) {
      return;
    }

    this.queryAbortController.abort();
    this.model.notification.show('Query cancelled', 'warning', 2000);
  }

  /**
   * Forward call to `this.filter.setCriteria`. If live mode is enabled,
   * alert user that filtering will be affected.
   * See LogFilter#setCriteria doc
   * @param {string} field - field to filter on
   * @param {string} operator - operator to use
   * @param {string} value - value to filter on
   */
  setCriteria(field, operator, value) {
    if (operator === 'in' && this.filter.criterias.severity.$in) {
      const copy = this.filter.criterias.severity.$in.concat();
      const index = copy.indexOf(value);
      if (index === -1) {
        copy.push(value);
      } else {
        copy.splice(index, 1);
      }
      value = copy.join(' ');
    }
    this.filter.setCriteria(field, operator, value);
  }

  /**
   * Notify the active mode (live or query) that filters have changed.
   */
  onFilterChange() {
    if (this.isLiveModeRunning()) {
      this.model.ws.setFilter(this.filter.toStringifyFunction());
      this.model.notification.show(
        'The current live session has been adapted to the new filter configuration.',
        'primary',
        2000,
      );
    } else if (this.isActiveModeQuery()) {
      this.model.notification.show('Filters have changed. Query again for updated results', 'primary', 2000);
    }
  }

  /**
   * Starts a live mode session by sending filters to server to allow streaming.
   * Clears also log list.
   */
  liveStart() {
    // those Errors should be protected by user interface
    if (this.queryResult.isLoading()) {
      throw new Error('Query is loading, wait before starting live');
    }
    if (!this.model.ws.authed) {
      throw new Error('WS is not yet ready');
    }
    if (!this.model.frameworkInfo.isSuccess() || !this.model.frameworkInfo.payload.infoLoggerServer.status.ok) {
      throw new Error('Live service is not available');
    }
    if (this.isLiveModeRunning()) {
      return;
    }
    this.list = [];
    this.limitReached = null;
    this.resetStats();
    this.queryResult = RemoteData.notAsked(); // empty all data from last query
    this.activeMode = MODE.LIVE.RUNNING;
    this.liveStartedAt = new Date();

    // Notify this model each second to force chorno to be updated
    // because the output of formatDuration() change in time
    // kill this interval when live mode is off
    this.liveInterval = setInterval(this.notify.bind(this), 1000);

    this.model.ws.setFilter(this.model.log.filter.toStringifyFunction());

    this.notify();
  }

  /**
   * Stops live mode and moves to specified mode ('Paused' or 'Query')
   * @param {MODE} mode to switch to (default 'Query')
   */
  liveStop(mode = MODE.QUERY) {
    if (mode !== MODE.QUERY && mode !== MODE.LIVE.PAUSED) {
      mode = MODE.QUERY;
    }
    this.activeMode = mode;
    clearInterval(this.liveInterval);
    this.model.ws.setFilter(() => false);
    this.notify();
  }

  /**
   * Method to check if current mode is Live (Running/Paused)
   * @returns {boolean} is it live mode
   */
  isLiveModeEnabled() {
    return this.activeMode === MODE.LIVE.RUNNING || this.activeMode === MODE.LIVE.PAUSED;
  }

  /**
   * Method to check if current selected mode is live and is running
   * @returns {boolean} is live mode running
   */
  isLiveModeRunning() {
    return this.activeMode === MODE.LIVE.RUNNING;
  }

  /**
   * Set log's table UI sizes to allow log scrolling
   * @param {number} scrollTop - position of the user's scroll cursor
   * @param {number} scrollHeight - height of table's viewport (not content height which is higher)
   */
  setScrollTop(scrollTop, scrollHeight) {
    this.scrollTop = scrollTop;
    this.scrollHeight = scrollHeight;
    this.notify();
  }

  /**
   * Empty the list of all logs, reset stats, clear query mode request if any
   * and close the inspector panel
   */
  empty() {
    this.list = [];
    this.limitReached = null;
    this.model.inspectorEnabled = false;
    this.resetStats();
    this.queryResult = RemoteData.notAsked();
    this.notify();
  }

  /**
   * Add a log to the list to be shown on screen
   * Keep only `limit` logs
   * @param {object} log - log to be added
   */
  addLog(log) {
    this.addStats(log);
    this.list.push(log);
    if (this.list.length > this.limit) {
      this.addStats(this.list[0], -1);
      this.list.splice(0, this.list.length - this.limit);
    }
    this.notify();
  }

  /**
   * Enable or disable auto-scroll for live mode, a checkbox is used to control it
   */
  toggleAutoScroll() {
    this.autoScrollLive = !this.autoScrollLive;
    this.dom.table.focus();
    this.notify();
  }

  /**
   * Enables auto-scroll, this is used when entering Live mode
   */
  enableAutoScroll() {
    this.autoScrollLive = true;
    this.notify();
  }

  /**
   * Disable auto-scroll, this is used when leaving Live mode
   */
  disableAutoScroll() {
    this.autoScrollLive = false;
    this.notify();
  }

  /**
   * Given a log as a JSON object, returns a string with the JSON attributes value separated by '|'
   * If the attribute has no value, an empty space will be placed
   * If the attribute contains the `timestamp` option, a special format will be used
   * @param {Log} log - log to be converted to string
   * @returns {string} - log as string
   */
  getLogAsTableRowString(log) {
    let logAsString = '';
    Object.keys(log).forEach((column) => {
      if (column === 'timestamp') {
        const { timestamp } = log;
        logAsString += `${this.model.timezone.format(timestamp, this.timeFormat)}, `;
        logAsString += `${this.model.timezone.format(timestamp, 'date')}, `;
      } else if (log[column]) {
        logAsString += `${log[column]}, `;
      } else {
        logAsString += ', ';
      }
    });
    return `${logAsString}`;
  }

  /**
   * Method which will create a table alike string with the elements displayed in the table of the current item
   * @returns {string} - string with the elements of the current item
   */
  displayedItemFieldsToString() {
    const message = this.getLogAsTableRowString(this.item);
    return message;
  }

  /**
   * Generates the content for the 2 log files that can be downloaded:
   * * all queried/live mode (if limit is less than 10001)
   * * visible only logs
   * Shows the download dropdown menu
   */
  generateLogDownloadContent() {
    if (this.list.length > 0) {
      let fullContent = '';
      this.list.forEach((item) => {
        fullContent += `${this.getLogAsTableRowString(item)}\n`;
      });

      let visibleOnlyContent = '';
      this.listLogsInViewportOnly().forEach((item) => {
        visibleOnlyContent += `${this.getLogAsTableRowString(item)}\n`;
      });
      this.download = { fullContent, visibleOnlyContent, isVisible: true };
    } else {
      this.model.notification.show('No logs present to be downloaded', 'warning', 3000);
    }
    this.notify();
  }

  /**
   * Removes the content for the 2 files from in-memory and hides the download dropdown
   * Content can be generated by calling `generateLogDownloadContent`
   */
  removeLogDownloadContent() {
    this.download = { fullContent: '', visibleOnlyContent: '', isVisible: false };
    this.notify();
  }

  /**
   * Returns an array of logs that are indeed visible to user, hidden top and hidden bottom logs
   * are not present in this array output
   * ceil() and + 1 ensure we see top and bottom logs coming
   * @returns {Array.<Log>} - logs in the viewport
   */
  listLogsInViewportOnly() {
    return this.list.slice(
      Math.floor(this.scrollTop / this.rowHeight),
      Math.floor(this.scrollTop / this.rowHeight) + Math.ceil(this.scrollHeight / this.rowHeight) + 1,
    );
  }

  get rowHeight() {
    return this.model.zoom.rowHeightPx;
  }
}