diff --git a/package.json b/package.json
index 7ba5ad94447..1dfad9cf01e 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,6 @@
     "angular": "1.8.2",
     "bootstrap-select": "1.13.18",
     "ngreact": "^0.5.0",
-    "query-string": "^6.1.0",
     "react-bootstrap": "^0.32.1",
     "use-deep-compare-effect": "^1.6.1"
   }
diff --git a/webpack/components/Content/ContentTable.js b/webpack/components/Content/ContentTable.js
index 502ce406e88..1ba87d28642 100644
--- a/webpack/components/Content/ContentTable.js
+++ b/webpack/components/Content/ContentTable.js
@@ -20,7 +20,6 @@ const ContentTable = ({ content, tableSchema, onPaginationChange }) => {
       loadingText={__('Loading')}
     >
       <Table
-        ouiaId="content-table-table"
         columns={tableSchema}
         rows={results}
         pagination={pagination}
diff --git a/webpack/components/Content/__tests__/__snapshots__/ContentTable.test.js.snap b/webpack/components/Content/__tests__/__snapshots__/ContentTable.test.js.snap
index 5c8b7adf395..ddf6cd94e9e 100644
--- a/webpack/components/Content/__tests__/__snapshots__/ContentTable.test.js.snap
+++ b/webpack/components/Content/__tests__/__snapshots__/ContentTable.test.js.snap
@@ -15,7 +15,6 @@ exports[`Content Table should render and contain appropriate components 1`] = `
     }
     itemCount={2}
     onPaginationChange={[Function]}
-    ouiaId="content-table-table"
     pagination={Object {}}
     rows={
       Array [
diff --git a/webpack/scenes/ModuleStreams/ModuleStreamsPage.js b/webpack/scenes/ModuleStreams/ModuleStreamsPage.js
index 906ee8eff5a..f00069ae90a 100644
--- a/webpack/scenes/ModuleStreams/ModuleStreamsPage.js
+++ b/webpack/scenes/ModuleStreams/ModuleStreamsPage.js
@@ -1,59 +1,53 @@
-import React, { Component } from 'react';
+import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import qs from 'query-string';
+import { useUrlParams } from 'foremanReact/components/PF4/TableIndexPage/Table/TableHooks';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { orgId } from '../../services/api';
 import TableSchema from '../ModuleStreams/ModuleStreamsTableSchema';
 import GenericContentPage from '../../components/Content/GenericContentPage';
 
-class ModuleStreamsPage extends Component {
-  constructor(props) {
-    super(props);
+const ModuleStreamsPage = (props) => {
+  const { searchParam } = useUrlParams();
+  const [searchQuery, setSearchQuery] = useState(searchParam || '');
+  const { getModuleStreams } = props;
 
-    const queryParams = qs.parse(this.props.location.search);
-    this.state = {
-      searchQuery: queryParams.search || '',
-    };
-  }
-
-  componentDidMount() {
-    this.props.getModuleStreams({
-      search: this.state.searchQuery,
+  useEffect(() => {
+    getModuleStreams({
+      search: searchQuery,
     });
-  }
+  }, [getModuleStreams, searchQuery]);
 
-  onPaginationChange = (pagination) => {
-    this.props.getModuleStreams({
+  const onPaginationChange = (pagination) => {
+    props.getModuleStreams({
       ...pagination,
     });
   };
 
-  onSearch = (search) => {
-    this.props.getModuleStreams({ search });
+  const onSearch = (search) => {
+    props.getModuleStreams({ search });
   };
 
-  updateSearchQuery = (searchQuery) => {
-    this.setState({ searchQuery });
+  const updateSearchQuery = (newSearchQuery) => {
+    setSearchQuery(newSearchQuery);
   };
 
-  render() {
-    const { moduleStreams } = this.props;
-    return (
-      <GenericContentPage
-        header={__('Module Streams')}
-        content={moduleStreams}
-        tableSchema={TableSchema}
-        onSearch={this.onSearch}
-        autocompleteEndpoint="/katello/api/v2/module_streams"
-        autocompleteQueryParams={{ organization_id: orgId() }}
-        bookmarkController="katello_module_streams"
-        updateSearchQuery={this.updateSearchQuery}
-        initialInputValue={this.state.searchQuery}
-        onPaginationChange={this.onPaginationChange}
-      />
-    );
-  }
-}
+  const { moduleStreams } = props;
+  return (
+    <GenericContentPage
+      header={__('Module Streams')}
+      content={moduleStreams}
+      tableSchema={TableSchema}
+      onSearch={onSearch}
+      autocompleteEndpoint="/katello/api/v2/module_streams"
+      autocompleteQueryParams={{ organization_id: orgId() }}
+      bookmarkController="katello_module_streams"
+      updateSearchQuery={updateSearchQuery}
+      initialInputValue={searchQuery}
+      onPaginationChange={onPaginationChange}
+    />
+  );
+};
+
 
 ModuleStreamsPage.propTypes = {
   location: PropTypes.shape({
diff --git a/webpack/scenes/ModuleStreams/__tests__/ModuleStreamPage.test.js b/webpack/scenes/ModuleStreams/__tests__/ModuleStreamPage.test.js
index 43464b5a7c9..0bf6bea45ca 100644
--- a/webpack/scenes/ModuleStreams/__tests__/ModuleStreamPage.test.js
+++ b/webpack/scenes/ModuleStreams/__tests__/ModuleStreamPage.test.js
@@ -1,19 +1,21 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 import toJson from 'enzyme-to-json';
+import * as hooks from 'foremanReact/components/PF4/TableIndexPage/Table/TableHooks';
 import ModuleStreamsPage from '../ModuleStreamsPage';
 import GenericContentPage from '../../../components/Content/GenericContentPage';
 
 describe('Module streams page', () => {
   it('should render and contain appropiate components', async () => {
     const moduleStreams = {};
-    const mockLocation = { search: '' };
+    jest.spyOn(hooks, 'useUrlParams').mockImplementation(() => ({
+      searchParam: '',
+    }));
     const getModuleStreams = () => {};
 
     const wrapper = shallow(<ModuleStreamsPage
       moduleStreams={moduleStreams}
       getModuleStreams={getModuleStreams}
-      location={mockLocation}
     />);
 
     expect(toJson(wrapper)).toMatchSnapshot();
diff --git a/webpack/scenes/ModuleStreams/__tests__/__snapshots__/ModuleStreamsTable.test.js.snap b/webpack/scenes/ModuleStreams/__tests__/__snapshots__/ModuleStreamsTable.test.js.snap
index d58ca06ded0..1b399a608c8 100644
--- a/webpack/scenes/ModuleStreams/__tests__/__snapshots__/ModuleStreamsTable.test.js.snap
+++ b/webpack/scenes/ModuleStreams/__tests__/__snapshots__/ModuleStreamsTable.test.js.snap
@@ -88,7 +88,6 @@ exports[`Module streams table should render and contain appropiate components 1`
     }
     itemCount={0}
     onPaginationChange={[Function]}
-    ouiaId="content-table-table"
     pagination={Object {}}
     rows={Array []}
   />
diff --git a/webpack/utils/__tests__/useParamsWithHash.test.js b/webpack/utils/__tests__/useParamsWithHash.test.js
deleted file mode 100644
index 60f364aa179..00000000000
--- a/webpack/utils/__tests__/useParamsWithHash.test.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import paramsFromHash from '../paramsFromHash';
-
-test('can parse both hash and query params', () => {
-  const { hash, params: { foo } } = paramsFromHash('#filters?foo=bar');
-  expect(hash).toBe('filters');
-  expect(foo).toBe('bar');
-});
-
-test('can parse just hash', () => {
-  const { hash } = paramsFromHash('#filters');
-  expect(hash).toBe('filters');
-});
-
-test('can parse just query params', () => {
-  const { params: { foo } } = paramsFromHash('?foo=bar');
-  expect(foo).toBe('bar');
-});
-
-test("won't error with blank string", () => {
-  const { hash } = paramsFromHash('');
-  expect(hash).toBe('');
-});
diff --git a/webpack/utils/paramsFromHash.js b/webpack/utils/paramsFromHash.js
deleted file mode 100644
index 00aaac50b7e..00000000000
--- a/webpack/utils/paramsFromHash.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import qs from 'query-string';
-
-/*
- For when you have a hash with your params in the URL
- pass in the the 'hash' object from react-router's useLocation();
- e.g. "mysite.com/foo#bar?baz=bop"
- will return { hash: 'bar', params: { baz: "bop" }}
-*/
-const paramsFromHash = (hash) => {
-  const [baseHash, queryParams = {}] = hash.split('?');
-  const params = qs.parse(queryParams);
-  const trimmedHash = baseHash.replace('#', '').replace('/', '');
-  return { hash: trimmedHash, params };
-};
-
-export default paramsFromHash;
diff --git a/webpack/utils/useUrlParams.js b/webpack/utils/useUrlParams.js
deleted file mode 100644
index 2901acadc4e..00000000000
--- a/webpack/utils/useUrlParams.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import qs from 'query-string';
-import { useLocation } from 'react-router-dom';
-
-// Allows hash and params e.g. "/foo#bar?query=baz"
-// returns { hash: "bar", params: { query: "baz" } }
-const useUrlParamsWithHash = () => {
-  const { hash: fullParams } = useLocation();
-  const [hash, queryParams = {}] = fullParams.split('?');
-  const params = qs.parse(queryParams);
-  const trimmedhash = hash.replace('#', '');
-  return { hash: trimmedhash, params };
-};
-
-export default useUrlParamsWithHash;