katello 3.7.0.rc1 → 3.7.0.rc2

data/webpack/move_to_foreman/components/common/table/components/CollapseSubscriptionGroupButton.test.js

@@ -0,0 +1,16 @@
+import { testComponentSnapshotsWithFixtures } from '../../../../../move_to_pf/test-utils/testHelpers';
+
+import CollapseSubscriptionGroupButton from './CollapseSubscriptionGroupButton';
+
+const fixtures = {
+  'renders CollapseSubscriptionGroupButton collapsed': {
+    collapsed: true,
+    onClick: jest.fn(),
+  },
+  'renders CollapseSubscriptionGroupButton opened': {
+    collapsed: false,
+    onClick: jest.fn(),
+  },
+};
+
+describe('CollapseSubscriptionGroupButton', () => testComponentSnapshotsWithFixtures(CollapseSubscriptionGroupButton, fixtures));

data/webpack/move_to_foreman/components/common/table/components/Table.js

@@ -0,0 +1,76 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Table as PfTable } from 'patternfly-react';
+import { noop } from 'foremanReact/common/helpers';
+import EmptyState from '../../emptyState';
+import PaginationRow from '../../../../../components/PaginationRow/index';
+
+import TableBody from './TableBody';
+
+const Table = ({
+  columns,
+  rows,
+  emptyState,
+  bodyMessage,
+  children,
+  itemCount,
+  pagination,
+  onPaginationChange,
+  ...props
+}) => {
+  if (rows.length === 0 && bodyMessage === undefined) {
+    return <EmptyState {...emptyState} />;
+  }
+
+  const shouldRenderPagination = itemCount && pagination;
+
+  const body = children || [
+    <PfTable.Header key="header" />,
+    <TableBody key="body" columns={columns} rows={rows} message={bodyMessage} rowKey="id" />,
+  ];
+
+  return (
+    <div>
+      <PfTable.PfProvider
+        columns={columns}
+        className="table-fixed"
+        striped
+        bordered
+        hover
+        {...props}
+      >
+        {body}
+      </PfTable.PfProvider>
+      {shouldRenderPagination && (
+        <PaginationRow
+          viewType="table"
+          itemCount={itemCount}
+          pagination={pagination}
+          onChange={onPaginationChange}
+        />
+      )}
+    </div>
+  );
+};
+
+Table.propTypes = {
+  columns: PropTypes.arrayOf(PropTypes.object).isRequired,
+  rows: PropTypes.arrayOf(PropTypes.object).isRequired,
+  emptyState: PropTypes.object, // eslint-disable-line react/forbid-prop-types
+  pagination: PropTypes.object, // eslint-disable-line react/forbid-prop-types
+  bodyMessage: PropTypes.node,
+  children: PropTypes.node,
+  itemCount: PropTypes.number,
+  onPaginationChange: PropTypes.func,
+};
+
+Table.defaultProps = {
+  emptyState: undefined,
+  pagination: undefined,
+  bodyMessage: undefined,
+  children: undefined,
+  itemCount: undefined,
+  onPaginationChange: noop,
+};
+
+export default Table;

data/webpack/move_to_foreman/components/common/table/components/Table.test.js

@@ -0,0 +1,31 @@
+import { testComponentSnapshotsWithFixtures } from '../../../../../move_to_pf/test-utils/testHelpers';
+
+import Table from './Table';
+import { columnsFixtures, rowsFixtures } from './TableFixtures';
+
+const fixtures = {
+  'renders Table with emptyState': {
+    columns: columnsFixtures,
+    rows: [],
+    emptyState: { empty: 'state' },
+  },
+  'renders Table with children': {
+    columns: columnsFixtures,
+    rows: rowsFixtures,
+    children: 'some children',
+  },
+  'renders Table with body': {
+    columns: columnsFixtures,
+    rows: rowsFixtures,
+    bodyMessage: 'some body message',
+  },
+  'renders Table with pagination': {
+    columns: columnsFixtures,
+    rows: rowsFixtures,
+    children: 'some children',
+    itemCount: 2,
+    pagination: { page: 1, perPage: 20 },
+  },
+};
+
+describe('Table', () => testComponentSnapshotsWithFixtures(Table, fixtures));

data/webpack/move_to_foreman/components/common/table/components/TableBody.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Table as PfTable } from 'patternfly-react';
+
+import TableBodyMessage from './TableBodyMessage';
+
+const TableBody = ({
+  columns, rows, message, ...props
+}) => {
+  if (message) {
+    return <TableBodyMessage colSpan={columns.length}>{message}</TableBodyMessage>;
+  }
+
+  return <PfTable.Body rows={rows} rowKey={({ rowIndex }) => rowIndex} {...props} />;
+};
+
+TableBody.propTypes = {
+  columns: PropTypes.arrayOf(PropTypes.object).isRequired,
+  rows: PropTypes.arrayOf(PropTypes.object).isRequired,
+  message: PropTypes.string,
+};
+
+TableBody.defaultProps = {
+  message: '',
+};
+
+export default TableBody;

data/webpack/move_to_foreman/components/common/table/components/TableBody.test.js

@@ -0,0 +1,18 @@
+import { testComponentSnapshotsWithFixtures } from '../../../../../move_to_pf/test-utils/testHelpers';
+
+import TableBody from './TableBody';
+import { columnsFixtures, rowsFixtures } from './TableFixtures';
+
+const fixtures = {
+  'renders TableBody': {
+    columns: columnsFixtures,
+    rows: rowsFixtures,
+  },
+  'renders TableBody with message': {
+    columns: columnsFixtures,
+    rows: rowsFixtures,
+    message: 'some message',
+  },
+};
+
+describe('TableBody', () => testComponentSnapshotsWithFixtures(TableBody, fixtures));

data/webpack/move_to_foreman/components/common/table/components/TableBodyMessage.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const TableBodyMessage = ({ colSpan, children }) => (
+  <tbody>
+    <tr>
+      <td colSpan={colSpan}>{children}</td>
+    </tr>
+  </tbody>
+);
+
+TableBodyMessage.propTypes = {
+  colSpan: PropTypes.number.isRequired,
+  children: PropTypes.node.isRequired,
+};
+
+
+export default TableBodyMessage;

data/webpack/move_to_foreman/components/common/table/components/TableBodyMessage.test.js

@@ -0,0 +1,12 @@
+import { testComponentSnapshotsWithFixtures } from '../../../../../move_to_pf/test-utils/testHelpers';
+
+import TableBodyMessage from './TableBodyMessage';
+
+const fixtures = {
+  'renders TableBodyMessage': {
+    colSpan: 2,
+    children: 'some children',
+  },
+};
+
+describe('TableBodyMessage', () => testComponentSnapshotsWithFixtures(TableBodyMessage, fixtures));

data/webpack/move_to_foreman/components/common/table/components/TableFixtures.js

@@ -0,0 +1,14 @@
+// see: https://reactabular.js.org/#/column-definition
+export const columnsFixtures = [{
+  property: 'id',
+  header: {
+    label: 'ID',
+  },
+}, {
+  property: 'data',
+  header: {
+    label: 'Data',
+  },
+}];
+
+export const rowsFixtures = [{ id: 1, data: 'data-1' }, { id: 2, data: 'data-2' }];

data/webpack/move_to_foreman/components/common/table/components/TableSelectionCell.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Table } from 'patternfly-react';
+import { noop } from 'foremanReact/common/helpers';
+
+const TableSelectionCell = ({
+  id, before, after, label, checked, onChange, ...props
+}) => (
+  <Table.SelectionCell>
+    {before}
+    <Table.Checkbox
+      id={id}
+      label={label}
+      checked={checked}
+      onChange={onChange}
+      {...props}
+    />
+    {after}
+  </Table.SelectionCell>
+);
+
+TableSelectionCell.propTypes = {
+  id: PropTypes.string.isRequired,
+  before: PropTypes.node,
+  after: PropTypes.node,
+  label: PropTypes.string,
+  checked: PropTypes.bool,
+  onChange: PropTypes.func,
+};
+
+TableSelectionCell.defaultProps = {
+  before: null,
+  after: null,
+  label: __('Select row'),
+  checked: false,
+  onChange: noop,
+};
+
+export default TableSelectionCell;

data/webpack/move_to_foreman/components/common/table/components/TableSelectionCell.test.js

@@ -0,0 +1,16 @@
+import { testComponentSnapshotsWithFixtures } from '../../../../../move_to_pf/test-utils/testHelpers';
+
+import TableSelectionCell from './TableSelectionCell';
+
+const fixtures = {
+  'renders TableSelectionCell': {
+    id: 'some id',
+    before: 'some before',
+    after: 'some after',
+    label: 'some label',
+    checked: true,
+    onChange: jest.fn(),
+  },
+};
+
+describe('TableSelectionCell', () => testComponentSnapshotsWithFixtures(TableSelectionCell, fixtures));

data/webpack/move_to_foreman/components/common/table/components/TableSelectionHeaderCell.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Table } from 'patternfly-react';
+import { noop } from 'foremanReact/common/helpers';
+
+const TableSelectionHeaderCell = ({
+  id, label, checked, onChange, ...props
+}) => (
+  <Table.SelectionHeading aria-label={label}>
+    <Table.Checkbox
+      id={id}
+      label={label}
+      checked={checked}
+      onChange={onChange}
+      {...props}
+    />
+  </Table.SelectionHeading>
+);
+
+TableSelectionHeaderCell.propTypes = {
+  id: PropTypes.string,
+  label: PropTypes.string,
+  checked: PropTypes.bool,
+  onChange: PropTypes.func,
+};
+
+TableSelectionHeaderCell.defaultProps = {
+  id: 'selectAll',
+  label: '',
+  checked: false,
+  onChange: noop,
+};
+
+export default TableSelectionHeaderCell;

data/webpack/move_to_foreman/components/common/table/components/TableSelectionHeaderCell.test.js

@@ -0,0 +1,14 @@
+import { testComponentSnapshotsWithFixtures } from '../../../../../move_to_pf/test-utils/testHelpers';
+
+import TableSelectionHeaderCell from './TableSelectionHeaderCell';
+
+const fixtures = {
+  'renders TableSelectionHeaderCell': {
+    id: 'some id',
+    label: 'some label',
+    checked: true,
+    onChange: jest.fn(),
+  },
+};
+
+describe('TableSelectionHeaderCell', () => testComponentSnapshotsWithFixtures(TableSelectionHeaderCell, fixtures));

data/webpack/move_to_foreman/components/common/table/components/__snapshots__/CollapseSubscriptionGroupButton.test.js.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CollapseSubscriptionGroupButton renders CollapseSubscriptionGroupButton collapsed 1`] = `
+<Icon
+  className="collapse-subscription-group-button"
+  name="angle-right"
+  onClick={[Function]}
+  type="fa"
+/>
+`;
+
+exports[`CollapseSubscriptionGroupButton renders CollapseSubscriptionGroupButton opened 1`] = `
+<Icon
+  className="collapse-subscription-group-button"
+  name="angle-down"
+  onClick={[Function]}
+  type="fa"
+/>
+`;

data/webpack/move_to_foreman/components/common/table/components/__snapshots__/Table.test.js.snap

@@ -0,0 +1,167 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Table renders Table with body 1`] = `
+<div>
+  <TablePfProvider
+    bordered={true}
+    className="table-fixed"
+    columns={
+      Array [
+        Object {
+          "header": Object {
+            "label": "ID",
+          },
+          "property": "id",
+        },
+        Object {
+          "header": Object {
+            "label": "Data",
+          },
+          "property": "data",
+        },
+      ]
+    }
+    components={Object {}}
+    condensed={false}
+    dataTable={false}
+    hover={true}
+    inlineEdit={false}
+    striped={true}
+  >
+    <Header
+      key="header"
+    />
+    <TableBody
+      columns={
+        Array [
+          Object {
+            "header": Object {
+              "label": "ID",
+            },
+            "property": "id",
+          },
+          Object {
+            "header": Object {
+              "label": "Data",
+            },
+            "property": "data",
+          },
+        ]
+      }
+      key="body"
+      message="some body message"
+      rowKey="id"
+      rows={
+        Array [
+          Object {
+            "data": "data-1",
+            "id": 1,
+          },
+          Object {
+            "data": "data-2",
+            "id": 2,
+          },
+        ]
+      }
+    />
+  </TablePfProvider>
+</div>
+`;
+
+exports[`Table renders Table with children 1`] = `
+<div>
+  <TablePfProvider
+    bordered={true}
+    className="table-fixed"
+    columns={
+      Array [
+        Object {
+          "header": Object {
+            "label": "ID",
+          },
+          "property": "id",
+        },
+        Object {
+          "header": Object {
+            "label": "Data",
+          },
+          "property": "data",
+        },
+      ]
+    }
+    components={Object {}}
+    condensed={false}
+    dataTable={false}
+    hover={true}
+    inlineEdit={false}
+    striped={true}
+  >
+    some children
+  </TablePfProvider>
+</div>
+`;
+
+exports[`Table renders Table with emptyState 1`] = `
+<EmptyState
+  empty="state"
+/>
+`;
+
+exports[`Table renders Table with pagination 1`] = `
+<div>
+  <TablePfProvider
+    bordered={true}
+    className="table-fixed"
+    columns={
+      Array [
+        Object {
+          "header": Object {
+            "label": "ID",
+          },
+          "property": "id",
+        },
+        Object {
+          "header": Object {
+            "label": "Data",
+          },
+          "property": "data",
+        },
+      ]
+    }
+    components={Object {}}
+    condensed={false}
+    dataTable={false}
+    hover={true}
+    inlineEdit={false}
+    striped={true}
+  >
+    some children
+  </TablePfProvider>
+  <PaginationRow
+    className=""
+    dropdownButtonId="pagination-row-dropdown"
+    itemCount={2}
+    messages={
+      Object {
+        "currentPage": "Current Page",
+        "firstPage": "First Page",
+        "lastPage": "Last Page",
+        "nextPage": "Next Page",
+        "of": "of",
+        "perPage": "per page",
+        "previousPage": "Previous Page",
+      }
+    }
+    onChange={[Function]}
+    onPageSet={[Function]}
+    onPerPageSelect={[Function]}
+    pagination={
+      Object {
+        "page": 1,
+        "perPage": 20,
+      }
+    }
+    viewType="table"
+  />
+</div>
+`;