render()

in public/pages/Monitors/components/AcknowledgeModal/AcknowledgeModal.js [58:117]

• 56 lines of code
• 1 McCabe index (conditional complexity)

  render() {
    const { alerts, totalAlerts } = this.props;

    const columns = [
      {
        field: 'monitor_name',
        name: 'Monitor',
        truncateText: true,
      },
      {
        field: 'trigger_name',
        name: 'Trigger',
        truncateText: true,
      },
      {
        field: 'start_time',
        name: 'Start Time',
        truncateText: false,
        render: this.renderTime,
      },
      {
        field: 'severity',
        name: 'Severity',
        align: 'right',
        truncateText: false,
      },
    ];
    // TODO: Acknowledge loading, disable selection
    // TODO: Empty state, no active alerts found, or too many alerts found
    const selection = { onSelectionChange: this.onSelectionChange };

    return (
      <EuiOverlayMask>
        <EuiConfirmModal
          title="Acknowledge Alerts"
          maxWidth={650}
          onCancel={this.props.onClickCancel}
          onConfirm={this.onConfirm}
          cancelButtonText="cancel"
          confirmButtonText="Acknowledge"
        >
          <p>Select which alerts to acknowledge.</p>
          <EuiInMemoryTable
            items={alerts}
            itemId="id"
            columns={columns}
            isSelectable={true}
            selection={selection}
            onTableChange={this.onTableChange}
            style={{
              // TODO: Move to classname
              borderTop: '1px solid #D9D9D9',
              borderLeft: '1px solid #D9D9D9',
              borderRight: '1px solid #D9D9D9',
            }}
          />
        </EuiConfirmModal>
      </EuiOverlayMask>
    );
  }