More react

- consolidated lang items
- proxy host paths work

frontend/src/modals/DeleteConfirmModal.tsx

@@ -7,7 +7,8 @@ import { Button } from "src/components";
 import { T } from "src/locale";
 
 interface ShowProps {
-	title: string;
+	title?: ReactNode;
+	tTitle?: string;
 	children: ReactNode;
 	onConfirm: () => Promise<void> | void;
 	invalidations?: any[];
@@ -19,59 +20,59 @@ const showDeleteConfirmModal = (props: ShowProps) => {
 	EasyModal.show(DeleteConfirmModal, props);
 };
 
-const DeleteConfirmModal = EasyModal.create(({ title, children, onConfirm, invalidations, visible, remove }: Props) => {
-	const queryClient = useQueryClient();
-	const [error, setError] = useState<ReactNode | null>(null);
-	const [isSubmitting, setIsSubmitting] = useState(false);
+const DeleteConfirmModal = EasyModal.create(
+	({ title, tTitle, children, onConfirm, invalidations, visible, remove }: Props) => {
+		const queryClient = useQueryClient();
+		const [error, setError] = useState<ReactNode | null>(null);
+		const [isSubmitting, setIsSubmitting] = useState(false);
 
-	const onSubmit = async () => {
-		if (isSubmitting) return;
-		setIsSubmitting(true);
-		setError(null);
-		try {
-			await onConfirm();
-			remove();
-			// invalidate caches as requested
-			invalidations?.forEach((inv) => {
-				queryClient.invalidateQueries({ queryKey: inv });
-			});
-		} catch (err: any) {
-			setError(<T id={err.message} />);
-		}
-		setIsSubmitting(false);
-	};
+		const onSubmit = async () => {
+			if (isSubmitting) return;
+			setIsSubmitting(true);
+			setError(null);
+			try {
+				await onConfirm();
+				remove();
+				// invalidate caches as requested
+				invalidations?.forEach((inv) => {
+					queryClient.invalidateQueries({ queryKey: inv });
+				});
+			} catch (err: any) {
+				setError(<T id={err.message} />);
+			}
+			setIsSubmitting(false);
+		};
 
-	return (
-		<Modal show={visible} onHide={remove}>
-			<Modal.Header closeButton>
-				<Modal.Title>
-					<T id={title} />
-				</Modal.Title>
-			</Modal.Header>
-			<Modal.Body>
-				<Alert variant="danger" show={!!error} onClose={() => setError(null)} dismissible>
-					{error}
-				</Alert>
-				{children}
-			</Modal.Body>
-			<Modal.Footer>
-				<Button data-bs-dismiss="modal" onClick={remove} disabled={isSubmitting}>
-					<T id="cancel" />
-				</Button>
-				<Button
-					type="submit"
-					actionType="primary"
-					className="ms-auto btn-red"
-					data-bs-dismiss="modal"
-					isLoading={isSubmitting}
-					disabled={isSubmitting}
-					onClick={onSubmit}
-				>
-					<T id="action.delete" />
-				</Button>
-			</Modal.Footer>
-		</Modal>
-	);
-});
+		return (
+			<Modal show={visible} onHide={remove}>
+				<Modal.Header closeButton>
+					<Modal.Title>{tTitle ? <T id={tTitle} /> : title ? title : null}</Modal.Title>
+				</Modal.Header>
+				<Modal.Body>
+					<Alert variant="danger" show={!!error} onClose={() => setError(null)} dismissible>
+						{error}
+					</Alert>
+					{children}
+				</Modal.Body>
+				<Modal.Footer>
+					<Button data-bs-dismiss="modal" onClick={remove} disabled={isSubmitting}>
+						<T id="cancel" />
+					</Button>
+					<Button
+						type="submit"
+						actionType="primary"
+						className="ms-auto btn-red"
+						data-bs-dismiss="modal"
+						isLoading={isSubmitting}
+						disabled={isSubmitting}
+						onClick={onSubmit}
+					>
+						<T id="action.delete" />
+					</Button>
+				</Modal.Footer>
+			</Modal>
+		);
+	},
+);
 
 export { showDeleteConfirmModal };