es-grid-template/es/ali-table/pipeline/pipeline.js

es-grid-template

import { useState } from 'react';
import { mergeCellProps } from "../utils";
/**
 * Table data processing pipeline. TablePipeline provides context and helper methods used during table data processing, including:
 *
 * 1. ctx: the context object. A step (a stage in the pipeline) can read/write fields on ctx.
 *    Some field names in ctx have special meanings (for example, primaryKey represents the row primary key);
 *    avoid using these names for custom context fields.
 *
 * 2. rowPropsGetters: a queue of getRowProps callbacks. A step can append callbacks via pipeline.appendRowPropsGetter;
 *    when calling pipeline.getProps(), the queued functions are combined to form the final getRowProps.
 *
 * 3. Current pipeline state: dataSource, columns, and rowPropsGetters.
 *
 * 4. Snapshots: calling pipeline.snapshot(name) records the current state, which can be retrieved later by name.
 */
export class TablePipeline {
  _snapshots = {};
  _rowPropsGetters = [];
  // @ts-ignore
  _dataSource;
  // @ts-ignore
  _columns;
  static defaultIndents = {
    iconIndent: -8,
    iconWidth: 16,
    iconGap: 0,
    indentSize: 16
  };
  ctx = {
    components: {},
    indents: TablePipeline.defaultIndents
  };
  state;
  setState;
  constructor({
    state,
    setState,
    ctx
  }) {
    this.state = state;
    this.setState = setState;
    Object.assign(this.ctx, ctx);
  }
  appendRowPropsGetter(getter) {
    this._rowPropsGetters.push(getter);
    return this;
  }
  getDataSource(name) {
    if (name == null) {
      return this._dataSource;
    } else {
      return this._snapshots[name].dataSource;
    }
  }
  getColumns(name) {
    if (name == null) {
      return this._columns;
    } else {
      return this._snapshots[name].columns;
    }
  }
  getStateAtKey(stateKey, defaultValue) {
    return this.state[stateKey] ?? defaultValue;
  }

  /** stateKey partialState */
  setStateAtKey(stateKey, partialState, extraInfo) {
    this.setState(prev => ({
      ...prev,
      [stateKey]: partialState
    }), stateKey, partialState, extraInfo);
  }

  /** Ensure primaryKey is set and return it */
  ensurePrimaryKey(hint) {
    if (this.ctx.primaryKey == null) {
      throw new Error(hint ? `use ${hint} You must set the primary key first` : 'You must set the primary key first');
    }
    return this.ctx.primaryKey;
  }

  /** Set pipeline input data */
  input(input) {
    if (this._dataSource != null || this._columns != null) {
      throw new Error('input Cannot be called twice');
    }
    this._dataSource = input.dataSource;
    this._columns = input.columns;
    this.snapshot('input');
    return this;
  }

  /** Set dataSource */
  dataSource(rows) {
    this._dataSource = rows;
    return this;
  }

  /** Set columns */
  columns(cols) {
    this._columns = cols;
    return this;
  }

  /** Set primaryKey */
  primaryKey(key) {
    this.ctx.primaryKey = key;
    return this;
  }

  /** Save snapshot */
  snapshot(name) {
    this._snapshots[name] = {
      dataSource: this._dataSource,
      columns: this._columns,
      rowPropsGetters: this._rowPropsGetters.slice()
    };
    return this;
  }

  /** @deprecated
   *  Apply an ali-react-table Table transform */
  useTransform(transform) {
    const next = transform({
      dataSource: this.getDataSource(),
      columns: this.getColumns()
    });
    return this.dataSource(next.dataSource).columns(next.columns);
  }

  /** Use a pipeline extension step */
  use(step) {
    return step(this);
  }

  /** Transform dataSource */
  mapDataSource(mapper) {
    return this.dataSource(mapper(this.getDataSource()));
  }

  /** Transform columns */
  mapColumns(mapper) {
    return this.columns(mapper(this.getColumns()));
  }

  /** Get BaseTable props; result includes dataSource, columns, primaryKey, and getRowProps */
  getProps() {
    const result = {
      dataSource: this._dataSource,
      // originData: this._originData,
      columns: this._columns
    };
    if (this.ctx.primaryKey) {
      result.primaryKey = this.ctx.primaryKey;
    }
    if (this._rowPropsGetters.length > 0) {
      result.getRowProps = (row, rowIndex) => {
        return this._rowPropsGetters.reduce((res, get) => {
          // return {}
          // const abc  = mergeCellProps(res, get?.(row, rowIndex) as any)
          // return abc
          return mergeCellProps(res, get?.(row, rowIndex));
        }, {});
      };
    }
    return result;
  }
}
export function useTablePipeline(ctx) {
  const [state, setState] = useState({});
  return new TablePipeline({
    state,
    setState,
    ctx: ctx
  });
}