From b73fb80a9b809ed010e0aa8f3ff4998cb9a9e2e5 Mon Sep 17 00:00:00 2001
From: Presley <presley@coder.com>
Date: Fri, 22 Apr 2022 16:57:24 +0000
Subject: [PATCH] Hook up api

---
 site/src/api/index.ts                       |  6 +++
 site/src/components/GlobalSnackbar/utils.ts |  4 ++
 site/src/xServices/users/usersXService.ts   | 48 ++++++++++++++++++---
 3 files changed, 52 insertions(+), 6 deletions(-)

diff --git a/site/src/api/index.ts b/site/src/api/index.ts
index 232a188a32..4e2c4c7df9 100644
--- a/site/src/api/index.ts
+++ b/site/src/api/index.ts
@@ -2,6 +2,7 @@ import axios, { AxiosRequestHeaders } from "axios"
 import { mutate } from "swr"
 import { MockPager, MockUser, MockUser2 } from "../testHelpers/entities"
 import * as Types from "./types"
+import * as GenTypes from "./typesGenerated"
 
 const CONTENT_TYPE_JSON: AxiosRequestHeaders = {
   "Content-Type": "application/json",
@@ -79,6 +80,11 @@ export const getUsers = async (): Promise<Types.PagedUsers> => {
   })
 }
 
+export const createUser = async (user: GenTypes.CreateUserRequest): Promise<GenTypes.User> => {
+  const response = await axios.post<GenTypes.User>("/api/v2/users/", user)
+  return response.data
+}
+
 export const getBuildInfo = async (): Promise<Types.BuildInfoResponse> => {
   const response = await axios.get("/api/v2/buildinfo")
   return response.data
diff --git a/site/src/components/GlobalSnackbar/utils.ts b/site/src/components/GlobalSnackbar/utils.ts
index 84fda4afa3..90e69e238f 100644
--- a/site/src/components/GlobalSnackbar/utils.ts
+++ b/site/src/components/GlobalSnackbar/utils.ts
@@ -60,3 +60,7 @@ export const displayMsg = (msg: string, additionalMsg?: string): void => {
 export const displaySuccess = (msg: string, additionalMsg?: string): void => {
   dispatchNotificationEvent(MsgType.Success, msg, additionalMsg ? [additionalMsg] : undefined)
 }
+
+export const displayError = (msg: string, additionalMsg?: string): void => {
+  dispatchNotificationEvent(MsgType.Error, msg, additionalMsg ? [additionalMsg] : undefined)
+}
diff --git a/site/src/xServices/users/usersXService.ts b/site/src/xServices/users/usersXService.ts
index d02c98b84b..9277c58b74 100644
--- a/site/src/xServices/users/usersXService.ts
+++ b/site/src/xServices/users/usersXService.ts
@@ -1,14 +1,22 @@
 import { assign, createMachine } from "xstate"
 import * as API from "../../api"
 import * as Types from "../../api/types"
+import * as GenTypes from "../../api/typesGenerated"
+import { displayError } from "../../components/GlobalSnackbar/utils"
+
+const Language = {
+  createUserError: "Unable to create user",
+  createUserSuccess: "Successfully created user"
+}
 
 export interface UsersContext {
   users: Types.UserResponse[]
   pager?: Types.Pager
   getUsersError?: Error | unknown
+  createUserError?: Error | unknown
 }
 
-export type UsersEvent = { type: "GET_USERS" }
+export type UsersEvent = { type: "GET_USERS" } | { type: "CREATE", user: GenTypes.CreateUserRequest }
 
 export const usersMachine = createMachine(
   {
@@ -19,6 +27,9 @@ export const usersMachine = createMachine(
       services: {} as {
         getUsers: {
           data: Types.PagedUsers
+        },
+        createUser: {
+          data: GenTypes.User
         }
       },
     },
@@ -26,15 +37,21 @@ export const usersMachine = createMachine(
     context: {
       users: [],
     },
-    initial: "gettingUsers",
+    initial: "idle",
     states: {
+      idle: {
+        on: {
+          GET_USERS: "gettingUsers",
+          CREATE: "creatingUser"
+        },
+      },
       gettingUsers: {
         invoke: {
           src: "getUsers",
           id: "getUsers",
           onDone: [
             {
-              target: "#usersState.ready",
+              target: "#usersState.idle",
               actions: ["assignUsers", "clearGetUsersError"],
             },
           ],
@@ -47,10 +64,20 @@ export const usersMachine = createMachine(
         },
         tags: "loading",
       },
-      ready: {
-        on: {
-          GET_USERS: "gettingUsers",
+      creatingUser: {
+        invoke: {
+          src: "createUser",
+          id: "createUser",
+          onDone: {
+            target: "gettingUsers",
+            actions: "displayCreateUserSuccess"
+          },
+          onError: {
+            target: "idle",
+            actions: "displayCreateUserError"
+          }
         },
+        tags: "loading"
       },
       error: {
         on: {
@@ -62,6 +89,9 @@ export const usersMachine = createMachine(
   {
     services: {
       getUsers: API.getUsers,
+      createUser: (_, event) => (
+        API.createUser(event.user)
+      )
     },
     actions: {
       assignUsers: assign({
@@ -75,6 +105,12 @@ export const usersMachine = createMachine(
         ...context,
         getUsersError: undefined,
       })),
+      displayCreateUserError: () => {
+        displayError(Language.createUserError)
+      },
+      displayCreateUserSuccess: () => {
+        displayError(Language.createUserSuccess)
+      }
     },
   },
 )