diff --git a/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx b/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx
index 617f7cd51a..b620ca2fda 100644
--- a/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx
+++ b/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx
@@ -30,9 +30,11 @@ export default function ActionsTd({ children, gridColumns, ...props }) {
     >
       <ActionsGrid numActions={numActions} gridColumns={gridColumns}>
         {React.Children.map(children, (child, i) =>
-          React.cloneElement(child, {
-            column: i + 1,
-          })
+          child
+            ? React.cloneElement(child, {
+                column: i + 1,
+              })
+            : null
         )}
       </ActionsGrid>
     </Td>
diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx
index 7c304627e2..dd32c041a1 100644
--- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx
+++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx
@@ -1,12 +1,12 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { useLocation } from 'react-router-dom';
-
 import { t } from '@lingui/macro';
 import { RolesAPI, TeamsAPI, UsersAPI } from '../../api';
 import AddResourceRole from '../AddRole/AddResourceRole';
 import AlertModal from '../AlertModal';
 import DataListToolbar from '../DataListToolbar';
-import PaginatedDataList, { ToolbarAddButton } from '../PaginatedDataList';
+import PaginatedTable, { HeaderRow, HeaderCell } from '../PaginatedTable';
+import { ToolbarAddButton } from '../PaginatedDataList';
 import { getQSConfig, parseQueryString } from '../../util/qs';
 import useRequest, { useDeleteItems } from '../../util/useRequest';
 import DeleteRoleConfirmationModal from './DeleteRoleConfirmationModal';
@@ -148,7 +148,7 @@ function ResourceAccessList({ apiModel, resource }) {
 
   return (
     <>
-      <PaginatedDataList
+      <PaginatedTable
         error={contentError}
         hasContentLoading={isLoading || isDeleteLoading}
         items={accessRecords}
@@ -156,20 +156,6 @@ function ResourceAccessList({ apiModel, resource }) {
         pluralizedItemName={t`Roles`}
         qsConfig={QS_CONFIG}
         toolbarSearchColumns={toolbarSearchColumns}
-        toolbarSortColumns={[
-          {
-            name: t`Username`,
-            key: 'username',
-          },
-          {
-            name: t`First Name`,
-            key: 'first_name',
-          },
-          {
-            name: t`Last Name`,
-            key: 'last_name',
-          },
-        ]}
         toolbarSearchableKeys={searchableKeys}
         toolbarRelatedSearchableKeys={relatedSearchableKeys}
         renderToolbar={props => (
@@ -188,7 +174,15 @@ function ResourceAccessList({ apiModel, resource }) {
             }
           />
         )}
-        renderItem={accessRecord => (
+        headerRow={
+          <HeaderRow qsConfig={QS_CONFIG} isSelectable={false}>
+            <HeaderCell sortKey="username">{t`Username`}</HeaderCell>
+            <HeaderCell sortKey="first_name">{t`First name`}</HeaderCell>
+            <HeaderCell sortKey="last_name">{t`Last name`}</HeaderCell>
+            <HeaderCell>{t`Roles`}</HeaderCell>
+          </HeaderRow>
+        }
+        renderRow={(accessRecord, index) => (
           <ResourceAccessListItem
             key={accessRecord.id}
             accessRecord={accessRecord}
@@ -197,6 +191,7 @@ function ResourceAccessList({ apiModel, resource }) {
               setDeletionRole(role);
               setShowDeleteModal(true);
             }}
+            rowIndex={index}
           />
         )}
       />
diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx
index 4a2b92d124..6bcbc2b391 100644
--- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx
+++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx
@@ -137,10 +137,6 @@ describe('<ResourceAccessList />', () => {
     jest.clearAllMocks();
   });
 
-  test('initially renders successfully', () => {
-    expect(wrapper.find('PaginatedDataList')).toHaveLength(1);
-  });
-
   test('should fetch and display access records on mount', async () => {
     await waitForElement(wrapper, 'ContentLoading', el => el.length === 0);
     expect(OrganizationsAPI.readAccessList).toHaveBeenCalled();
@@ -203,7 +199,7 @@ describe('<ResourceAccessList />', () => {
     await waitForElement(wrapper, 'ContentLoading', el => el.length === 0);
 
     expect(
-      wrapper.find('PaginatedDataList').prop('toolbarSearchColumns')
+      wrapper.find('PaginatedTable').prop('toolbarSearchColumns')
     ).toStrictEqual([
       { isDefault: true, key: 'username__icontains', name: 'Username' },
       { key: 'first_name__icontains', name: 'First Name' },
diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.jsx
index 24b9f11fd4..cf119f0953 100644
--- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.jsx
+++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.jsx
@@ -1,29 +1,15 @@
 import 'styled-components/macro';
 import React from 'react';
 import { func } from 'prop-types';
-
 import { t } from '@lingui/macro';
-import {
-  Chip,
-  DataListItem,
-  DataListItemRow,
-  DataListItemCells as PFDataListItemCells,
-  Text,
-  TextContent,
-  TextVariants,
-} from '@patternfly/react-core';
+import { Chip } from '@patternfly/react-core';
+import { Tr, Td } from '@patternfly/react-table';
 import { Link } from 'react-router-dom';
-import styled from 'styled-components';
-import DataListCell from '../DataListCell';
 
 import ChipGroup from '../ChipGroup';
 import { DetailList, Detail } from '../DetailList';
 import { AccessRecord } from '../../types';
 
-const DataListItemCells = styled(PFDataListItemCells)`
-  align-items: start;
-`;
-
 function ResourceAccessListItem({ accessRecord, onRoleDelete }) {
   ResourceAccessListItem.propTypes = {
     accessRecord: AccessRecord.isRequired,
@@ -67,70 +53,43 @@ function ResourceAccessListItem({ accessRecord, onRoleDelete }) {
   const [teamRoles, userRoles] = getRoleLists();
 
   return (
-    <DataListItem
-      aria-labelledby="access-list-item"
-      key={accessRecord.id}
-      id={`${accessRecord.id}`}
-    >
-      <DataListItemRow>
-        <DataListItemCells
-          dataListCells={[
-            <DataListCell key="name">
-              {accessRecord.username && (
-                <TextContent>
-                  {accessRecord.id ? (
-                    <Text component={TextVariants.h6}>
-                      <Link
-                        to={{ pathname: `/users/${accessRecord.id}/details` }}
-                        css="font-weight: bold"
-                      >
-                        {accessRecord.username}
-                      </Link>
-                    </Text>
-                  ) : (
-                    <Text component={TextVariants.h6} css="font-weight: bold">
-                      {accessRecord.username}
-                    </Text>
-                  )}
-                </TextContent>
-              )}
-              {accessRecord.first_name || accessRecord.last_name ? (
-                <DetailList stacked>
-                  <Detail
-                    label={t`Name`}
-                    value={`${accessRecord.first_name} ${accessRecord.last_name}`}
-                  />
-                </DetailList>
-              ) : null}
-            </DataListCell>,
-            <DataListCell key="roles">
-              <DetailList stacked>
-                {userRoles.length > 0 && (
-                  <Detail
-                    label={t`User Roles`}
-                    value={
-                      <ChipGroup numChips={5} totalChips={userRoles.length}>
-                        {userRoles.map(renderChip)}
-                      </ChipGroup>
-                    }
-                  />
-                )}
-                {teamRoles.length > 0 && (
-                  <Detail
-                    label={t`Team Roles`}
-                    value={
-                      <ChipGroup numChips={5} totalChips={teamRoles.length}>
-                        {teamRoles.map(renderChip)}
-                      </ChipGroup>
-                    }
-                  />
-                )}
-              </DetailList>
-            </DataListCell>,
-          ]}
-        />
-      </DataListItemRow>
-    </DataListItem>
+    <Tr id={`access-item-row-${accessRecord.id}`}>
+      <Td id={`access-record-${accessRecord.id}`} dataLabel={t`Name`}>
+        {accessRecord.id ? (
+          <Link to={{ pathname: `/users/${accessRecord.id}/details` }}>
+            {accessRecord.username}
+          </Link>
+        ) : (
+          accessRecord.username
+        )}
+      </Td>
+      <Td dataLabel={t`First name`}>{accessRecord.first_name}</Td>
+      <Td dataLabel={t`Last name`}>{accessRecord.first_name}</Td>
+      <Td dataLabel={t`Roles`}>
+        <DetailList stacked>
+          {userRoles.length > 0 && (
+            <Detail
+              label={t`User Roles`}
+              value={
+                <ChipGroup numChips={5} totalChips={userRoles.length}>
+                  {userRoles.map(renderChip)}
+                </ChipGroup>
+              }
+            />
+          )}
+          {teamRoles.length > 0 && (
+            <Detail
+              label={t`Team Roles`}
+              value={
+                <ChipGroup numChips={5} totalChips={teamRoles.length}>
+                  {teamRoles.map(renderChip)}
+                </ChipGroup>
+              }
+            />
+          )}
+        </DetailList>
+      </Td>
+    </Tr>
   );
 }
 
diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx
index d6eaee2c73..43673ac576 100644
--- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx
+++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx
@@ -38,10 +38,14 @@ describe('<ResourceAccessListItem />', () => {
 
     await act(async () => {
       wrapper = mountWithContexts(
-        <ResourceAccessListItem
-          accessRecord={accessRecord}
-          onRoleDelete={() => {}}
-        />
+        <table>
+          <tbody>
+            <ResourceAccessListItem
+              accessRecord={accessRecord}
+              onRoleDelete={() => {}}
+            />
+          </tbody>
+        </table>
       );
     });
 
diff --git a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx
index 01bd808761..34bbc518a6 100644
--- a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx
+++ b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx
@@ -17,6 +17,7 @@ function HostListItem({ host, isSelected, onSelect, detailUrl, rowIndex }) {
   return (
     <Tr id={`host-row-${host.id}`}>
       <Td
+        data-cy={labelId}
         select={{
           rowIndex,
           isSelected,
diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx
index 8ebe0d604d..f5f0070f8f 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx
@@ -1,67 +1,58 @@
 import React from 'react';
 import { bool, func, number, oneOfType, string } from 'prop-types';
-
 import { t } from '@lingui/macro';
 
-import {
-  Button,
-  DataListAction,
-  DataListCheck,
-  DataListItem,
-  DataListItemCells,
-  DataListItemRow,
-  Tooltip,
-} from '@patternfly/react-core';
+import { Button } from '@patternfly/react-core';
+import { Tr, Td } from '@patternfly/react-table';
 
 import { Link } from 'react-router-dom';
 import { PencilAltIcon } from '@patternfly/react-icons';
-import DataListCell from '../../../components/DataListCell';
+import { ActionsTd, ActionItem } from '../../../components/PaginatedTable';
 import { Group } from '../../../types';
 
-function InventoryGroupItem({ group, inventoryId, isSelected, onSelect }) {
+function InventoryGroupItem({
+  group,
+  inventoryId,
+  isSelected,
+  onSelect,
+  rowIndex,
+}) {
   const labelId = `check-action-${group.id}`;
   const detailUrl = `/inventories/inventory/${inventoryId}/groups/${group.id}/details`;
   const editUrl = `/inventories/inventory/${inventoryId}/groups/${group.id}/edit`;
 
   return (
-    <DataListItem key={group.id} aria-labelledby={labelId} id={`${group.id}`}>
-      <DataListItemRow>
-        <DataListCheck
-          aria-labelledby={labelId}
-          id={`select-group-${group.id}`}
-          checked={isSelected}
-          onChange={onSelect}
-        />
-        <DataListItemCells
-          dataListCells={[
-            <DataListCell key="name">
-              <Link to={`${detailUrl}`} id={labelId}>
-                <b>{group.name}</b>
-              </Link>
-            </DataListCell>,
-          ]}
-        />
-        <DataListAction
-          aria-label={t`actions`}
-          aria-labelledby={labelId}
-          id={labelId}
+    <Tr id={`group-row-${group.id}`}>
+      <Td
+        data-cy={labelId}
+        select={{
+          rowIndex,
+          isSelected,
+          onSelect,
+        }}
+      />
+      <Td id={labelId} dataLabel={t`Name`}>
+        <Link to={`${detailUrl}`} id={labelId}>
+          <b>{group.name}</b>
+        </Link>
+      </Td>
+      <ActionsTd dataLabel={t`Actions`} gridColumns="auto 40px">
+        <ActionItem
+          visible={group.summary_fields.user_capabilities.edit}
+          tooltip={t`Edit group`}
         >
-          {group.summary_fields.user_capabilities.edit && (
-            <Tooltip content={t`Edit Group`} position="top">
-              <Button
-                ouiaId={`${group.id}-edit-button`}
-                aria-label={t`Edit Group`}
-                variant="plain"
-                component={Link}
-                to={editUrl}
-              >
-                <PencilAltIcon />
-              </Button>
-            </Tooltip>
-          )}
-        </DataListAction>
-      </DataListItemRow>
-    </DataListItem>
+          <Button
+            ouiaId={`${group.id}-edit-button`}
+            aria-label={t`Edit Group`}
+            variant="plain"
+            component={Link}
+            to={editUrl}
+          >
+            <PencilAltIcon />
+          </Button>
+        </ActionItem>
+      </ActionsTd>
+    </Tr>
   );
 }
 
diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.test.jsx
index db0b2a0bd4..3d60389513 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.test.jsx
@@ -18,12 +18,16 @@ describe('<InventoryGroupItem />', () => {
 
   beforeEach(() => {
     wrapper = mountWithContexts(
-      <InventoryGroupItem
-        group={mockGroup}
-        inventoryId={1}
-        isSelected={false}
-        onSelect={() => {}}
-      />
+      <table>
+        <tbody>
+          <InventoryGroupItem
+            group={mockGroup}
+            inventoryId={1}
+            isSelected={false}
+            onSelect={() => {}}
+          />
+        </tbody>
+      </table>
     );
   });
 
@@ -40,12 +44,16 @@ describe('<InventoryGroupItem />', () => {
     copyMockGroup.summary_fields.user_capabilities.edit = false;
 
     wrapper = mountWithContexts(
-      <InventoryGroupItem
-        group={copyMockGroup}
-        inventoryId={1}
-        isSelected={false}
-        onSelect={() => {}}
-      />
+      <table>
+        <tbody>
+          <InventoryGroupItem
+            group={copyMockGroup}
+            inventoryId={1}
+            isSelected={false}
+            onSelect={() => {}}
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('PencilAltIcon').exists()).toBeFalsy();
   });
diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.jsx
index 70dc7ef5c6..ec9d562453 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.jsx
@@ -1,6 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { useParams, useLocation } from 'react-router-dom';
-
 import { t } from '@lingui/macro';
 import { Tooltip } from '@patternfly/react-core';
 import { getQSConfig, parseQueryString } from '../../../util/qs';
@@ -8,9 +7,11 @@ import useSelected from '../../../util/useSelected';
 import useRequest from '../../../util/useRequest';
 import { InventoriesAPI } from '../../../api';
 import DataListToolbar from '../../../components/DataListToolbar';
-import PaginatedDataList, {
-  ToolbarAddButton,
-} from '../../../components/PaginatedDataList';
+import PaginatedTable, {
+  HeaderRow,
+  HeaderCell,
+} from '../../../components/PaginatedTable';
+import { ToolbarAddButton } from '../../../components/PaginatedDataList';
 
 import InventoryGroupItem from './InventoryGroupItem';
 import InventoryGroupsDeleteModal from '../shared/InventoryGroupsDeleteModal';
@@ -104,7 +105,7 @@ function InventoryGroupsList() {
 
   return (
     <>
-      <PaginatedDataList
+      <PaginatedTable
         contentError={contentError}
         hasContentLoading={isLoading || isAdHocLaunchLoading}
         items={groups}
@@ -135,21 +136,22 @@ function InventoryGroupsList() {
             key: 'modified_by__username__icontains',
           },
         ]}
-        toolbarSortColumns={[
-          {
-            name: t`Name`,
-            key: 'name',
-          },
-        ]}
         toolbarSearchableKeys={searchableKeys}
         toolbarRelatedSearchableKeys={relatedSearchableKeys}
-        renderItem={item => (
+        headerRow={
+          <HeaderRow qsConfig={QS_CONFIG}>
+            <HeaderCell sortKey="name">{t`Name`}</HeaderCell>
+            <HeaderCell>{t`Actions`}</HeaderCell>
+          </HeaderRow>
+        }
+        renderRow={(item, index) => (
           <InventoryGroupItem
             key={item.id}
             group={item}
             inventoryId={inventoryId}
             isSelected={selected.some(row => row.id === item.id)}
             onSelect={() => handleSelect(item)}
+            rowIndex={index}
           />
         )}
         renderToolbar={props => (
diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.test.jsx
index 1c6268fbcf..1dbd23b030 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.test.jsx
@@ -93,15 +93,12 @@ describe('<InventoryGroupsList />', () => {
     });
     await waitForElement(wrapper, 'ContentLoading', el => el.length === 0);
   });
+
   afterEach(() => {
     jest.clearAllMocks();
     wrapper.unmount();
   });
 
-  test('initially renders successfully', () => {
-    expect(wrapper.find('InventoryGroupsList').length).toBe(1);
-  });
-
   test('should fetch groups from api and render them in the list', async () => {
     expect(InventoriesAPI.readGroups).toHaveBeenCalled();
     expect(wrapper.find('InventoryGroupItem').length).toBe(3);
@@ -109,52 +106,71 @@ describe('<InventoryGroupsList />', () => {
 
   test('should check and uncheck the row item', async () => {
     expect(
-      wrapper.find('DataListCheck[id="select-group-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(false);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-group-1"]').invoke('onChange')(
-        true
-      );
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')(true);
     });
     wrapper.update();
     expect(
-      wrapper.find('DataListCheck[id="select-group-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(true);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-group-1"]').invoke('onChange')(
-        false
-      );
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')(false);
     });
     wrapper.update();
     expect(
-      wrapper.find('DataListCheck[id="select-group-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(false);
   });
 
   test('should check all row items when select all is checked', async () => {
-    wrapper.find('DataListCheck').forEach(el => {
-      expect(el.props().checked).toBe(false);
+    expect.assertions(9);
+    wrapper.find('.pf-c-table__check').forEach(el => {
+      expect(el.find('input').props().checked).toBe(false);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(true);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
-      expect(el.props().checked).toBe(true);
+    wrapper.find('.pf-c-table__check').forEach(el => {
+      expect(el.find('input').props().checked).toBe(true);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(false);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
-      expect(el.props().checked).toBe(false);
+    wrapper.find('.pf-c-table__check').forEach(el => {
+      expect(el.find('input').props().checked).toBe(false);
     });
   });
 });
+
 describe('<InventoryGroupsList/> error handling', () => {
   let wrapper;
+
   beforeEach(() => {
     InventoriesAPI.readGroups.mockResolvedValue({
       data: {
@@ -182,10 +198,12 @@ describe('<InventoryGroupsList/> error handling', () => {
       })
     );
   });
+
   afterEach(() => {
     jest.clearAllMocks();
     wrapper.unmount();
   });
+
   test('should show content error when api throws error on initial render', async () => {
     InventoriesAPI.readGroupsOptions.mockImplementationOnce(() =>
       Promise.reject(new Error())
@@ -213,7 +231,11 @@ describe('<InventoryGroupsList/> error handling', () => {
     waitForElement(wrapper, 'ContentEmpty', el => el.length === 0);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-group-1"]').invoke('onChange')();
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')();
     });
     wrapper.update();
     await act(async () => {
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.jsx
index b87ab23da0..11182c220f 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.jsx
@@ -1,66 +1,56 @@
 import React from 'react';
 import { bool, func, number, oneOfType, string } from 'prop-types';
-
 import { t } from '@lingui/macro';
-
-import {
-  Button,
-  DataListAction,
-  DataListCheck,
-  DataListItem,
-  DataListItemCells,
-  DataListItemRow,
-  Tooltip,
-} from '@patternfly/react-core';
+import { Button } from '@patternfly/react-core';
+import { Tr, Td } from '@patternfly/react-table';
 
 import { Link } from 'react-router-dom';
 import { PencilAltIcon } from '@patternfly/react-icons';
-import DataListCell from '../../../components/DataListCell';
+import { ActionsTd, ActionItem } from '../../../components/PaginatedTable';
 import { Group } from '../../../types';
 
-function InventoryHostGroupItem({ group, inventoryId, isSelected, onSelect }) {
+function InventoryHostGroupItem({
+  group,
+  inventoryId,
+  isSelected,
+  onSelect,
+  rowIndex,
+}) {
   const labelId = `check-action-${group.id}`;
   const detailUrl = `/inventories/inventory/${inventoryId}/groups/${group.id}/details`;
   const editUrl = `/inventories/inventory/${inventoryId}/groups/${group.id}/edit`;
 
   return (
-    <DataListItem key={group.id} aria-labelledby={labelId} id={`${group.id}`}>
-      <DataListItemRow>
-        <DataListCheck
-          aria-labelledby={labelId}
-          id={`select-group-${group.id}`}
-          checked={isSelected}
-          onChange={onSelect}
-        />
-        <DataListItemCells
-          dataListCells={[
-            <DataListCell key="name">
-              <Link to={`${detailUrl}`} id={labelId}>
-                <b>{group.name}</b>
-              </Link>
-            </DataListCell>,
-          ]}
-        />
-        <DataListAction
-          aria-label={t`actions`}
-          aria-labelledby={labelId}
-          id={labelId}
+    <Tr id={`inventory-host-group-row-${group.id}`}>
+      <Td
+        data-cy={labelId}
+        select={{
+          rowIndex,
+          isSelected,
+          onSelect,
+        }}
+      />
+      <Td id={labelId} dataLabel={t`Name`}>
+        <Link to={`${detailUrl}`} id={labelId}>
+          {group.name}
+        </Link>
+      </Td>
+      <ActionsTd dataLabel={t`Actions`} gridColumns="auto 40px">
+        <ActionItem
+          visible={group.summary_fields.user_capabilities.edit}
+          tooltip={t`Edit group`}
         >
-          {group.summary_fields.user_capabilities.edit && (
-            <Tooltip content={t`Edit Group`} position="top">
-              <Button
-                ouiaId={`${group.id}-edit-button`}
-                variant="plain"
-                component={Link}
-                to={editUrl}
-              >
-                <PencilAltIcon />
-              </Button>
-            </Tooltip>
-          )}
-        </DataListAction>
-      </DataListItemRow>
-    </DataListItem>
+          <Button
+            ouiaId={`${group.id}-edit-button`}
+            variant="plain"
+            component={Link}
+            to={editUrl}
+          >
+            <PencilAltIcon />
+          </Button>
+        </ActionItem>
+      </ActionsTd>
+    </Tr>
   );
 }
 
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.test.jsx
index 6092de88c7..2da25d1cde 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.test.jsx
@@ -18,12 +18,16 @@ describe('<InventoryHostGroupItem />', () => {
 
   beforeEach(() => {
     wrapper = mountWithContexts(
-      <InventoryHostGroupItem
-        group={mockGroup}
-        inventoryId={1}
-        isSelected={false}
-        onSelect={() => {}}
-      />
+      <table>
+        <tbody>
+          <InventoryHostGroupItem
+            group={mockGroup}
+            inventoryId={1}
+            isSelected={false}
+            onSelect={() => {}}
+          />
+        </tbody>
+      </table>
     );
   });
 
@@ -40,12 +44,16 @@ describe('<InventoryHostGroupItem />', () => {
     copyMockGroup.summary_fields.user_capabilities.edit = false;
 
     wrapper = mountWithContexts(
-      <InventoryHostGroupItem
-        group={copyMockGroup}
-        inventoryId={1}
-        isSelected={false}
-        onSelect={() => {}}
-      />
+      <table>
+        <tbody>
+          <InventoryHostGroupItem
+            group={copyMockGroup}
+            inventoryId={1}
+            isSelected={false}
+            onSelect={() => {}}
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('PencilAltIcon').exists()).toBeFalsy();
   });
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.jsx b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.jsx
index 4454be3417..49868207c5 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.jsx
@@ -12,9 +12,11 @@ import { HostsAPI, InventoriesAPI } from '../../../api';
 import DataListToolbar from '../../../components/DataListToolbar';
 import AlertModal from '../../../components/AlertModal';
 import ErrorDetail from '../../../components/ErrorDetail';
-import PaginatedDataList, {
-  ToolbarAddButton,
-} from '../../../components/PaginatedDataList';
+import PaginatedTable, {
+  HeaderRow,
+  HeaderCell,
+} from '../../../components/PaginatedTable';
+import { ToolbarAddButton } from '../../../components/PaginatedDataList';
 import AssociateModal from '../../../components/AssociateModal';
 import DisassociateButton from '../../../components/DisassociateButton';
 import AdHocCommands from '../../../components/AdHocCommands/AdHocCommands';
@@ -146,7 +148,7 @@ function InventoryHostGroupsList() {
 
   return (
     <>
-      <PaginatedDataList
+      <PaginatedTable
         contentError={contentError}
         hasContentLoading={
           isLoading || isDisassociateLoading || isAdHocLaunchLoading
@@ -170,21 +172,22 @@ function InventoryHostGroupsList() {
             key: 'modified_by__username__icontains',
           },
         ]}
-        toolbarSortColumns={[
-          {
-            name: t`Name`,
-            key: 'name',
-          },
-        ]}
         toolbarSearchableKeys={searchableKeys}
         toolbarRelatedSearchableKeys={relatedSearchableKeys}
-        renderItem={item => (
+        headerRow={
+          <HeaderRow qsConfig={QS_CONFIG}>
+            <HeaderCell sortKey="name">{t`Name`}</HeaderCell>
+            <HeaderCell>{t`Actions`}</HeaderCell>
+          </HeaderRow>
+        }
+        renderRow={(item, index) => (
           <InventoryHostGroupItem
             key={item.id}
             group={item}
             inventoryId={item.summary_fields.inventory.id}
             isSelected={selected.some(row => row.id === item.id)}
             onSelect={() => handleSelect(item)}
+            rowIndex={index}
           />
         )}
         renderToolbar={props => (
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.test.jsx
index 493e9dc65a..043618c46a 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupsList.test.jsx
@@ -114,46 +114,63 @@ describe('<InventoryHostGroupsList />', () => {
 
   test('should check and uncheck the row item', async () => {
     expect(
-      wrapper.find('DataListCheck[id="select-group-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(false);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-group-1"]').invoke('onChange')(
-        true
-      );
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')(true);
     });
     wrapper.update();
     expect(
-      wrapper.find('DataListCheck[id="select-group-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(true);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-group-1"]').invoke('onChange')(
-        false
-      );
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')(false);
     });
     wrapper.update();
     expect(
-      wrapper.find('DataListCheck[id="select-group-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(false);
   });
 
   test('should check all row items when select all is checked', async () => {
-    wrapper.find('DataListCheck').forEach(el => {
+    expect.assertions(9);
+    wrapper.find('.pf-c-table__check input').forEach(el => {
       expect(el.props().checked).toBe(false);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(true);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
+    wrapper.find('.pf-c-table__check input').forEach(el => {
       expect(el.props().checked).toBe(true);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(false);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
+    wrapper.find('.pf-c-table__check input').forEach(el => {
       expect(el.props().checked).toBe(false);
     });
   });
@@ -230,15 +247,15 @@ describe('<InventoryHostGroupsList />', () => {
   test('expected api calls are made for multi-disassociation', async () => {
     expect(HostsAPI.disassociateGroup).toHaveBeenCalledTimes(0);
     expect(HostsAPI.readAllGroups).toHaveBeenCalledTimes(1);
-    expect(wrapper.find('DataListCheck').length).toBe(3);
-    wrapper.find('DataListCheck').forEach(el => {
+    expect(wrapper.find('.pf-c-table__check').length).toBe(3);
+    wrapper.find('.pf-c-table__check input').forEach(el => {
       expect(el.props().checked).toBe(false);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(true);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
+    wrapper.find('.pf-c-table__check input').forEach(el => {
       expect(el.props().checked).toBe(true);
     });
     wrapper.find('button[aria-label="Disassociate"]').simulate('click');
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx
index ee75b8cf1c..1067e35469 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx
@@ -1,84 +1,57 @@
 import React from 'react';
 import { string, bool, func } from 'prop-types';
-
 import { t } from '@lingui/macro';
-import {
-  Button,
-  DataListAction as _DataListAction,
-  DataListCheck,
-  DataListItem,
-  DataListItemCells,
-  DataListItemRow,
-  Tooltip,
-} from '@patternfly/react-core';
+import { Button } from '@patternfly/react-core';
+import { Tr, Td } from '@patternfly/react-table';
 import { Link } from 'react-router-dom';
 import { PencilAltIcon } from '@patternfly/react-icons';
-import styled from 'styled-components';
-import DataListCell from '../../../components/DataListCell';
+import { ActionsTd, ActionItem } from '../../../components/PaginatedTable';
 
 import HostToggle from '../../../components/HostToggle';
-import Sparkline from '../../../components/Sparkline';
 import { Host } from '../../../types';
 
-const DataListAction = styled(_DataListAction)`
-  align-items: center;
-  display: grid;
-  grid-gap: 24px;
-  grid-template-columns: min-content 40px;
-`;
-
-function InventoryHostItem(props) {
-  const { detailUrl, editUrl, host, isSelected, onSelect } = props;
-
-  const recentPlaybookJobs = host.summary_fields.recent_jobs.map(job => ({
-    ...job,
-    type: 'job',
-  }));
-
+function InventoryHostItem({
+  detailUrl,
+  editUrl,
+  host,
+  isSelected,
+  onSelect,
+  rowIndex,
+}) {
   const labelId = `check-action-${host.id}`;
 
   return (
-    <DataListItem key={host.id} aria-labelledby={labelId} id={`${host.id}`}>
-      <DataListItemRow>
-        <DataListCheck
-          id={`select-host-${host.id}`}
-          checked={isSelected}
-          onChange={onSelect}
-          aria-labelledby={labelId}
-        />
-        <DataListItemCells
-          dataListCells={[
-            <DataListCell key="divider">
-              <Link to={`${detailUrl}`}>
-                <b>{host.name}</b>
-              </Link>
-            </DataListCell>,
-            <DataListCell key="recentJobs">
-              <Sparkline jobs={recentPlaybookJobs} />
-            </DataListCell>,
-          ]}
-        />
-        <DataListAction
-          aria-label={t`actions`}
-          aria-labelledby={labelId}
-          id={labelId}
+    <Tr id={`host-row-${host.id}`}>
+      <Td
+        data-cy={labelId}
+        select={{
+          rowIndex,
+          isSelected,
+          onSelect,
+        }}
+      />
+      <Td id={labelId} dataLabel={t`Name`}>
+        <Link to={`${detailUrl}`}>
+          <b>{host.name}</b>
+        </Link>
+      </Td>
+      <ActionsTd dataLabel={t`Actions`} gridColumns="auto 40px">
+        <HostToggle host={host} />
+        <ActionItem
+          visible={host.summary_fields.user_capabilities?.edit}
+          tooltip={t`Edit host`}
         >
-          <HostToggle host={host} />
-          {host.summary_fields.user_capabilities?.edit && (
-            <Tooltip content={t`Edit Host`} position="top">
-              <Button
-                ouiaId={`${host.id}-edit-button`}
-                variant="plain"
-                component={Link}
-                to={`${editUrl}`}
-              >
-                <PencilAltIcon />
-              </Button>
-            </Tooltip>
-          )}
-        </DataListAction>
-      </DataListItemRow>
-    </DataListItem>
+          <Button
+            ouiaId={`${host.id}-edit-button`}
+            variant="plain"
+            component={Link}
+            to={`${editUrl}`}
+          >
+            <PencilAltIcon />
+          </Button>
+        </ActionItem>
+      </ActionsTd>
+    </Tr>
   );
 }
 
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx
index a135aae9e6..ce047cdaea 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx
@@ -31,12 +31,16 @@ describe('<InventoryHostItem />', () => {
 
   beforeEach(() => {
     wrapper = mountWithContexts(
-      <InventoryHostItem
-        isSelected={false}
-        detailUrl="/host/1"
-        onSelect={() => {}}
-        host={mockHost}
-      />
+      <table>
+        <tbody>
+          <InventoryHostItem
+            isSelected={false}
+            detailUrl="/host/1"
+            onSelect={() => {}}
+            host={mockHost}
+          />
+        </tbody>
+      </table>
     );
   });
 
@@ -52,12 +56,16 @@ describe('<InventoryHostItem />', () => {
     const copyMockHost = Object.assign({}, mockHost);
     copyMockHost.summary_fields.user_capabilities.edit = false;
     wrapper = mountWithContexts(
-      <InventoryHostItem
-        isSelected={false}
-        detailUrl="/host/1"
-        onSelect={() => {}}
-        host={copyMockHost}
-      />
+      <table>
+        <tbody>
+          <InventoryHostItem
+            isSelected={false}
+            detailUrl="/host/1"
+            onSelect={() => {}}
+            host={copyMockHost}
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('PencilAltIcon').exists()).toBeFalsy();
   });
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.jsx
index da1ccef87b..9b8bd79873 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.jsx
@@ -1,6 +1,5 @@
 import React, { useEffect, useState, useCallback } from 'react';
 import { useParams, useLocation } from 'react-router-dom';
-
 import { t } from '@lingui/macro';
 import { getQSConfig, parseQueryString } from '../../../util/qs';
 import { InventoriesAPI, HostsAPI } from '../../../api';
@@ -8,7 +7,11 @@ import useRequest, { useDeleteItems } from '../../../util/useRequest';
 import AlertModal from '../../../components/AlertModal';
 import DataListToolbar from '../../../components/DataListToolbar';
 import ErrorDetail from '../../../components/ErrorDetail';
-import PaginatedDataList, {
+import PaginatedTable, {
+  HeaderRow,
+  HeaderCell,
+} from '../../../components/PaginatedTable';
+import {
   ToolbarAddButton,
   ToolbarDeleteButton,
 } from '../../../components/PaginatedDataList';
@@ -105,35 +108,21 @@ function InventoryHostList() {
 
   return (
     <>
-      <PaginatedDataList
+      <PaginatedTable
         contentError={contentError}
         hasContentLoading={isLoading || isDeleteLoading || isAdHocLaunchLoading}
         items={hosts}
         itemCount={hostCount}
         pluralizedItemName={t`Hosts`}
         qsConfig={QS_CONFIG}
-        toolbarColumns={[
-          {
-            name: t`Name`,
-            key: 'name',
-            isSortable: true,
-            isSearchable: true,
-          },
-          {
-            name: t`Modified`,
-            key: 'modified',
-            isSortable: true,
-            isNumeric: true,
-          },
-          {
-            name: t`Created`,
-            key: 'created',
-            isSortable: true,
-            isNumeric: true,
-          },
-        ]}
         toolbarSearchableKeys={searchableKeys}
         toolbarRelatedSearchableKeys={relatedSearchableKeys}
+        headerRow={
+          <HeaderRow qsConfig={QS_CONFIG}>
+            <HeaderCell sortKey="name">{t`Name`}</HeaderCell>
+            <HeaderCell>{t`Actions`}</HeaderCell>
+          </HeaderRow>
+        }
         renderToolbar={props => (
           <DataListToolbar
             {...props}
@@ -164,14 +153,15 @@ function InventoryHostList() {
             ]}
           />
         )}
-        renderItem={o => (
+        renderRow={(host, index) => (
           <InventoryHostItem
-            key={o.id}
-            host={o}
-            detailUrl={`/inventories/inventory/${id}/hosts/${o.id}/details`}
-            editUrl={`/inventories/inventory/${id}/hosts/${o.id}/edit`}
-            isSelected={selected.some(row => row.id === o.id)}
-            onSelect={() => handleSelect(o)}
+            key={host.id}
+            host={host}
+            detailUrl={`/inventories/inventory/${id}/hosts/${host.id}/details`}
+            editUrl={`/inventories/inventory/${id}/hosts/${host.id}/edit`}
+            isSelected={selected.some(row => row.id === host.id)}
+            onSelect={() => handleSelect(host)}
+            rowIndex={index}
           />
         )}
         emptyStateControls={
diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx
index 71f1b2eee3..c1e6d14442 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx
@@ -103,10 +103,6 @@ describe('<InventoryHostList />', () => {
     jest.resetAllMocks();
   });
 
-  test('initially renders successfully', () => {
-    expect(wrapper.find('InventoryHostList').length).toBe(1);
-  });
-
   test('should fetch hosts from api and render them in the list', async () => {
     expect(InventoriesAPI.readHosts).toHaveBeenCalled();
     expect(wrapper.find('InventoryHostItem').length).toBe(3);
@@ -114,49 +110,66 @@ describe('<InventoryHostList />', () => {
 
   test('should check and uncheck the row item', async () => {
     expect(
-      wrapper.find('DataListCheck[id="select-host-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(false);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')(
-        true
-      );
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')(true);
     });
 
     wrapper.update();
     expect(
-      wrapper.find('DataListCheck[id="select-host-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(true);
 
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')(
-        false
-      );
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')(false);
     });
 
     wrapper.update();
     expect(
-      wrapper.find('DataListCheck[id="select-host-1"]').props().checked
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .props().checked
     ).toBe(false);
   });
 
   test('should check all row items when select all is checked', async () => {
-    wrapper.find('DataListCheck').forEach(el => {
-      expect(el.props().checked).toBe(false);
+    expect.assertions(9);
+    wrapper.find('.pf-c-table__check').forEach(el => {
+      expect(el.find('input').props().checked).toBe(false);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(true);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
-      expect(el.props().checked).toBe(true);
+    wrapper.find('.pf-c-table__check').forEach(el => {
+      expect(el.find('input').props().checked).toBe(true);
     });
     await act(async () => {
       wrapper.find('Checkbox#select-all').invoke('onChange')(false);
     });
     wrapper.update();
-    wrapper.find('DataListCheck').forEach(el => {
-      expect(el.props().checked).toBe(false);
+    wrapper.find('.pf-c-table__check').forEach(el => {
+      expect(el.find('input').props().checked).toBe(false);
     });
   });
 
@@ -196,7 +209,11 @@ describe('<InventoryHostList />', () => {
 
   test('delete button is disabled if user does not have delete capabilities on a selected host', async () => {
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-host-3"]').invoke('onChange')();
+      wrapper
+        .find('.pf-c-table__check')
+        .at(2)
+        .find('input')
+        .invoke('onChange')();
     });
     wrapper.update();
     expect(wrapper.find('ToolbarDeleteButton button').props().disabled).toBe(
@@ -207,7 +224,11 @@ describe('<InventoryHostList />', () => {
   test('should call api delete hosts for each selected host', async () => {
     HostsAPI.destroy = jest.fn();
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')();
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')();
     });
     wrapper.update();
     await act(async () => {
@@ -230,7 +251,11 @@ describe('<InventoryHostList />', () => {
       })
     );
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')();
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')();
     });
     wrapper.update();
     await act(async () => {
@@ -252,7 +277,11 @@ describe('<InventoryHostList />', () => {
       Promise.reject(new Error())
     );
     await act(async () => {
-      wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')();
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .invoke('onChange')();
     });
     wrapper.update();
     await act(async () => {
diff --git a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.jsx b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.jsx
index ccd71b2204..5147773c86 100644
--- a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.jsx
@@ -9,7 +9,11 @@ import useRequest, {
 } from '../../../util/useRequest';
 import { getQSConfig, parseQueryString } from '../../../util/qs';
 import { InventoriesAPI, InventorySourcesAPI } from '../../../api';
-import PaginatedDataList, {
+import PaginatedTable, {
+  HeaderRow,
+  HeaderCell,
+} from '../../../components/PaginatedTable';
+import {
   ToolbarAddButton,
   ToolbarDeleteButton,
 } from '../../../components/PaginatedDataList';
@@ -148,7 +152,7 @@ function InventorySourceList() {
   );
   return (
     <>
-      <PaginatedDataList
+      <PaginatedTable
         contentError={fetchError}
         hasContentLoading={
           isLoading ||
@@ -208,21 +212,27 @@ function InventorySourceList() {
             ]}
           />
         )}
-        renderItem={inventorySource => {
-          let label;
-          sourceChoices.forEach(([scMatch, scLabel]) => {
-            if (inventorySource.source === scMatch) {
-              label = scLabel;
-            }
-          });
+        headerRow={
+          <HeaderRow qsConfig={QS_CONFIG}>
+            <HeaderCell sortKey="name">{t`Name`}</HeaderCell>
+            <HeaderCell>{t`Status`}</HeaderCell>
+            <HeaderCell>{t`Type`}</HeaderCell>
+            <HeaderCell>{t`Actions`}</HeaderCell>
+          </HeaderRow>
+        }
+        renderRow={(inventorySource, index) => {
+          const label = sourceChoices.find(
+            ([scMatch]) => inventorySource.source === scMatch
+          );
           return (
             <InventorySourceListItem
               key={inventorySource.id}
               source={inventorySource}
               onSelect={() => handleSelect(inventorySource)}
-              label={label}
+              label={label[1]}
               detailUrl={`${listUrl}${inventorySource.id}`}
               isSelected={selected.some(row => row.id === inventorySource.id)}
+              rowIndex={index}
             />
           );
         }}
diff --git a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.test.jsx b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.test.jsx
index be37e47f7e..138fac4207 100644
--- a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.test.jsx
@@ -7,10 +7,7 @@ import {
   InventorySourcesAPI,
   WorkflowJobTemplateNodesAPI,
 } from '../../../api';
-import {
-  mountWithContexts,
-  waitForElement,
-} from '../../../../testUtils/enzymeHelpers';
+import { mountWithContexts } from '../../../../testUtils/enzymeHelpers';
 
 import InventorySourceList from './InventorySourceList';
 
@@ -108,18 +105,15 @@ describe('<InventorySourceList />', () => {
         }
       );
     });
+    wrapper.update();
   });
+
   afterEach(() => {
     jest.clearAllMocks();
     global.console.debug = debug;
   });
 
-  test('should mount properly', async () => {
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
-  });
-
   test('api calls should be made on mount', async () => {
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
     expect(InventoriesAPI.readSources).toHaveBeenCalledWith('1', {
       not__source: '',
       order_by: 'name',
@@ -136,23 +130,16 @@ describe('<InventorySourceList />', () => {
   });
 
   test('source data should render properly', async () => {
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
+    expect(wrapper.find('InventorySourceListItem')).toHaveLength(2);
     expect(
       wrapper
-        .find("DataListItem[aria-labelledby='check-action-1']")
-        .find('PFDataListCell[aria-label="name"]')
-        .text()
-    ).toBe('Source Foo');
-    expect(
-      wrapper
-        .find("DataListItem[aria-labelledby='check-action-1']")
-        .find('PFDataListCell[aria-label="type"]')
-        .text()
-    ).toBe('EC2');
+        .find('InventorySourceListItem')
+        .first()
+        .prop('source')
+    ).toEqual(sources.data.results[0]);
   });
 
   test('add button is not disabled and delete button is disabled', async () => {
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
     const addButton = wrapper.find('ToolbarAddButton').find('Link');
     const deleteButton = wrapper.find('ToolbarDeleteButton').find('Button');
     expect(addButton.prop('aria-disabled')).toBe(false);
@@ -162,14 +149,23 @@ describe('<InventorySourceList />', () => {
   test('delete button becomes enabled and properly calls api to delete', async () => {
     const deleteButton = wrapper.find('ToolbarDeleteButton').find('Button');
 
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
     expect(deleteButton.prop('isDisabled')).toBe(true);
 
     await act(async () =>
-      wrapper.find('DataListCheck#select-source-1').prop('onChange')({ id: 1 })
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .prop('onChange')({ id: 1 })
     );
     wrapper.update();
-    expect(wrapper.find('input#select-source-1').prop('checked')).toBe(true);
+    expect(
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .prop('checked')
+    ).toBe(true);
 
     await act(async () =>
       wrapper.find('Button[aria-label="Delete"]').prop('onClick')()
@@ -199,10 +195,12 @@ describe('<InventorySourceList />', () => {
       })
     );
 
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
-
     await act(async () =>
-      wrapper.find('DataListCheck#select-source-1').prop('onChange')({ id: 1 })
+      wrapper
+        .find('.pf-c-table__check')
+        .first()
+        .find('input')
+        .prop('onChange')({ id: 1 })
     );
     wrapper.update();
 
@@ -249,8 +247,7 @@ describe('<InventorySourceList />', () => {
     await act(async () => {
       wrapper = mountWithContexts(<InventorySourceList />);
     });
-
-    await waitForElement(wrapper, 'ContentError', el => el.length > 0);
+    wrapper.update();
 
     expect(wrapper.find('ContentError').length).toBe(1);
   });
@@ -272,8 +269,7 @@ describe('<InventorySourceList />', () => {
     await act(async () => {
       wrapper = mountWithContexts(<InventorySourceList />);
     });
-
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
+    wrapper.update();
 
     expect(wrapper.find('ContentError').length).toBe(1);
   });
@@ -291,7 +287,6 @@ describe('<InventorySourceList />', () => {
         },
       })
     );
-    await waitForElement(wrapper, 'InventorySourceList', el => el.length > 0);
     await act(async () =>
       wrapper.find('Button[aria-label="Sync all"]').prop('onClick')()
     );
@@ -301,11 +296,6 @@ describe('<InventorySourceList />', () => {
   });
 
   test('should render sync all button and make api call to start sync for all', async () => {
-    await waitForElement(
-      wrapper,
-      'InventorySourceListItem',
-      el => el.length > 0
-    );
     const syncAllButton = wrapper.find('Button[aria-label="Sync all"]');
     expect(syncAllButton.length).toBe(1);
     await act(async () => syncAllButton.prop('onClick')());
@@ -359,11 +349,7 @@ describe('<InventorySourceList /> RBAC testing', () => {
         }
       );
     });
-    await waitForElement(
-      newWrapper,
-      'InventorySourceList',
-      el => el.length > 0
-    );
+    newWrapper.update();
     expect(newWrapper.find('ToolbarAddButton').length).toBe(0);
     jest.clearAllMocks();
   });
@@ -398,11 +384,7 @@ describe('<InventorySourceList /> RBAC testing', () => {
         }
       );
     });
-    await waitForElement(
-      newWrapper,
-      'InventorySourceList',
-      el => el.length > 0
-    );
+    newWrapper.update();
     expect(newWrapper.find('Button[aria-label="Sync All"]').length).toBe(0);
     jest.clearAllMocks();
   });
diff --git a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.jsx b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.jsx
index 2ac1f21fc3..befe13783a 100644
--- a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.jsx
@@ -1,23 +1,15 @@
 import React from 'react';
-
 import { Link } from 'react-router-dom';
 import { t } from '@lingui/macro';
-import {
-  Button,
-  DataListItem,
-  DataListItemRow,
-  DataListCheck,
-  DataListItemCells,
-  DataListCell,
-  DataListAction,
-  Tooltip,
-} from '@patternfly/react-core';
+import { Button, Tooltip } from '@patternfly/react-core';
+import { Tr, Td } from '@patternfly/react-table';
 import {
   ExclamationTriangleIcon as PFExclamationTriangleIcon,
   PencilAltIcon,
 } from '@patternfly/react-icons';
 import styled from 'styled-components';
 
+import { ActionsTd, ActionItem } from '../../../components/PaginatedTable';
 import StatusIcon from '../../../components/StatusIcon';
 import InventorySourceSyncButton from '../shared/InventorySourceSyncButton';
 
@@ -30,9 +22,9 @@ function InventorySourceListItem({
   source,
   isSelected,
   onSelect,
-
   detailUrl,
   label,
+  rowIndex,
 }) {
   const generateLastJobTooltip = job => {
     return (
@@ -58,80 +50,68 @@ function InventorySourceListItem({
 
   return (
     <>
-      <DataListItem aria-labelledby={`check-action-${source.id}`}>
-        <DataListItemRow>
-          <DataListCheck
-            id={`select-source-${source.id}`}
-            checked={isSelected}
-            onChange={onSelect}
-            aria-labelledby={`check-action-${source.id}`}
-          />
-          <DataListItemCells
-            dataListCells={[
-              <DataListCell key="status" isFilled={false}>
-                {source.summary_fields.last_job && (
-                  <Tooltip
-                    position="top"
-                    content={generateLastJobTooltip(
-                      source.summary_fields.last_job
-                    )}
-                    key={source.summary_fields.last_job.id}
-                  >
-                    <Link
-                      to={`/jobs/inventory/${source.summary_fields.last_job.id}`}
-                    >
-                      <StatusIcon
-                        status={source.summary_fields.last_job.status}
-                      />
-                    </Link>
-                  </Tooltip>
-                )}
-              </DataListCell>,
-              <DataListCell aria-label={t`name`} key="name">
-                <span>
-                  <Link to={`${detailUrl}/details`}>
-                    <b>{source.name}</b>
-                  </Link>
-                </span>
-                {missingExecutionEnvironment && (
-                  <span>
-                    <Tooltip
-                      className="missing-execution-environment"
-                      content={t`Custom virtual environment ${source.custom_virtualenv} must be replaced by an execution environment.`}
-                      position="right"
-                    >
-                      <ExclamationTriangleIcon />
-                    </Tooltip>
-                  </span>
-                )}
-              </DataListCell>,
-              <DataListCell aria-label={t`type`} key="type">
-                {label}
-              </DataListCell>,
-            ]}
-          />
-          <DataListAction
-            id="actions"
-            aria-labelledby="actions"
-            aria-label={t`actions`}
-          >
-            {source.summary_fields.user_capabilities.start && (
-              <InventorySourceSyncButton source={source} />
-            )}
-            {source.summary_fields.user_capabilities.edit && (
-              <Button
-                ouiaId={`${source.id}-edit-button`}
-                aria-label={t`Edit Source`}
-                variant="plain"
-                component={Link}
-                to={`${detailUrl}/edit`}
+      <Tr id={`source-row-${source.id}`}>
+        <Td
+          data-cy={`check-action-${source.id}`}
+          select={{
+            rowIndex,
+            isSelected,
+            onSelect,
+          }}
+        />
+        <Td dataLabel={t`Name`}>
+          <Link to={`${detailUrl}/details`}>
+            <b>{source.name}</b>
+          </Link>
+          {missingExecutionEnvironment && (
+            <span>
+              <Tooltip
+                className="missing-execution-environment"
+                content={t`Custom virtual environment ${source.custom_virtualenv} must be replaced by an execution environment.`}
+                position="right"
               >
-                <PencilAltIcon />
-              </Button>
-            )}
-          </DataListAction>
-        </DataListItemRow>
-      </DataListItem>
+                <ExclamationTriangleIcon />
+              </Tooltip>
+            </span>
+          )}
+        </Td>
+        <Td dataLabel={t`Status`}>
+          {source.summary_fields.last_job && (
+            <Tooltip
+              position="top"
+              content={generateLastJobTooltip(source.summary_fields.last_job)}
+              key={source.summary_fields.last_job.id}
+            >
+              <Link to={`/jobs/inventory/${source.summary_fields.last_job.id}`}>
+                <StatusIcon status={source.summary_fields.last_job.status} />
+              </Link>
+            </Tooltip>
+          )}
+        </Td>
+        <Td dataLabel={t`Type`}>{label}</Td>
+        <ActionsTd dataLabel={t`Actions`}>
+          <ActionItem
+            visible={source.summary_fields.user_capabilities.start}
+            tooltip={t`Sync`}
+          >
+            <InventorySourceSyncButton source={source} />
+          </ActionItem>
+          <ActionItem
+            visible={source.summary_fields.user_capabilities.edit}
+            tooltip={t`Edit`}
+          >
+            <Button
+              ouiaId={`${source.id}-edit-button`}
+              aria-label={t`Edit Source`}
+              variant="plain"
+              component={Link}
+              to={`${detailUrl}/edit`}
+            >
+              <PencilAltIcon />
+            </Button>
+          </ActionItem>
+        </ActionsTd>
+      </Tr>
     </>
   );
 }
diff --git a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.test.jsx b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.test.jsx
index 6c0a9146a9..398f6febfb 100644
--- a/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.test.jsx
@@ -26,15 +26,20 @@ describe('<InventorySourceListItem />', () => {
     wrapper.unmount();
     jest.clearAllMocks();
   });
+
   test('should mount properly', () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={source}
-        isSelected={false}
-        onSelect={onSelect}
-        label="Source Bar"
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={source}
+            isSelected={false}
+            onSelect={onSelect}
+            label="Source Bar"
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('InventorySourceListItem').length).toBe(1);
   });
@@ -42,32 +47,35 @@ describe('<InventorySourceListItem />', () => {
   test('all buttons and text fields should render properly', () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={source}
-        isSelected={false}
-        onSelect={onSelect}
-        label="Source Bar"
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={source}
+            isSelected={false}
+            onSelect={onSelect}
+            label="Source Bar"
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('StatusIcon').length).toBe(1);
     expect(
       wrapper
         .find('Link')
-        .at(0)
+        .at(1)
         .prop('to')
     ).toBe('/jobs/inventory/664');
-    expect(wrapper.find('DataListCheck').length).toBe(1);
-    expect();
+    expect(wrapper.find('.pf-c-table__check').length).toBe(1);
     expect(
       wrapper
-        .find('DataListCell')
+        .find('Td')
         .at(1)
         .text()
     ).toBe('Foo');
     expect(
       wrapper
-        .find('DataListCell')
-        .at(2)
+        .find('Td')
+        .at(3)
         .text()
     ).toBe('Source Bar');
     expect(wrapper.find('InventorySourceSyncButton').length).toBe(1);
@@ -77,32 +85,46 @@ describe('<InventorySourceListItem />', () => {
   test('item should be checked', () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={source}
-        isSelected
-        onSelect={onSelect}
-        label="Source Bar"
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={source}
+            isSelected
+            onSelect={onSelect}
+            label="Source Bar"
+          />
+        </tbody>
+      </table>
     );
-    expect(wrapper.find('DataListCheck').length).toBe(1);
-    expect(wrapper.find('DataListCheck').prop('checked')).toBe(true);
+    wrapper.update();
+    expect(wrapper.find('.pf-c-table__check').length).toBe(1);
+    expect(
+      wrapper
+        .find('Td')
+        .first()
+        .prop('select').isSelected
+    ).toEqual(true);
   });
 
   test('should not render status icon', () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={{
-          ...source,
-          summary_fields: {
-            user_capabilities: { start: true, edit: true },
-            last_job: null,
-          },
-        }}
-        isSelected={false}
-        onSelect={onSelect}
-        label="Source Bar"
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={{
+              ...source,
+              summary_fields: {
+                user_capabilities: { start: true, edit: true },
+                last_job: null,
+              },
+            }}
+            isSelected={false}
+            onSelect={onSelect}
+            label="Source Bar"
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('StatusIcon').length).toBe(0);
   });
@@ -110,14 +132,20 @@ describe('<InventorySourceListItem />', () => {
   test('should not render sync buttons', async () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={{
-          ...source,
-          summary_fields: { user_capabilities: { start: false, edit: true } },
-        }}
-        isSelected={false}
-        onSelect={onSelect}
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={{
+              ...source,
+              summary_fields: {
+                user_capabilities: { start: false, edit: true },
+              },
+            }}
+            isSelected={false}
+            onSelect={onSelect}
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('InventorySourceSyncButton').length).toBe(0);
     expect(wrapper.find('Button[aria-label="Edit Source"]').length).toBe(1);
@@ -126,15 +154,21 @@ describe('<InventorySourceListItem />', () => {
   test('should not render edit buttons', async () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={{
-          ...source,
-          summary_fields: { user_capabilities: { start: true, edit: false } },
-        }}
-        isSelected={false}
-        onSelect={onSelect}
-        label="Source Bar"
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={{
+              ...source,
+              summary_fields: {
+                user_capabilities: { start: true, edit: false },
+              },
+            }}
+            isSelected={false}
+            onSelect={onSelect}
+            label="Source Bar"
+          />
+        </tbody>
+      </table>
     );
     expect(wrapper.find('Button[aria-label="Edit Source"]').length).toBe(0);
     expect(wrapper.find('InventorySourceSyncButton').length).toBe(1);
@@ -143,16 +177,20 @@ describe('<InventorySourceListItem />', () => {
   test('should render warning about missing execution environment', () => {
     const onSelect = jest.fn();
     wrapper = mountWithContexts(
-      <InventorySourceListItem
-        source={{
-          ...source,
-          custom_virtualenv: '/var/lib/awx/env',
-          execution_environment: null,
-        }}
-        isSelected={false}
-        onSelect={onSelect}
-        label="Source Bar"
-      />
+      <table>
+        <tbody>
+          <InventorySourceListItem
+            source={{
+              ...source,
+              custom_virtualenv: '/var/lib/awx/env',
+              execution_environment: null,
+            }}
+            isSelected={false}
+            onSelect={onSelect}
+            label="Source Bar"
+          />
+        </tbody>
+      </table>
     );
     expect(
       wrapper.find('.missing-execution-environment').prop('content')