User management improvements (#1101)

* Show more descriptive success messages for User actions

* Check username uniqueness when creating/updating User

* Adjust translations

* Add tests for `validateUsernameUnique()`

Co-authored-by: Deluan <deluan@navidrome.org>

ui/src/user/DeleteUserButton.js

@@ -3,7 +3,13 @@ import DeleteIcon from '@material-ui/icons/Delete'
 import { makeStyles } from '@material-ui/core/styles'
 import { fade } from '@material-ui/core/styles/colorManipulator'
 import clsx from 'clsx'
-import { useDeleteWithConfirmController, Button, Confirm } from 'react-admin'
+import {
+  useDeleteWithConfirmController,
+  Button,
+  Confirm,
+  useNotify,
+  useRedirect,
+} from 'react-admin'
 
 const useStyles = makeStyles(
   (theme) => ({
@@ -22,22 +28,23 @@ const useStyles = makeStyles(
 )
 
 const DeleteUserButton = (props) => {
-  const {
-    resource,
-    record,
-    basePath,
-    redirect = 'list',
-    className,
-    onClick,
-    ...rest
-  } = props
+  const { resource, record, basePath, className, onClick, ...rest } = props
+
+  const notify = useNotify()
+  const redirect = useRedirect()
+
+  const onSuccess = () => {
+    notify('resources.user.notifications.deleted')
+    redirect('/user')
+  }
+
   const { open, loading, handleDialogOpen, handleDialogClose, handleDelete } =
     useDeleteWithConfirmController({
       resource,
       record,
-      redirect,
       basePath,
       onClick,
+      onSuccess,
     })
 
   const classes = useStyles(props)

ui/src/user/UserCreate.js

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useCallback } from 'react'
 import {
   BooleanInput,
   Create,
@@ -8,18 +8,49 @@ import {
   email,
   SimpleForm,
   useTranslate,
+  useMutation,
+  useNotify,
+  useRedirect,
 } from 'react-admin'
 import { Title } from '../common'
 
 const UserCreate = (props) => {
   const translate = useTranslate()
+  const [mutate] = useMutation()
+  const notify = useNotify()
+  const redirect = useRedirect()
   const resourceName = translate('resources.user.name', { smart_count: 1 })
   const title = translate('ra.page.create', {
     name: `${resourceName}`,
   })
+
+  const save = useCallback(
+    async (values) => {
+      try {
+        await mutate(
+          {
+            type: 'create',
+            resource: 'user',
+            payload: { data: values },
+          },
+          { returnPromise: true }
+        )
+        notify('resources.user.notifications.created', 'info', {
+          smart_count: 1,
+        })
+        redirect('/user')
+      } catch (error) {
+        if (error.body.errors) {
+          return error.body.errors
+        }
+      }
+    },
+    [mutate, notify, redirect]
+  )
+
   return (
     <Create title={<Title subTitle={title} />} {...props}>
-      <SimpleForm redirect="list" variant={'outlined'}>
+      <SimpleForm save={save} variant={'outlined'}>
         <TextInput source="userName" validate={[required()]} />
         <TextInput source="name" validate={[required()]} />
         <TextInput source="email" validate={[email()]} />

ui/src/user/UserEdit.js

@@ -87,7 +87,9 @@ const UserEdit = (props) => {
           },
           { returnPromise: true }
         )
-        notify('ra.notification.updated', 'info', { smart_count: 1 })
+        notify('resources.user.notifications.updated', 'info', {
+          smart_count: 1,
+        })
         permissions === 'admin' ? redirect('/user') : refresh()
       } catch (error) {
         if (error.body.errors) {