Add action creator, thunk, reducer, & api for updating Chronograf uesr

ui/src/admin/actions/chronograf.js

@@ -2,6 +2,7 @@ import {
   getUsers as getUsersAJAX,
   getOrganizations as getOrganizationsAJAX,
   createUser as createUserAJAX,
+  updateUser as updateUserAJAX,
   deleteUser as deleteUserAJAX,
   createOrganization as createOrganizationAJAX,
   renameOrganization as renameOrganizationAJAX,
@@ -35,6 +36,14 @@ export const addUser = user => ({
   },
 })
 
+export const updateUser = (user, updatedUser) => ({
+  type: 'CHRONOGRAF_UPDATE_USER',
+  payload: {
+    user,
+    updatedUser,
+  },
+})
+
 export const syncUser = (staleUser, syncedUser) => ({
   type: 'CHRONOGRAF_SYNC_USER',
   payload: {
@@ -110,6 +119,19 @@ export const createUserAsync = (url, user) => async dispatch => {
   }
 }
 
+export const updateUserAsync = (user, updatedUser) => async dispatch => {
+  dispatch(updateUser(user, updatedUser))
+  try {
+    const {data} = await updateUserAJAX(updatedUser)
+    // it's not necessary to syncUser again but it's useful for good
+    // measure and for the clarity of insight in the redux story
+    dispatch(syncUser(user, data))
+  } catch (error) {
+    dispatch(errorThrown(error))
+    dispatch(syncUser(user, user))
+  }
+}
+
 export const deleteUserAsync = user => async dispatch => {
   dispatch(removeUser(user))
   try {

ui/src/admin/apis/chronograf.js

@@ -37,6 +37,19 @@ export const createUser = async (url, user) => {
   }
 }
 
+export const updateUser = async user => {
+  try {
+    return await AJAX({
+      method: 'PATCH',
+      url: user.links.self,
+      data: user,
+    })
+  } catch (error) {
+    console.error(error)
+    throw error
+  }
+}
+
 export const deleteUser = async url => {
   try {
     return await AJAX({

ui/src/admin/reducers/chronograf.js

@@ -20,6 +20,15 @@ const adminChronograf = (state = initialState, action) => {
       return {...state, users: [user, ...state.users]}
     }
 
+    case 'CHRONOGRAF_UPDATE_USER': {
+      const {user, updatedUser} = action.payload
+      return {
+        ...state,
+        users: state.users.map(
+          u => (u.links.self === user.links.self ? {...updatedUser} : u)
+        ),
+      }
+    }
     case 'CHRONOGRAF_SYNC_USER': {
       const {staleUser, syncedUser} = action.payload
       return {