diff --git a/scm-ui/ui-components/src/modals/ConfirmAlert.tsx b/scm-ui/ui-components/src/modals/ConfirmAlert.tsx
index 45726d314b..89f8f0a117 100644
--- a/scm-ui/ui-components/src/modals/ConfirmAlert.tsx
+++ b/scm-ui/ui-components/src/modals/ConfirmAlert.tsx
@@ -81,6 +81,9 @@ export const ConfirmAlert: FC<Props> = ({ title, message, buttons, close }) => {
   );
 };
 
+/**
+ * @deprecated Please use {@link ConfirmAlert} directly.
+ */
 export function confirmAlert(properties: Props) {
   const root = document.getElementById("modalRoot");
   if (root) {
diff --git a/scm-ui/ui-webapp/src/admin/roles/containers/DeleteRepositoryRole.tsx b/scm-ui/ui-webapp/src/admin/roles/containers/DeleteRepositoryRole.tsx
index 1308bb8f70..06e719f0ab 100644
--- a/scm-ui/ui-webapp/src/admin/roles/containers/DeleteRepositoryRole.tsx
+++ b/scm-ui/ui-webapp/src/admin/roles/containers/DeleteRepositoryRole.tsx
@@ -23,35 +23,24 @@
  */
 import React, { FC, useState } from "react";
 import { connect } from "react-redux";
-import { compose } from "redux";
-import { withRouter } from "react-router-dom";
-import { WithTranslation, withTranslation } from "react-i18next";
-import { History } from "history";
+import { useHistory } from "react-router-dom";
+import { useTranslation } from "react-i18next";
 import { RepositoryRole } from "@scm-manager/ui-types";
 import { ConfirmAlert, DeleteButton, ErrorNotification, Level } from "@scm-manager/ui-components";
 import { deleteRole, getDeleteRoleFailure, isDeleteRolePending } from "../modules/roles";
 
-type Props = WithTranslation & {
+type Props = {
   loading: boolean;
   error: Error;
   role: RepositoryRole;
   confirmDialog?: boolean;
   deleteRole: (role: RepositoryRole, callback?: () => void) => void;
-
-  // context props
-  history: History;
 };
 
-const DeleteRepositoryRole: FC<Props> = ({
-  confirmDialog = true,
-  history,
-  deleteRole,
-  role,
-  loading,
-  error,
-  t
-}: Props) => {
+const DeleteRepositoryRole: FC<Props> = ({ confirmDialog = true, deleteRole, role, loading, error }: Props) => {
   const [showConfirmAlert, setShowConfirmAlert] = useState(false);
+  const [t] = useTranslation("admin");
+  const history = useHistory();
 
   const roleDeleted = () => {
     history.push("/admin/roles/");
@@ -122,8 +111,4 @@ const mapDispatchToProps = (dispatch: any) => {
   };
 };
 
-export default compose(
-  connect(mapStateToProps, mapDispatchToProps),
-  withRouter,
-  withTranslation("admin")
-)(DeleteRepositoryRole);
+export default connect(mapStateToProps, mapDispatchToProps)(DeleteRepositoryRole);
diff --git a/scm-ui/ui-webapp/src/groups/containers/DeleteGroup.tsx b/scm-ui/ui-webapp/src/groups/containers/DeleteGroup.tsx
index 62515fd955..cdd98d597d 100644
--- a/scm-ui/ui-webapp/src/groups/containers/DeleteGroup.tsx
+++ b/scm-ui/ui-webapp/src/groups/containers/DeleteGroup.tsx
@@ -23,27 +23,24 @@
  */
 import React, { FC, useState } from "react";
 import { connect } from "react-redux";
-import { compose } from "redux";
-import { withRouter } from "react-router-dom";
-import { WithTranslation, withTranslation } from "react-i18next";
-import { History } from "history";
+import { useHistory } from "react-router-dom";
+import { useTranslation } from "react-i18next";
 import { Group } from "@scm-manager/ui-types";
 import { ConfirmAlert, DeleteButton, ErrorNotification, Level } from "@scm-manager/ui-components";
 import { deleteGroup, getDeleteGroupFailure, isDeleteGroupPending } from "../modules/groups";
 
-type Props = WithTranslation & {
+type Props = {
   loading: boolean;
   error: Error;
   group: Group;
   confirmDialog?: boolean;
   deleteGroup: (group: Group, callback?: () => void) => void;
-
-  // context props
-  history: History;
 };
 
-export const DeleteGroup: FC<Props> = ({ confirmDialog = true, group, history, t, deleteGroup, loading, error }) => {
+export const DeleteGroup: FC<Props> = ({ confirmDialog = true, group, deleteGroup, loading, error }) => {
   const [showConfirmAlert, setShowConfirmAlert] = useState(false);
+  const [t] = useTranslation("groups");
+  const history = useHistory();
 
   const deleteGroupCallback = () => {
     deleteGroup(group, groupDeleted);
@@ -114,8 +111,4 @@ const mapDispatchToProps = (dispatch: any) => {
   };
 };
 
-export default compose(
-  connect(mapStateToProps, mapDispatchToProps),
-  withRouter,
-  withTranslation("groups")
-)(DeleteGroup);
+export default connect(mapStateToProps, mapDispatchToProps)(DeleteGroup);
diff --git a/scm-ui/ui-webapp/src/repos/containers/DeleteRepo.tsx b/scm-ui/ui-webapp/src/repos/containers/DeleteRepo.tsx
index 18ecf8c171..8de545f790 100644
--- a/scm-ui/ui-webapp/src/repos/containers/DeleteRepo.tsx
+++ b/scm-ui/ui-webapp/src/repos/containers/DeleteRepo.tsx
@@ -23,24 +23,24 @@
  */
 import React, { FC, useState } from "react";
 import { connect } from "react-redux";
-import { compose } from "redux";
-import { RouteComponentProps, withRouter } from "react-router-dom";
-import { WithTranslation, withTranslation } from "react-i18next";
+import { useHistory } from "react-router-dom";
+import { useTranslation } from "react-i18next";
 import { Repository } from "@scm-manager/ui-types";
 import { ConfirmAlert, DeleteButton, ErrorNotification, Level } from "@scm-manager/ui-components";
 import { deleteRepo, getDeleteRepoFailure, isDeleteRepoPending } from "../modules/repos";
 
-type Props = RouteComponentProps &
-  WithTranslation & {
-    loading: boolean;
-    error: Error;
-    repository: Repository;
-    confirmDialog?: boolean;
-    deleteRepo: (p1: Repository, p2: () => void) => void;
-  };
+type Props = {
+  loading: boolean;
+  error: Error;
+  repository: Repository;
+  confirmDialog?: boolean;
+  deleteRepo: (p1: Repository, p2: () => void) => void;
+};
 
-const DeleteRepo: FC<Props> = ({ confirmDialog = true, repository, history, deleteRepo, loading, error, t }: Props) => {
+const DeleteRepo: FC<Props> = ({ confirmDialog = true, repository, deleteRepo, loading, error }: Props) => {
   const [showConfirmAlert, setShowConfirmAlert] = useState(false);
+  const [t] = useTranslation("repos");
+  const history = useHistory();
 
   const deleted = () => {
     history.push("/repos/");
@@ -120,4 +120,4 @@ const mapDispatchToProps = (dispatch: any) => {
   };
 };
 
-export default compose(connect(mapStateToProps, mapDispatchToProps), withRouter, withTranslation("repos"))(DeleteRepo);
+export default connect(mapStateToProps, mapDispatchToProps)(DeleteRepo);
diff --git a/scm-ui/ui-webapp/src/repos/permissions/components/buttons/DeletePermissionButton.tsx b/scm-ui/ui-webapp/src/repos/permissions/components/buttons/DeletePermissionButton.tsx
index 9ae010dc80..d4febfdcf0 100644
--- a/scm-ui/ui-webapp/src/repos/permissions/components/buttons/DeletePermissionButton.tsx
+++ b/scm-ui/ui-webapp/src/repos/permissions/components/buttons/DeletePermissionButton.tsx
@@ -22,11 +22,11 @@
  * SOFTWARE.
  */
 import React, { FC, useState } from "react";
-import { WithTranslation, withTranslation } from "react-i18next";
+import { useTranslation } from "react-i18next";
 import { Permission } from "@scm-manager/ui-types";
 import { ConfirmAlert } from "@scm-manager/ui-components";
 
-type Props = WithTranslation & {
+type Props = {
   permission: Permission;
   namespace: string;
   repoName: string;
@@ -39,11 +39,11 @@ const DeletePermissionButton: FC<Props> = ({
   confirmDialog = true,
   permission,
   namespace,
-  t,
   deletePermission,
   repoName
 }) => {
   const [showConfirmAlert, setShowConfirmAlert] = useState(false);
+  const [t] = useTranslation("repos");
 
   const deletePermissionCallback = () => {
     deletePermission(permission, namespace, repoName);
@@ -93,4 +93,4 @@ const DeletePermissionButton: FC<Props> = ({
   );
 };
 
-export default withTranslation("repos")(DeletePermissionButton);
+export default DeletePermissionButton;
diff --git a/scm-ui/ui-webapp/src/users/containers/DeleteUser.tsx b/scm-ui/ui-webapp/src/users/containers/DeleteUser.tsx
index 849f1e4e52..c2024894d0 100644
--- a/scm-ui/ui-webapp/src/users/containers/DeleteUser.tsx
+++ b/scm-ui/ui-webapp/src/users/containers/DeleteUser.tsx
@@ -23,27 +23,24 @@
  */
 import React, { FC, useState } from "react";
 import { connect } from "react-redux";
-import { compose } from "redux";
-import { withRouter } from "react-router-dom";
-import { WithTranslation, withTranslation } from "react-i18next";
-import { History } from "history";
+import { useHistory } from "react-router-dom";
+import { useTranslation } from "react-i18next";
 import { User } from "@scm-manager/ui-types";
 import { ConfirmAlert, DeleteButton, ErrorNotification, Level } from "@scm-manager/ui-components";
 import { deleteUser, getDeleteUserFailure, isDeleteUserPending } from "../modules/users";
 
-type Props = WithTranslation & {
+type Props = {
   loading: boolean;
   error: Error;
   user: User;
   confirmDialog?: boolean;
   deleteUser: (user: User, callback?: () => void) => void;
-
-  // context props
-  history: History;
 };
 
-const DeleteUser: FC<Props> = ({ confirmDialog = true, loading, error, t, history, user, deleteUser }) => {
+const DeleteUser: FC<Props> = ({ confirmDialog = true, loading, error, user, deleteUser }) => {
   const [showConfirmAlert, setShowConfirmAlert] = useState(false);
+  const [t] = useTranslation("users");
+  const history = useHistory();
 
   const userDeleted = () => {
     history.push("/users/");
@@ -114,4 +111,4 @@ const mapDispatchToProps = (dispatch: any) => {
   };
 };
 
-export default compose(connect(mapStateToProps, mapDispatchToProps), withRouter, withTranslation("users"))(DeleteUser);
+export default connect(mapStateToProps, mapDispatchToProps)(DeleteUser);