diff --git a/src/components/CodeSearchResults/__snapshots__/CodeSearchResults.test.jsx.snap b/src/components/CodeSearchResults/__snapshots__/CodeSearchResults.test.jsx.snap
index fcf9e684f0..22037c135e 100644
--- a/src/components/CodeSearchResults/__snapshots__/CodeSearchResults.test.jsx.snap
+++ b/src/components/CodeSearchResults/__snapshots__/CodeSearchResults.test.jsx.snap
@@ -614,7 +614,7 @@ exports[`<CodeSearchResults /> basic rendering should render table data 1`] = `
                             Showing 
                             4
                              of 
-                            4
+                            0
                             .
                           </div>
                         </div>
@@ -904,12 +904,96 @@ exports[`<CodeSearchResults /> basic rendering should render table data 1`] = `
                     <div
                       className="pgn__data-table-footer"
                     >
-                      <div>
-                        Showing 
-                        4
-                         of 
-                        4
-                        .
+                      <div
+                        className="col d-flex justify-content-center"
+                      >
+                        <nav
+                          aria-label="code-search-results-pagination"
+                          className="pagination-default"
+                        >
+                          <div
+                            aria-atomic={true}
+                            aria-live="polite"
+                            aria-relevant="text"
+                            className="sr-only"
+                          >
+                            Page 1, Current Page, of 1
+                          </div>
+                          <ul
+                            className="pagination"
+                          >
+                            <li
+                              className="page-item disabled"
+                            >
+                              <button
+                                aria-label="Previous"
+                                className="previous page-link btn btn-primary"
+                                disabled={true}
+                                onClick={[Function]}
+                                tabIndex="-1"
+                                type="button"
+                              >
+                                <div>
+                                  <span
+                                    className="pgn__icon"
+                                  >
+                                    <svg
+                                      aria-hidden={true}
+                                      fill="none"
+                                      focusable={false}
+                                      height={24}
+                                      role="img"
+                                      viewBox="0 0 24 24"
+                                      width={24}
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                        fill="currentColor"
+                                      />
+                                    </svg>
+                                  </span>
+                                  Previous
+                                </div>
+                              </button>
+                            </li>
+                            <li
+                              className="page-item disabled"
+                            >
+                              <button
+                                aria-label="Next"
+                                className="next page-link btn btn-primary"
+                                disabled={true}
+                                onClick={[Function]}
+                                tabIndex="-1"
+                                type="button"
+                              >
+                                <div>
+                                  Next
+                                  <span
+                                    className="pgn__icon"
+                                  >
+                                    <svg
+                                      aria-hidden={true}
+                                      fill="none"
+                                      focusable={false}
+                                      height={24}
+                                      role="img"
+                                      viewBox="0 0 24 24"
+                                      width={24}
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                        fill="currentColor"
+                                      />
+                                    </svg>
+                                  </span>
+                                </div>
+                              </button>
+                            </li>
+                          </ul>
+                        </nav>
                       </div>
                     </div>
                   </div>
@@ -918,101 +1002,6 @@ exports[`<CodeSearchResults /> basic rendering should render table data 1`] = `
             </div>
           </div>
         </div>
-        <div
-          className="row mt-2"
-        >
-          <div
-            className="col d-flex justify-content-center"
-          >
-            <nav
-              aria-label="code-search-results-pagination"
-              className="pagination-default"
-            >
-              <div
-                aria-atomic={true}
-                aria-live="polite"
-                aria-relevant="text"
-                className="sr-only"
-              >
-                Page 1, Current Page, of 1
-              </div>
-              <ul
-                className="pagination"
-              >
-                <li
-                  className="page-item disabled"
-                >
-                  <button
-                    aria-label="Previous"
-                    className="previous page-link btn btn-primary"
-                    disabled={true}
-                    onClick={[Function]}
-                    tabIndex="-1"
-                    type="button"
-                  >
-                    <div>
-                      <span
-                        className="pgn__icon"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          fill="none"
-                          focusable={false}
-                          height={24}
-                          role="img"
-                          viewBox="0 0 24 24"
-                          width={24}
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                      Previous
-                    </div>
-                  </button>
-                </li>
-                <li
-                  className="page-item disabled"
-                >
-                  <button
-                    aria-label="Next"
-                    className="next page-link btn btn-primary"
-                    disabled={true}
-                    onClick={[Function]}
-                    tabIndex="-1"
-                    type="button"
-                  >
-                    <div>
-                      Next
-                      <span
-                        className="pgn__icon"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          fill="none"
-                          focusable={false}
-                          height={24}
-                          role="img"
-                          viewBox="0 0 24 24"
-                          width={24}
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </div>
-                  </button>
-                </li>
-              </ul>
-            </nav>
-          </div>
-        </div>
       </div>
     </div>
   </div>
@@ -1109,7 +1098,7 @@ exports[`<CodeSearchResults /> basic rendering should render table data when sea
                             Showing 
                             1
                              of 
-                            1
+                            0
                             .
                           </div>
                         </div>
@@ -1292,12 +1281,96 @@ exports[`<CodeSearchResults /> basic rendering should render table data when sea
                     <div
                       className="pgn__data-table-footer"
                     >
-                      <div>
-                        Showing 
-                        1
-                         of 
-                        1
-                        .
+                      <div
+                        className="col d-flex justify-content-center"
+                      >
+                        <nav
+                          aria-label="code-search-results-pagination"
+                          className="pagination-default"
+                        >
+                          <div
+                            aria-atomic={true}
+                            aria-live="polite"
+                            aria-relevant="text"
+                            className="sr-only"
+                          >
+                            Page 1, Current Page, of 1
+                          </div>
+                          <ul
+                            className="pagination"
+                          >
+                            <li
+                              className="page-item disabled"
+                            >
+                              <button
+                                aria-label="Previous"
+                                className="previous page-link btn btn-primary"
+                                disabled={true}
+                                onClick={[Function]}
+                                tabIndex="-1"
+                                type="button"
+                              >
+                                <div>
+                                  <span
+                                    className="pgn__icon"
+                                  >
+                                    <svg
+                                      aria-hidden={true}
+                                      fill="none"
+                                      focusable={false}
+                                      height={24}
+                                      role="img"
+                                      viewBox="0 0 24 24"
+                                      width={24}
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                        fill="currentColor"
+                                      />
+                                    </svg>
+                                  </span>
+                                  Previous
+                                </div>
+                              </button>
+                            </li>
+                            <li
+                              className="page-item disabled"
+                            >
+                              <button
+                                aria-label="Next"
+                                className="next page-link btn btn-primary"
+                                disabled={true}
+                                onClick={[Function]}
+                                tabIndex="-1"
+                                type="button"
+                              >
+                                <div>
+                                  Next
+                                  <span
+                                    className="pgn__icon"
+                                  >
+                                    <svg
+                                      aria-hidden={true}
+                                      fill="none"
+                                      focusable={false}
+                                      height={24}
+                                      role="img"
+                                      viewBox="0 0 24 24"
+                                      width={24}
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                        fill="currentColor"
+                                      />
+                                    </svg>
+                                  </span>
+                                </div>
+                              </button>
+                            </li>
+                          </ul>
+                        </nav>
                       </div>
                     </div>
                   </div>
@@ -1306,101 +1379,6 @@ exports[`<CodeSearchResults /> basic rendering should render table data when sea
             </div>
           </div>
         </div>
-        <div
-          className="row mt-2"
-        >
-          <div
-            className="col d-flex justify-content-center"
-          >
-            <nav
-              aria-label="code-search-results-pagination"
-              className="pagination-default"
-            >
-              <div
-                aria-atomic={true}
-                aria-live="polite"
-                aria-relevant="text"
-                className="sr-only"
-              >
-                Page 1, Current Page, of 1
-              </div>
-              <ul
-                className="pagination"
-              >
-                <li
-                  className="page-item disabled"
-                >
-                  <button
-                    aria-label="Previous"
-                    className="previous page-link btn btn-primary"
-                    disabled={true}
-                    onClick={[Function]}
-                    tabIndex="-1"
-                    type="button"
-                  >
-                    <div>
-                      <span
-                        className="pgn__icon"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          fill="none"
-                          focusable={false}
-                          height={24}
-                          role="img"
-                          viewBox="0 0 24 24"
-                          width={24}
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                      Previous
-                    </div>
-                  </button>
-                </li>
-                <li
-                  className="page-item disabled"
-                >
-                  <button
-                    aria-label="Next"
-                    className="next page-link btn btn-primary"
-                    disabled={true}
-                    onClick={[Function]}
-                    tabIndex="-1"
-                    type="button"
-                  >
-                    <div>
-                      Next
-                      <span
-                        className="pgn__icon"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          fill="none"
-                          focusable={false}
-                          height={24}
-                          role="img"
-                          viewBox="0 0 24 24"
-                          width={24}
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </div>
-                  </button>
-                </li>
-              </ul>
-            </nav>
-          </div>
-        </div>
       </div>
     </div>
   </div>
diff --git a/src/components/EnrolledLearnersForInactiveCoursesTable/__snapshots__/EnrolledLearnersForInactiveCoursesTable.test.jsx.snap b/src/components/EnrolledLearnersForInactiveCoursesTable/__snapshots__/EnrolledLearnersForInactiveCoursesTable.test.jsx.snap
index 82f2bda231..d6f6328caf 100644
--- a/src/components/EnrolledLearnersForInactiveCoursesTable/__snapshots__/EnrolledLearnersForInactiveCoursesTable.test.jsx.snap
+++ b/src/components/EnrolledLearnersForInactiveCoursesTable/__snapshots__/EnrolledLearnersForInactiveCoursesTable.test.jsx.snap
@@ -104,7 +104,14 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
                     >
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -112,11 +119,42 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
                           <span>
                             Email
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -124,11 +162,42 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
                           <span>
                             Total Course Enrollment Count
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -136,11 +205,42 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
                           <span>
                             Total Completed Courses Count
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -148,6 +248,30 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
                           <span>
                             Last Activity Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                     </tr>
@@ -260,12 +384,96 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
               <div
                 className="pgn__data-table-footer"
               >
-                <div>
-                  Showing 
-                  3
-                   of 
-                  3
-                  .
+                <div
+                  className="col d-flex justify-content-center"
+                >
+                  <nav
+                    aria-label="enrolled-learners-inactive-courses-pagination"
+                    className="pagination-default"
+                  >
+                    <div
+                      aria-atomic={true}
+                      aria-live="polite"
+                      aria-relevant="text"
+                      className="sr-only"
+                    >
+                      Page 1, Current Page, of 1
+                    </div>
+                    <ul
+                      className="pagination"
+                    >
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Previous"
+                          className="previous page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                            Previous
+                          </div>
+                        </button>
+                      </li>
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Next"
+                          className="next page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            Next
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                          </div>
+                        </button>
+                      </li>
+                    </ul>
+                  </nav>
                 </div>
               </div>
             </div>
@@ -274,100 +482,5 @@ exports[`EnrolledLearnersForInactiveCoursesTable renders enrolled learners for i
       </div>
     </div>
   </div>
-  <div
-    className="row mt-2"
-  >
-    <div
-      className="col d-flex justify-content-center"
-    >
-      <nav
-        aria-label="enrolled-learners-inactive-courses-pagination"
-        className="pagination-default"
-      >
-        <div
-          aria-atomic={true}
-          aria-live="polite"
-          aria-relevant="text"
-          className="sr-only"
-        >
-          Page 1, Current Page, of 1
-        </div>
-        <ul
-          className="pagination"
-        >
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Previous"
-              className="previous page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-                Previous
-              </div>
-            </button>
-          </li>
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Next"
-              className="next page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                Next
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </div>
-            </button>
-          </li>
-        </ul>
-      </nav>
-    </div>
-  </div>
 </div>
 `;
diff --git a/src/components/LearnerActivityTable/__snapshots__/LearnerActivityTable.test.jsx.snap b/src/components/LearnerActivityTable/__snapshots__/LearnerActivityTable.test.jsx.snap
index c0fafc956e..63d83b2c41 100644
--- a/src/components/LearnerActivityTable/__snapshots__/LearnerActivityTable.test.jsx.snap
+++ b/src/components/LearnerActivityTable/__snapshots__/LearnerActivityTable.test.jsx.snap
@@ -64,7 +64,14 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                     >
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -72,11 +79,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Email
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -84,11 +122,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Course Title
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -96,11 +165,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Course Price
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -108,11 +208,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Start Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -120,11 +251,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             End Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -132,11 +294,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Passed Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -144,11 +337,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Current Grade
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -156,11 +380,42 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Progress Status
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -168,6 +423,30 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
                           <span>
                             Last Activity Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                     </tr>
@@ -307,12 +586,96 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
               <div
                 className="pgn__data-table-footer"
               >
-                <div>
-                  Showing 
-                  2
-                   of 
-                  2
-                  .
+                <div
+                  className="col d-flex justify-content-center"
+                >
+                  <nav
+                    aria-label="active-week-pagination"
+                    className="pagination-default"
+                  >
+                    <div
+                      aria-atomic={true}
+                      aria-live="polite"
+                      aria-relevant="text"
+                      className="sr-only"
+                    >
+                      Page 1, Current Page, of 1
+                    </div>
+                    <ul
+                      className="pagination"
+                    >
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Previous"
+                          className="previous page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                            Previous
+                          </div>
+                        </button>
+                      </li>
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Next"
+                          className="next page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            Next
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                          </div>
+                        </button>
+                      </li>
+                    </ul>
+                  </nav>
                 </div>
               </div>
             </div>
@@ -321,101 +684,6 @@ exports[`LearnerActivityTable renders active learners table correctly 1`] = `
       </div>
     </div>
   </div>
-  <div
-    className="row mt-2"
-  >
-    <div
-      className="col d-flex justify-content-center"
-    >
-      <nav
-        aria-label="active-week-pagination"
-        className="pagination-default"
-      >
-        <div
-          aria-atomic={true}
-          aria-live="polite"
-          aria-relevant="text"
-          className="sr-only"
-        >
-          Page 1, Current Page, of 1
-        </div>
-        <ul
-          className="pagination"
-        >
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Previous"
-              className="previous page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-                Previous
-              </div>
-            </button>
-          </li>
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Next"
-              className="next page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                Next
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </div>
-            </button>
-          </li>
-        </ul>
-      </nav>
-    </div>
-  </div>
 </div>
 `;
 
@@ -523,7 +791,14 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                     >
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -531,11 +806,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Email
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -543,11 +849,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Course Title
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -555,11 +892,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Course Price
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -567,11 +935,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Start Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -579,11 +978,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             End Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -591,11 +1021,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Passed Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -603,11 +1064,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Current Grade
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -615,11 +1107,42 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Progress Status
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -627,6 +1150,30 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
                           <span>
                             Last Activity Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                     </tr>
@@ -766,12 +1313,96 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
               <div
                 className="pgn__data-table-footer"
               >
-                <div>
-                  Showing 
-                  2
-                   of 
-                  2
-                  .
+                <div
+                  className="col d-flex justify-content-center"
+                >
+                  <nav
+                    aria-label="inactive-month-pagination"
+                    className="pagination-default"
+                  >
+                    <div
+                      aria-atomic={true}
+                      aria-live="polite"
+                      aria-relevant="text"
+                      className="sr-only"
+                    >
+                      Page 1, Current Page, of 1
+                    </div>
+                    <ul
+                      className="pagination"
+                    >
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Previous"
+                          className="previous page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                            Previous
+                          </div>
+                        </button>
+                      </li>
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Next"
+                          className="next page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            Next
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                          </div>
+                        </button>
+                      </li>
+                    </ul>
+                  </nav>
                 </div>
               </div>
             </div>
@@ -780,101 +1411,6 @@ exports[`LearnerActivityTable renders inactive past month learners table correct
       </div>
     </div>
   </div>
-  <div
-    className="row mt-2"
-  >
-    <div
-      className="col d-flex justify-content-center"
-    >
-      <nav
-        aria-label="inactive-month-pagination"
-        className="pagination-default"
-      >
-        <div
-          aria-atomic={true}
-          aria-live="polite"
-          aria-relevant="text"
-          className="sr-only"
-        >
-          Page 1, Current Page, of 1
-        </div>
-        <ul
-          className="pagination"
-        >
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Previous"
-              className="previous page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-                Previous
-              </div>
-            </button>
-          </li>
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Next"
-              className="next page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                Next
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </div>
-            </button>
-          </li>
-        </ul>
-      </nav>
-    </div>
-  </div>
 </div>
 `;
 
@@ -942,7 +1478,14 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                     >
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -950,11 +1493,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Email
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -962,11 +1536,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Course Title
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -974,11 +1579,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Course Price
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -986,11 +1622,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Start Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -998,11 +1665,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             End Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -1010,11 +1708,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Passed Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -1022,11 +1751,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Current Grade
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -1034,11 +1794,42 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Progress Status
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -1046,6 +1837,30 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
                           <span>
                             Last Activity Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                     </tr>
@@ -1185,12 +2000,96 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
               <div
                 className="pgn__data-table-footer"
               >
-                <div>
-                  Showing 
-                  2
-                   of 
-                  2
-                  .
+                <div
+                  className="col d-flex justify-content-center"
+                >
+                  <nav
+                    aria-label="inactive-week-pagination"
+                    className="pagination-default"
+                  >
+                    <div
+                      aria-atomic={true}
+                      aria-live="polite"
+                      aria-relevant="text"
+                      className="sr-only"
+                    >
+                      Page 1, Current Page, of 1
+                    </div>
+                    <ul
+                      className="pagination"
+                    >
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Previous"
+                          className="previous page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                            Previous
+                          </div>
+                        </button>
+                      </li>
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Next"
+                          className="next page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            Next
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                          </div>
+                        </button>
+                      </li>
+                    </ul>
+                  </nav>
                 </div>
               </div>
             </div>
@@ -1199,100 +2098,5 @@ exports[`LearnerActivityTable renders inactive past week learners table correctl
       </div>
     </div>
   </div>
-  <div
-    className="row mt-2"
-  >
-    <div
-      className="col d-flex justify-content-center"
-    >
-      <nav
-        aria-label="inactive-week-pagination"
-        className="pagination-default"
-      >
-        <div
-          aria-atomic={true}
-          aria-live="polite"
-          aria-relevant="text"
-          className="sr-only"
-        >
-          Page 1, Current Page, of 1
-        </div>
-        <ul
-          className="pagination"
-        >
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Previous"
-              className="previous page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-                Previous
-              </div>
-            </button>
-          </li>
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Next"
-              className="next page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                Next
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </div>
-            </button>
-          </li>
-        </ul>
-      </nav>
-    </div>
-  </div>
 </div>
 `;
diff --git a/src/components/PastWeekPassedLearnersTable/__snapshots__/PastWeekPassedLearnersTable.test.jsx.snap b/src/components/PastWeekPassedLearnersTable/__snapshots__/PastWeekPassedLearnersTable.test.jsx.snap
index c5d603fb8b..d4b75b2bc7 100644
--- a/src/components/PastWeekPassedLearnersTable/__snapshots__/PastWeekPassedLearnersTable.test.jsx.snap
+++ b/src/components/PastWeekPassedLearnersTable/__snapshots__/PastWeekPassedLearnersTable.test.jsx.snap
@@ -64,7 +64,14 @@ exports[`PastWeekPassedLearnersTable renders table correctly 1`] = `
                     >
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -72,11 +79,42 @@ exports[`PastWeekPassedLearnersTable renders table correctly 1`] = `
                           <span>
                             Email
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -84,11 +122,42 @@ exports[`PastWeekPassedLearnersTable renders table correctly 1`] = `
                           <span>
                             Course Title
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                       <th
                         colSpan={1}
+                        onClick={[Function]}
                         role="columnheader"
+                        style={
+                          Object {
+                            "cursor": "pointer",
+                          }
+                        }
+                        title="Toggle SortBy"
                       >
                         <span
                           className="d-flex align-items-center"
@@ -96,6 +165,30 @@ exports[`PastWeekPassedLearnersTable renders table correctly 1`] = `
                           <span>
                             Passed Date
                           </span>
+                          <span
+                            className="pgn__icon"
+                            style={
+                              Object {
+                                "opacity": 0.5,
+                              }
+                            }
+                          >
+                            <svg
+                              aria-hidden={true}
+                              fill="none"
+                              focusable={false}
+                              height={24}
+                              role="img"
+                              viewBox="0 0 24 24"
+                              width={24}
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M7 10l5-5 5 5H7zM7 14l5 5 5-5H7z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                          </span>
                         </span>
                       </th>
                     </tr>
@@ -163,12 +256,96 @@ exports[`PastWeekPassedLearnersTable renders table correctly 1`] = `
               <div
                 className="pgn__data-table-footer"
               >
-                <div>
-                  Showing 
-                  2
-                   of 
-                  2
-                  .
+                <div
+                  className="col d-flex justify-content-center"
+                >
+                  <nav
+                    aria-label="completed-learners-week-pagination"
+                    className="pagination-default"
+                  >
+                    <div
+                      aria-atomic={true}
+                      aria-live="polite"
+                      aria-relevant="text"
+                      className="sr-only"
+                    >
+                      Page 1, Current Page, of 1
+                    </div>
+                    <ul
+                      className="pagination"
+                    >
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Previous"
+                          className="previous page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                            Previous
+                          </div>
+                        </button>
+                      </li>
+                      <li
+                        className="page-item disabled"
+                      >
+                        <button
+                          aria-label="Next"
+                          className="next page-link btn btn-primary"
+                          disabled={true}
+                          onClick={[Function]}
+                          tabIndex="-1"
+                          type="button"
+                        >
+                          <div>
+                            Next
+                            <span
+                              className="pgn__icon"
+                            >
+                              <svg
+                                aria-hidden={true}
+                                fill="none"
+                                focusable={false}
+                                height={24}
+                                role="img"
+                                viewBox="0 0 24 24"
+                                width={24}
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
+                                  fill="currentColor"
+                                />
+                              </svg>
+                            </span>
+                          </div>
+                        </button>
+                      </li>
+                    </ul>
+                  </nav>
                 </div>
               </div>
             </div>
@@ -177,100 +354,5 @@ exports[`PastWeekPassedLearnersTable renders table correctly 1`] = `
       </div>
     </div>
   </div>
-  <div
-    className="row mt-2"
-  >
-    <div
-      className="col d-flex justify-content-center"
-    >
-      <nav
-        aria-label="completed-learners-week-pagination"
-        className="pagination-default"
-      >
-        <div
-          aria-atomic={true}
-          aria-live="polite"
-          aria-relevant="text"
-          className="sr-only"
-        >
-          Page 1, Current Page, of 1
-        </div>
-        <ul
-          className="pagination"
-        >
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Previous"
-              className="previous page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12l4.58-4.59z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-                Previous
-              </div>
-            </button>
-          </li>
-          <li
-            className="page-item disabled"
-          >
-            <button
-              aria-label="Next"
-              className="next page-link btn btn-primary"
-              disabled={true}
-              onClick={[Function]}
-              tabIndex="-1"
-              type="button"
-            >
-              <div>
-                Next
-                <span
-                  className="pgn__icon"
-                >
-                  <svg
-                    aria-hidden={true}
-                    fill="none"
-                    focusable={false}
-                    height={24}
-                    role="img"
-                    viewBox="0 0 24 24"
-                    width={24}
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </div>
-            </button>
-          </li>
-        </ul>
-      </nav>
-    </div>
-  </div>
 </div>
 `;
diff --git a/src/components/SubsidyRequestManagementTable/tests/__snapshots__/SubsidyRequestManagementTable.test.jsx.snap b/src/components/SubsidyRequestManagementTable/tests/__snapshots__/SubsidyRequestManagementTable.test.jsx.snap
index 8973ab0b5f..59a94d0637 100644
--- a/src/components/SubsidyRequestManagementTable/tests/__snapshots__/SubsidyRequestManagementTable.test.jsx.snap
+++ b/src/components/SubsidyRequestManagementTable/tests/__snapshots__/SubsidyRequestManagementTable.test.jsx.snap
@@ -77,7 +77,11 @@ exports[`SubsidyRequestManagementTable renders data in a table as expected 1`] =
             <div
               className="pgn__smart-status"
             >
-              Showing 3 of 24.
+              Showing 
+              3
+               of 
+              24
+              .
             </div>
           </div>
           <div
@@ -354,7 +358,11 @@ exports[`SubsidyRequestManagementTable renders data in a table as expected 1`] =
         className="pgn__data-table-footer"
       >
         <div>
-          Showing 3 of 24.
+          Showing 
+          3
+           of 
+          24
+          .
         </div>
         <div
           className="dropdown"
diff --git a/src/components/TableComponent/index.jsx b/src/components/TableComponent/index.jsx
index 8dab08a920..767802e0fb 100644
--- a/src/components/TableComponent/index.jsx
+++ b/src/components/TableComponent/index.jsx
@@ -16,7 +16,7 @@ const TableComponent = ({
 }) => {
   const sortByColumn = useCallback(args => {
     const { sortBy } = args;
-    if (sortBy.length > 0) {
+    if (sortBy && sortBy.length > 0) {
       const column = sortBy[0];
       const ordering = `${column.desc ? '-' : ''}${column.id}`;
       updateUrl({