landing_page: add block user option

invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/landing_page/ManageButton.js

@@ -5,11 +5,13 @@
 // under the terms of the MIT License; see LICENSE file for more details.
 
 import React from "react";
-import { Dropdown } from "semantic-ui-react";
+import { Dropdown, Modal, Button, Message } from "semantic-ui-react";
 import { i18next } from "@translations/invenio_app_rdm/i18next";
 import PropTypes from "prop-types";
+import { http } from "react-invenio-forms";
+import { APIRoutes } from "../administration/users/api/routes";
 
-export const ManageButton = ({ recid, recordOwnerUsername }) => {
+export const ManageButton = ({ recid, recordOwnerUsername, recordOwnerId }) => {
   return (
     <Dropdown
       fluid
@@ -35,6 +37,8 @@ export const ManageButton = ({ recid, recordOwnerUsername }) => {
           key="manage_user"
           text={i18next.t("Manage user")}
         />
+        <Dropdown.Divider />
+        {recordOwnerId && <BlockUserItem recordOwnerId={recordOwnerId} />}
       </Dropdown.Menu>
     </Dropdown>
   );
@@ -43,4 +47,62 @@ export const ManageButton = ({ recid, recordOwnerUsername }) => {
 ManageButton.propTypes = {
   recid: PropTypes.string.isRequired,
   recordOwnerUsername: PropTypes.string.isRequired,
+  recordOwnerId: PropTypes.string.isRequired,
+};
+
+const BlockUserItem = ({ recordOwnerId }) => {
+  const [modalOpen, setModalOpen] = React.useState(false);
+  const handleOpen = () => setModalOpen(true);
+  const handleClose = () => setModalOpen(false);
+  const blockUser = () => {
+    http.post(APIRoutes.block({ id: recordOwnerId }));
+    handleClose();
+  };
+
+  return (
+    <>
+      <Dropdown.Item
+        as="a"
+        className="error"
+        onClick={handleOpen}
+        key="block_user"
+        text={i18next.t("Block user")}
+      />
+      <Modal
+        open={modalOpen}
+        closeIcon
+        onClose={handleClose}
+        role="dialog"
+        closeOnDimmerClick={false}
+      >
+        <Modal.Header as="h2">{i18next.t("Block User")}</Modal.Header>
+        <Modal.Description>
+          <Message
+            warning
+            icon="warning sign"
+            content={i18next.t(
+              "Blocking the user will delete all existing records of the user."
+            )}
+          />
+        </Modal.Description>
+        <Modal.Actions>
+          <Button onClick={() => handleClose()} floated="left">
+            Cancel
+          </Button>
+          <Button
+            size="small"
+            labelPosition="left"
+            icon="warning"
+            color="red"
+            content={i18next.t("Block")}
+            onClick={blockUser}
+          />
+        </Modal.Actions>
+      </Modal>
+    </>
+  );
+};
+
+BlockUserItem.propTypes = {
+  recordOwnerId: PropTypes.string.isRequired,
 };

invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/landing_page/RecordManagement.js

@@ -36,7 +36,14 @@ export class RecordManagement extends Component {
       groupsEnabled,
     } = this.props;
     const { error } = this.state;
-    const { id: recid } = record;
+    const {
+      id: recid,
+      parent: {
+        access: {
+          owned_by: { user: recordOwnerId },
+        },
+      },
+    } = record;
     const handleError = (errorMessage) => {
       console.error(errorMessage);
       this.setState({ error: errorMessage });
@@ -46,7 +53,11 @@ export class RecordManagement extends Component {
       <Grid columns={1} className="record-management">
         {permissions.can_moderate && (
           <Grid.Column className="pb-5">
-            <ManageButton recid={recid} recordOwnerUsername={recordOwnerUsername} />
+            <ManageButton
+              recid={recid}
+              recordOwnerUsername={recordOwnerUsername}
+              recordOwnerId={recordOwnerId}
+            />
           </Grid.Column>
         )}
         {permissions.can_edit && !isDraft && (