GridController.js

  async handleRowSelect(row) {
    await this.selectRow(row ? row.id : null)
  }

  async handleRowMultiselect(row) {
    const { multiselectedRows } = this.context.getState()

    if (row) {
      const newMultiselectedRows = { ...multiselectedRows }

      if (newMultiselectedRows[row.id]) {
        delete newMultiselectedRows[row.id]
      } else {
        newMultiselectedRows[row.id] = true
      }

      await this.multiselectRows(Object.keys(newMultiselectedRows))
    }
  }

  async handleMultiselectAllRowsChange() {
    const { rows, multiselectedRows } = this.context.getState()

    const rowIds = rows.map(row => String(row.id))
    const multiselectedRowIds = Object.keys(multiselectedRows)

    let newMultiselectedRowIds = null
    if (_.difference(rowIds, multiselectedRowIds).length === 0) {
      newMultiselectedRowIds = _.difference(multiselectedRowIds, rowIds)
    } else {
      newMultiselectedRowIds = _.union(multiselectedRowIds, rowIds)
    }
    this.multiselectRows(newMultiselectedRowIds)
  }

  async handleMultiselectionClear() {
    this.multiselectRows([])
  }

  async handleExecuteAction(action) {
    if (action && action.execute) {
      const { multiselectedRows } = this.context.getState()
      action.execute({ multiselectedRows })
    }
  }

  async handleExport() {
    const exportable = this.getExportable()

    if (!exportable) {
      return
    } else if (exportable.fileFormat === GridExportOptions.FILE_FORMAT.TSV) {
      await this.handleExportTSV(exportable)
    } else if (exportable.fileFormat === GridExportOptions.FILE_FORMAT.XLS) {
      await this.handleExportXLS(exportable)
    }
  }

  async handleExportTSV(exportable) {
    const _this = this
    const state = this.context.getState()
    const props = this.context.getProps()

    function _stringToUtf16ByteArray(str) {
      var bytes = []
      bytes.push(255, 254)
      for (var i = 0; i < str.length; ++i) {
        var charCode = str.charCodeAt(i)
        bytes.push(charCode & 0xff) //low byte
        bytes.push((charCode & 0xff00) >>> 8) //high byte (might be 0)
      }
      return bytes
    }

    function _getFileName(prefix) {
      const now = new Date()
      const year = String(now.getFullYear()).padStart(4, '0')
      const month = String(now.getMonth() + 1).padStart(2, '0')
      const day = String(now.getDate()).padStart(2, '0')
      const hours = String(now.getHours()).padStart(2, '0')
      const minutes = String(now.getMinutes()).padStart(2, '0')
      const seconds = String(now.getSeconds()).padStart(2, '0')
      const millis = String(now.getMilliseconds()).padStart(3, '0')

      return (
        prefix +
        '.' +
        year +
        '-' +
        month +
        '-' +
        day +
        '-' +
        hours +
        '-' +
        minutes +
        '-' +
        seconds +
        '-' +
        millis +
        '.tsv'
      )
    }

    async function _getExportedRows() {
      const { exportOptions } = state

      var exportedRows = []

      if (exportOptions.rows === GridExportOptions.ROWS.ALL_PAGES) {
        if (state.local) {
          exportedRows = state.sortedRows
        } else if (props.loadRows) {
          const loadedResult = await props.loadRows({
            filters: state.filters,
            globalFilter: state.globalFilter,
            page: 0,
            pageSize: 1000000,
            sortings: state.sortings
          })
          exportedRows = loadedResult.rows
        }
      } else if (exportOptions.rows === GridExportOptions.ROWS.CURRENT_PAGE) {
        exportedRows = state.rows
      } else if (exportOptions.rows === GridExportOptions.ROWS.SELECTED_ROWS) {
        exportedRows = Object.values(state.multiselectedRows).map(
          selectedRow => selectedRow.data
        )
      } else {
        throw Error('Unsupported rows option: ' + exportOptions.rows)
      }

      return exportedRows
    }

    async function _getExportedColumns(exportedRows) {
      const { exportOptions } = state

      var exportedColumns = []

      if (exportOptions.columns === GridExportOptions.COLUMNS.ALL) {
        exportedColumns = _this.getAllColumns()
      } else if (exportOptions.columns === GridExportOptions.COLUMNS.VISIBLE) {
        const { newAllColumns, newColumnsVisibility, newColumnsSorting } =
          await _this._loadColumns(
            exportedRows,
            state.columnsVisibility,
            state.columnsSorting
          )
        _this._sortColumns(newAllColumns, newColumnsSorting)
        exportedColumns = newAllColumns.filter(
          column => newColumnsVisibility[column.name]
        )
      } else {
        throw Error('Unsupported columns option: ' + exportOptions.columns)
      }

      return exportedColumns.filter(column => column.exportable)
    }

    function _exportTSV(rows, columns) {
      const { exportOptions } = state

      const headers = columns.map(column =>
        !_.isEmpty(column.label) ? column.label : column.name
      )

      const arrayOfRowArrays = []
      arrayOfRowArrays.push(headers)

      rows.forEach(row => {
        var rowAsArray = []
        columns.forEach(column => {
          var rowValue = column.getValue({
            row,
            column,
            operation: 'export',
            exportOptions
          })
          if (_.isNil(rowValue)) {
            rowValue = ''
          } else {
            var specialCharsRemover = document.createElement('textarea')
            specialCharsRemover.innerHTML = rowValue
            rowValue = specialCharsRemover.value //Removes special HTML Chars
            rowValue = String(rowValue).replace(/\r?\n|\r|\t/g, ' ') //Remove carriage returns and tabs

            if (exportOptions.values === GridExportOptions.VALUES.RICH_TEXT) {
              // do nothing with the value
            } else if (
              exportOptions.values === GridExportOptions.VALUES.PLAIN_TEXT
            ) {
              rowValue = String(rowValue).replace(/<(?:.|\n)*?>/gm, '')
            } else {
              throw Error('Unsupported values option: ' + exportOptions.values)
            }
          }
          rowAsArray.push(rowValue)
        })
        arrayOfRowArrays.push(rowAsArray)
      })

      stringify(
        {
          header: false,
          delimiter: '\t',
          quoted: false
        },
        arrayOfRowArrays,
        function (err, tsv) {
          var utf16bytes = _stringToUtf16ByteArray(tsv)
          var utf16bytesArray = new Uint8Array(utf16bytes.length)
          utf16bytesArray.set(utf16bytes, 0)
          var blob = new Blob([utf16bytesArray], {
            type: 'text/tsv;charset=UTF-16LE;'
          })
          FileSaver.saveAs(blob, _getFileName(exportable.filePrefix))
        }
      )
    }

    try {
      this.context.setState({
        exportState: {
          loading: true
        }
      })

      const exportedRows = await _getExportedRows()
      const exportedColumns = await _getExportedColumns(exportedRows)

      _exportTSV(exportedRows, exportedColumns)

      this.context.setState({
        exportState: null
      })
    } catch (e) {
      this.context.setState({
        exportState: {
          error: e
        }
      })
    }
  }

  async handleExportXLS(exportable) {
    const _this = this
    const state = this.context.getState()
    const props = this.context.getProps()

    if (!props.exportXLS) {
      console.error(
        'Missing exportXLS callback function for grid with id: ' + props.id
      )
      return
    }

    async function _getExportedRows() {
      const { exportOptions } = state

      let exportedRows = []

      if (exportOptions.rows === GridExportOptions.ROWS.ALL_PAGES) {
        if (state.local) {
          exportedRows = state.sortedRows
        } else if (props.loadRows) {
          const columns = {}

          state.allColumns.forEach(column => {
            columns[column.name] = column
          })

          const loadedResult = await props.loadRows({
            columns: columns,
            filterMode: state.filterMode,
            filters: state.filters,
            globalFilter: state.globalFilter,
            page: 0,
            pageSize: 1000000,
            sortings: state.sortings
          })
          exportedRows = loadedResult.rows
        }
      } else if (exportOptions.rows === GridExportOptions.ROWS.CURRENT_PAGE) {
        exportedRows = state.rows
      } else if (exportOptions.rows === GridExportOptions.ROWS.SELECTED_ROWS) {
        exportedRows = Object.values(state.multiselectedRows).map(
          selectedRow => selectedRow.data
        )
      } else {
        throw Error('Unsupported rows option: ' + exportOptions.columns)
      }

      if (exportedRows.some(row => _.isEmpty(row.exportableId))) {
        throw Error(
          "Some of the rows to be exported do not have 'exportableId' set."
        )
      }

      return exportedRows
    }

    async function _getExportedFields(exportedRows) {
      const { exportOptions, pageSize } = state

      let result = {}

      if (exportOptions.columns === GridExportOptions.COLUMNS.ALL) {
        result = {}
      } else if (exportOptions.columns === GridExportOptions.COLUMNS.VISIBLE) {
        const exportableFieldsMap = {}
        const exportableFieldsList = []

        // find visible exportable columns for the exported rows (do it page by page to get exactly the same columns as if it was done in the UI by a user)
        const exportedRowsPages = _.chunk(exportedRows, pageSize)
        for (
          let pageIndex = 0;
          pageIndex < exportedRowsPages.length;
          pageIndex++
        ) {
          const { newAllColumns, newColumnsVisibility, newColumnsSorting } =
            await _this._loadColumns(
              exportedRowsPages[pageIndex],
              state.columnsVisibility,
              state.columnsSorting
            )

          _this._sortColumns(newAllColumns, newColumnsSorting)

          newAllColumns.forEach(column => {
            if (
              !exportableFieldsMap[column.name] &&
              column.exportableField &&
              newColumnsVisibility[column.name]
            ) {
              exportableFieldsMap[column.name] = true
              exportableFieldsList.push(column.exportableField)
            }
          })
        }

        // build exported fields map: { kind: { type: [{ type: "PROPERTY/ATTRIBUTE", id: "propertyCode/attributeCode"}, ...], ... }, ... }

        const TYPE_KINDS = {
          [GridExportOptions.EXPORTABLE_KIND.SAMPLE_TYPE]: true,
          [GridExportOptions.EXPORTABLE_KIND.EXPERIMENT_TYPE]: true,
          [GridExportOptions.EXPORTABLE_KIND.DATASET_TYPE]: true,
          [GridExportOptions.EXPORTABLE_KIND.VOCABULARY_TYPE]: true
        }

        exportedRows.forEach(exportedRow => {
          let { exportable_kind, type_perm_id } = exportedRow.exportableId

          if (!_.isNil(exportable_kind)) {
            if (TYPE_KINDS[exportable_kind]) {
              type_perm_id = exportable_kind
              exportable_kind = 'TYPE'
            }

            let exportedFieldsForKind = result[exportable_kind]

            if (_.isNil(exportedFieldsForKind)) {
              result[exportable_kind] = exportedFieldsForKind = {}
            }

            if (!_.isNil(type_perm_id)) {
              exportedFieldsForKind[type_perm_id] = exportableFieldsList
            }
          }
        })
      } else {
        throw Error('Unsupported columns option: ' + exportOptions.columns)
      }

      return result
    }

    try {
      this.context.setState({
        exportState: {
          loading: true
        }
      })

      const exportedRows = await _getExportedRows()
      const exportedFields = await _getExportedFields(exportedRows)
      const exportedIds = exportedRows.map(row => row.exportableId)

      const { sessionToken, exportResult } = await props.exportXLS({
        exportedFilePrefix: exportable.filePrefix,
        exportedFileContent: exportable.fileContent,
        exportedIds: exportedIds,
        exportedFields: exportedFields,
        exportedValues: state.exportOptions.values,
        exportedImportCompatible: state.exportOptions.importCompatible,
        exportedReferredMasterData:
          exportable.fileContent === GridExportOptions.FILE_CONTENT.TYPES &&
          state.exportOptions.includeDependencies
      })

      if (exportResult.status === 'OK') {
        const filePath = exportResult.result.file_name
        const fileName = filePath.substring(filePath.lastIndexOf('/') + 1)
        const fileUrl =
          '/openbis/openbis/download/?sessionID=' +
          encodeURIComponent(sessionToken) +
          '&filePath=' +
          encodeURIComponent(filePath)

        if (!_.isEmpty(exportResult.result.warnings)) {
          this.context.setState({
            exportState: {
              warnings: exportResult.result.warnings,
              fileName,
              fileUrl
            }
          })
        } else {
          this.context.setState({
            exportState: null
          })
          this.handleExportDownload(fileName, fileUrl)
        }
      } else if (exportResult.status === 'error') {
        this.context.setState({
          exportState: {
            error: exportResult.message
          }
        })
      } else {
        this.context.setState({
          exportState: {
            error: JSON.stringify(exportResult)
          }
        })
      }
    } catch (e) {
      this.context.setState({
        exportState: {
          error: e
        }
      })
    }
  }

  handleExportDownload(fileName, fileUrl) {
    this.context.setState({
      exportState: null
    })
    const link = document.createElement('a')
    link.href = fileUrl
    link.download = fileName
    link.click()
  }

  handleExportCancel() {
    this.context.setState({
      exportState: null
    })
  }

  async handleExportOptionsChange(exportOptions) {
    await this.context.setState(() => ({
      exportOptions
    }))
    await this._saveSettings()
  }

  async handleMeasured(cellRef, column, row) {
    if (!this.measureQueue) {
      this.measureQueue = []
    }

    this.measureQueue.push({
      cellRef,
      column,
      row
    })

    if (this.measureTimeoutId) {
      clearTimeout(this.measureTimeoutId)
    }

    this.measureTimeoutId = setTimeout(() => {
      this.context.setState(state => {
        const heights = state.heights
        let newHeights = heights

        this.measureQueue.forEach(measureItem => {
          const rowHeights = heights[measureItem.row.id]
          let newRowHeights = newHeights[measureItem.row.id] || rowHeights

          if (measureItem.cellRef.current) {
            const height = rowHeights
              ? rowHeights[measureItem.column.name]
              : null
            const newHeight = measureItem.cellRef.current.scrollHeight

            if (newHeight !== height) {
              if (newHeights === heights) {
                newHeights = {
                  ...heights
                }
              }
              if (newRowHeights === rowHeights) {
                newRowHeights = {
                  ...rowHeights
                }
                newHeights[measureItem.row.id] = newRowHeights
              }
              newRowHeights[measureItem.column.name] = newHeight
            }
          }
        })
        return {
          heights: newHeights
        }
      })
      this.measureQueue = []
    }, 500)
  }

  getAllColumns() {
    const { allColumns, columnsSorting } = this.context.getState()

    let columns = [...allColumns]
    this._sortColumns(columns, columnsSorting)

    return this._getCachedValue('allColumns', columns)
  }

  getVisibleColumns() {
    const { allColumns, columnsSorting, columnsVisibility } =
      this.context.getState()

    let columns = [...allColumns]
    columns = columns.filter(column => columnsVisibility[column.name])
    this._sortColumns(columns, columnsSorting)

    return this._getCachedValue('visibleColumns', columns)
  }

  getPage() {
    const { page } = this.context.getState()
    return page
  }

  getPageSize() {
    const { pageSize } = this.context.getState()
    return pageSize
  }

  getSortings() {
    const { sortings } = this.context.getState()
    return sortings
  }

  getFilters() {
    const { filters } = this.context.getState()
    return filters
  }

  getGlobalFilter() {
    const { globalFilter } = this.context.getState()
    return globalFilter
  }

  getRows() {
    const { rows } = this.context.getState()
    return rows
  }

  getSelectedRow() {
    const { selectedRow } = this.context.getState()
    return selectedRow
  }

  getMultiselectedRows() {
    const { multiselectedRows } = this.context.getState()
    return multiselectedRows
  }

  getTotalCount() {
    const { totalCount } = this.context.getState()
    return totalCount
  }

  getExportable() {
    const { exportable } = this.context.getProps()

    if (exportable !== undefined) {
      return exportable
    } else {
      return null
    }
  }

  _getCachedValue(key, newValue) {
    if (_.isEqual(this.cache[key], newValue)) {
      return this.cache[key]
    } else {
      this.cache[key] = newValue
      return newValue
    }
  }

  _getObjectValue(value) {
    return _.isObject(value) ? value : undefined
  }

  _getArrayValue(value) {
    return _.isArray(value) ? value : undefined
  }

  _getStringValue(value) {
    return _.isString(value) ? value : undefined
  }

  _getEnumValue(value, allowedValues) {
    return _.includes(allowedValues, value) ? value : undefined
  }

  _getBooleanValue(value) {
    return _.isBoolean(value) ? value : undefined
  }

  _isEmpty(value) {
    return (
      value === null ||
      value === undefined ||
      (_.isString(value) && value.trim().length === 0)
    )
  }

  _split(str) {
    return str.split(' ').filter(token => !this._isEmpty(token))
  }

  _onError(error) {
    const { onError } = this.context.getProps()
    if (onError) {
      onError(error)
    }
    throw error
  }
}