fixed modals to clear after adding users / tasks / availabilities / events

client/src/app/admin/(availabilities)/AddAvailability.tsx

@@ -2,23 +2,30 @@ import { apiCall } from "@/lib";
 import AvailabilityEditor, { Availability } from "./AvailabilityEditor";
 import { Button } from "@heroui/react";
 import { AddLarge } from "@carbon/icons-react";
+import { useState } from "react";
 
 export default function AddAvailability(props: {
 	isOpen?: boolean;
 	onOpenChange?: (isOpen: boolean) => void;
 	onSuccess?: () => void;
 }) {
+	const [addAvailabilityKey, setAddAvailabilityKey] = useState<number>(0);
+
 	async function addAvailability(a: Availability) {
 		const result = await apiCall("POST", "availabilities", undefined, a);
 
 		if (result.ok) {
-			props.onSuccess?.();
 			props.onOpenChange?.(false);
+
+			setAddAvailabilityKey(addAvailabilityKey + 1);
+
+			props.onSuccess?.();
 		}
 	}
 
 	return (
 		<AvailabilityEditor
+			key={addAvailabilityKey}
 			header="Add Availability"
 			footer={
 				<Button type="submit" color="primary" startContent={<AddLarge />}>

client/src/app/admin/(tasks)/AddTask.tsx

@@ -2,23 +2,30 @@ import { apiCall, Task } from "@/lib";
 import TaskEditor from "./TaskEditor";
 import { Button } from "@heroui/react";
 import { AddLarge } from "@carbon/icons-react";
+import { useState } from "react";
 
 export default function AddTask(props: {
 	isOpen?: boolean;
 	onOpenChange?: (isOpen: boolean) => void;
 	onSuccess?: () => void;
 }) {
+	const [addTaskKey, setAddTaskKey] = useState<number>(0);
+
 	async function addTask(a: Task) {
 		const result = await apiCall("POST", "tasks", undefined, a);
 
 		if (result.ok) {
-			props.onSuccess?.();
 			props.onOpenChange?.(false);
+
+			setAddTaskKey(addTaskKey);
+
+			props.onSuccess?.();
 		}
 	}
 
 	return (
 		<TaskEditor
+			key={addTaskKey}
 			header="Add Task"
 			footer={
 				<Button type="submit" color="primary" startContent={<AddLarge />}>

client/src/app/admin/(users)/AddUser.tsx

@@ -3,23 +3,28 @@ import { AddLarge } from "@carbon/icons-react";
 import { Button } from "@heroui/react";
 import UserEditor from "./UserEditor";
 import { UserAddModify } from "@/Zustand";
+import { useState } from "react";
 
 export default function AddUser(props: {
 	isOpen?: boolean;
 	onOpenChange?: (isOpen: boolean) => void;
 	onSuccess?: () => void;
 }) {
+	const [addUserKey, setAddUserKey] = useState<number>(0);
+
 	// send an addUser request to the backend then reload the table
 	async function sendAddUser(user: UserAddModify) {
 		const result = await apiCall("POST", "users", undefined, user);
 
 		if (result.ok) {
+			setAddUserKey(addUserKey + 1);
 			props.onSuccess?.();
 		}
 	}
 
 	return (
 		<UserEditor
+			key={addUserKey}
 			isPasswordRequired
 			isOpen={props.isOpen}
 			onOpenChange={props.onOpenChange}

client/src/app/admin/(users)/UserEditor.tsx

@@ -101,7 +101,9 @@ export default function UserEditor(props: {
 						<Input
 							isRequired={props.isPasswordRequired}
 							label="Password"
-							color={password.length > 0 ? "warning" : "default"}
+							color={
+								password.length > 0 && !!props.value ? "warning" : "default"
+							}
 							name="password"
 							variant="bordered"
 							value={password}