Notification toasts, nicer loading, add new user support

frontend/src/hooks/useUser.ts

@@ -1,7 +1,20 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { getUser, type User, updateUser } from "src/api/backend";
+import { createUser, getUser, type User, updateUser } from "src/api/backend";
 
 const fetchUser = (id: number | string) => {
+	if (id === "new") {
+		return Promise.resolve({
+			id: 0,
+			createdOn: "",
+			modifiedOn: "",
+			isDisabled: false,
+			email: "",
+			name: "",
+			nickname: "",
+			roles: [],
+			avatar: "",
+		} as User);
+	}
 	return getUser(id, { expand: "permissions" });
 };
 
@@ -17,8 +30,11 @@ const useUser = (id: string | number, options = {}) => {
 const useSetUser = () => {
 	const queryClient = useQueryClient();
 	return useMutation({
-		mutationFn: (values: User) => updateUser(values),
+		mutationFn: (values: User) => (values.id ? updateUser(values) : createUser(values)),
 		onMutate: (values: User) => {
+			if (!values.id) {
+				return;
+			}
 			const previousObject = queryClient.getQueryData(["user", values.id]);
 			queryClient.setQueryData(["user", values.id], (old: User) => ({
 				...old,