From c2de4d49d308835311a98102b3d2bb216143a29c Mon Sep 17 00:00:00 2001
From: Presley <presley@coder.com>
Date: Mon, 25 Apr 2022 16:51:37 +0000
Subject: [PATCH] Get users on page mount

---
 site/src/pages/UsersPage/UsersPage.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/site/src/pages/UsersPage/UsersPage.tsx b/site/src/pages/UsersPage/UsersPage.tsx
index 1c9e405ad3..552ea3a835 100644
--- a/site/src/pages/UsersPage/UsersPage.tsx
+++ b/site/src/pages/UsersPage/UsersPage.tsx
@@ -1,5 +1,5 @@
 import { useActor } from "@xstate/react"
-import React, { useContext } from "react"
+import React, { useContext, useEffect } from "react"
 import { useNavigate } from "react-router"
 import { ErrorSummary } from "../../components/ErrorSummary/ErrorSummary"
 import { XServiceContext } from "../../xServices/StateContext"
@@ -7,10 +7,17 @@ import { UsersPageView } from "./UsersPageView"
 
 export const UsersPage: React.FC = () => {
   const xServices = useContext(XServiceContext)
-  const [usersState] = useActor(xServices.usersXService)
+  const [usersState, usersSend] = useActor(xServices.usersXService)
   const { users, pager, getUsersError } = usersState.context
   const navigate = useNavigate()
 
+  /** 
+   * Fetch users on component mount
+   */
+  useEffect(() => {
+    usersSend("GET_USERS")
+  }, [])
+
   if (usersState.matches("error")) {
     return <ErrorSummary error={getUsersError} />
   } else {