export function ReportDefinitions()

in dashboards-reports/public/components/main/report_definitions_table.tsx [82:214]


export function ReportDefinitions(props) {
  const { pagination, reportDefinitionsTableContent } = props;

  const [sortField, setSortField] = useState('lastUpdated');
  const [sortDirection, setSortDirection] = useState('des');

  const sorting = {
    sort: {
      field: sortField,
      direction: sortDirection,
    },
  };

  const getDefinitionTableItemId = (name) => {
    let index;
    for (
      index = 0;
      index < props.reportDefinitionsTableContent.length;
      ++index
    ) {
      if (name === reportDefinitionsTableContent[index].reportName) {
        return reportDefinitionsTableContent[index].id;
      }
    }
  };

  const navigateToDefinitionDetails = (name: any) => {
    let id = getDefinitionTableItemId(name);
    window.location.assign(
      `reports-dashboards#/report_definition_details/${id}`
    );
  };

  const reportDefinitionsColumns = [
    {
      field: 'reportName',
      name: i18n.translate(
        'opensearch.reports.reportDefinitionsTable.columns.name',
        {
          defaultMessage: 'Name',
        }
      ),
      render: (name) => (
        <EuiLink
          onClick={() => navigateToDefinitionDetails(name)}
          id={'reportDefinitionDetailsLink'}
        >
          {name}
        </EuiLink>
      ),
    },
    {
      field: 'source',
      name: i18n.translate(
        'opensearch.reports.reportDefinitionsTable.columns.source',
        { defaultMessage: 'Source' }
      ),
      render: (value, item) => (
        <EuiLink href={item.baseUrl} target="_blank">
          {value}
        </EuiLink>
      ),
    },
    {
      field: 'type',
      name: i18n.translate(
        'opensearch.reports.reportDefinitionsTable.columns.type',
        {
          defaultMessage: 'Type',
        }
      ),
      sortable: true,
      truncateText: false,
    },
    {
      field: 'details',
      name: i18n.translate(
        'opensearch.reports.reportDefinitionsTable.columns.scheduleDetails',
        { defaultMessage: 'Schedule details' }
      ),
      sortable: false,
      truncateText: true,
    },
    {
      field: 'lastUpdated',
      name: i18n.translate(
        'opensearch.reports.reportDefinitionsTable.columns.lastUpdated',
        { defaultMessage: 'Last Updated' }
      ),
      render: (date) => {
        let readable = humanReadableDate(date);
        return <EuiText size="s">{readable}</EuiText>;
      },
    },
    {
      field: 'status',
      name: i18n.translate(
        'opensearch.reports.reportDefinitionsTable.columns.status',
        { defaultMessage: 'Status' }
      ),
      sortable: true,
      truncateText: false,
    },
  ];

  const displayMessage =
    reportDefinitionsTableContent.length === 0
      ? emptyMessageReportDefinitions
      : i18n.translate(
          'opensearch.reports.reportDefinitionsTable.emptyMessageReports.noDefinitionsFound',
          {
            defaultMessage:
              '0 report definitions match the search criteria. Search again.',
          }
        );

  return (
    <div>
      <EuiInMemoryTable
        items={reportDefinitionsTableContent}
        itemId="id"
        loading={false}
        message={displayMessage}
        columns={reportDefinitionsColumns}
        search={reportDefinitionsSearch}
        pagination={pagination}
        sorting={sorting}
        isSelectable={true}
        tableLayout={'auto'}
      />
    </div>
  );
}