diff --git a/components/Admin/RegisteredUsers.tsx b/components/Admin/RegisteredUsers.tsx
index f43a0ba4d..6e3eb7d6f 100644
--- a/components/Admin/RegisteredUsers.tsx
+++ b/components/Admin/RegisteredUsers.tsx
@@ -1,50 +1,49 @@
 import { UserWithSupertokens } from 'services/userService'
 import style from './admin.module.css'
 import moment from 'moment'
+import TableContainer from '../../components/TableContainer/TableContainer'
 
 interface IProps {
   users: UserWithSupertokens[]
 }
 
-export default ({ users }: IProps): JSX.Element => {
+export default function RegisteredUsers({ users }: IProps): JSX.Element {
   if (users === undefined) return <></>
-  return <table style={{ width: 500 }}>
-      <thead>
-        <tr>
-          <th>Registered</th>
-          <th>Email</th>
-          <th>Admin</th>
-        </tr>
-      </thead>
-      <tbody>
-        {users.map(u => {
-          if (u.stUser === undefined) {
-            return <tr key={u.userProfile?.id}>
-              <td>
-                <span>NO ST USER FOUND</span>
-              </td>
-              <td>
-                <span>{u.userProfile?.id}</span>
-              </td>
-              <td>
-                {u.userProfile?.isAdmin === true ? <span className={style.admin}>Yes</span> : 'No'}
-              </td>
 
-            </tr>
-          } else {
-            return <tr key={u.stUser.id}>
-            <td>
-              <span> {moment(u.stUser.timeJoined).fromNow()} </span>
-            </td>
-            <td>
-              <a href={`/api/auth/dashboard/?userid=${u.stUser.id}&recipeId=emailpassword`} target="_blank"><span className={style.userEmail}>{u.stUser.email}</span></a>
-            </td>
-            <td>
-              {u.userProfile.isAdmin === true ? <span className={style.admin}>Yes</span> : 'No'}
-            </td>
-          </tr>
-          }
-        })}
-    </tbody>
-  </table>
+  const columns = [
+    {
+      Header: 'Registered',
+      accessor: 'registered',
+      Cell: ({ cell }: any) => <span>{cell.value}</span>
+    },
+    {
+      Header: 'Email',
+      accessor: 'email',
+      Cell: ({ cell }: any) => (
+        <a
+          href={`/api/auth/dashboard/?userid=${cell.row.original.id}&recipeId=emailpassword`}
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          <span className={style.userEmail}>{cell.value}</span>
+        </a>
+      )
+    },
+    {
+      Header: 'Admin',
+      accessor: 'isAdmin',
+      Cell: ({ cell }: any) => (
+        cell.value === true ? <span className={style.admin}>Yes</span> : 'No'
+      )
+    }
+  ]
+  console.log({users})
+  const data = users.map(user => ({
+    id: (user.stUser?.id === undefined || user.stUser?.id === '') ? user.userProfile?.id : user.stUser?.id,
+    registered: user.stUser ? moment(user.stUser.timeJoined).fromNow() : 'NO ST USER FOUND',
+    email: (user.stUser?.email === undefined || user.stUser?.email === '') ? user.userProfile?.id : user.stUser?.email,
+    isAdmin: user.userProfile?.isAdmin
+  }))
+
+  return <TableContainer columns={columns} data={data} ssr />
 }