refactor: Move error to UsersPage component

BrunoQuaresma · BrunoQuaresma · commit ab5f1601c7ef · 2022-05-03T15:58:05.000Z
diff --git a/site/src/pages/UsersPage/UsersPage.tsx b/site/src/pages/UsersPage/UsersPage.tsx
@@ -2,7 +2,6 @@ import { useActor } from "@xstate/react"
 import React, { useContext, useEffect } from "react"
 import { useNavigate } from "react-router"
 import { ConfirmDialog } from "../../components/ConfirmDialog/ConfirmDialog"
-import { ErrorSummary } from "../../components/ErrorSummary/ErrorSummary"
 import { FullScreenLoader } from "../../components/Loader/FullScreenLoader"
 import { XServiceContext } from "../../xServices/StateContext"
 import { UsersPageView } from "./UsersPageView"
@@ -26,10 +25,6 @@ export const UsersPage: React.FC = () => {
     usersSend("GET_USERS")
   }, [usersSend])
 
-  if (usersState.matches("error")) {
-    return <ErrorSummary error={getUsersError} />
-  }
-
   if (!users) {
     return <FullScreenLoader />
   } else {
@@ -43,6 +38,7 @@ export const UsersPage: React.FC = () => {
           onSuspendUser={(user) => {
             usersSend({ type: "SUSPEND_USER", userId: user.id })
           }}
+          error={getUsersError}
         />
 
         <ConfirmDialog
diff --git a/site/src/pages/UsersPage/UsersPageView.tsx b/site/src/pages/UsersPage/UsersPageView.tsx
@@ -2,6 +2,7 @@ import Paper from "@material-ui/core/Paper"
 import { makeStyles } from "@material-ui/core/styles"
 import React from "react"
 import { UserResponse } from "../../api/types"
+import { ErrorSummary } from "../../components/ErrorSummary/ErrorSummary"
 import { Header } from "../../components/Header/Header"
 import { UsersTable } from "../../components/UsersTable/UsersTable"
 
@@ -14,16 +15,22 @@ export interface UsersPageViewProps {
   users: UserResponse[]
   openUserCreationDialog: () => void
   onSuspendUser: (user: UserResponse) => void
+  error?: unknown
 }
 
-export const UsersPageView: React.FC<UsersPageViewProps> = ({ users, openUserCreationDialog, onSuspendUser }) => {
+export const UsersPageView: React.FC<UsersPageViewProps> = ({
+  users,
+  openUserCreationDialog,
+  onSuspendUser,
+  error,
+}) => {
   const styles = useStyles()
 
   return (
     <div className={styles.flexColumn}>
       <Header title={Language.pageTitle} action={{ text: Language.newUserButton, onClick: openUserCreationDialog }} />
       <Paper style={{ maxWidth: "1380px", margin: "1em auto", width: "100%" }}>
-        <UsersTable users={users} onSuspendUser={onSuspendUser} />
+        {error ? <ErrorSummary error={error} /> : <UsersTable users={users} onSuspendUser={onSuspendUser} />}
       </Paper>
     </div>
   )
