invenio-app-rdm 8.0.0.dev9__py2.py3-none-any.whl → 14.0.0b4.dev4__py2.py3-none-any.whl

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

@@ -1,24 +1,27 @@
 // This file is part of InvenioRDM
-// Copyright (C) 2020-2021 CERN.
+// Copyright (C) 2020-2024 CERN.
 // Copyright (C) 2020-2021 Northwestern University.
 // Copyright (C) 2021 Graz University of Technology.
 //
 // Invenio RDM Records is free software; you can redistribute it and/or modify it
 // under the terms of the MIT License; see LICENSE file for more details.
 
-import axios from "axios";
 import _get from "lodash/get";
 import React, { useEffect, useState } from "react";
-import { Grid, Icon, Message, Placeholder, List } from "semantic-ui-react";
+import { Grid, Icon, Message, Placeholder, List, Divider } from "semantic-ui-react";
 import { i18next } from "@translations/invenio_app_rdm/i18next";
+import PropTypes from "prop-types";
+import { withCancel, http, ErrorMessage } from "react-invenio-forms";
 
 const deserializeRecord = (record) => ({
   id: record.id,
+  parent: record.parent,
   parent_id: record.parent.id,
   publication_date: record.ui.publication_date_l10n_medium,
   version: record.ui.version,
   links: record.links,
   pids: record.pids,
+  new_draft_parent_doi: record.ui.new_draft_parent_doi,
 });
 
 const NUMBER_OF_VERSIONS = 5;
@@ -26,78 +29,68 @@ const NUMBER_OF_VERSIONS = 5;
 const RecordVersionItem = ({ item, activeVersion }) => {
   const doi = _get(item.pids, "doi.identifier", "");
   return (
-      <List.Item
-        key={item.id}
-        {...(activeVersion && { className: "version-active" })}
-      >
-        <List.Content floated="left">
-          { activeVersion ?
-            <span>{i18next.t('Version')} {item.version}</span>
-            :
-            <a href={`/records/${item.id}`}>{i18next.t('Version')} {item.version}</a>
-          }
-
-          {doi && (
-            <small className={'doi' + (activeVersion ? ' text-muted-on-bg' : ' text-muted')}>
-              {doi}
-            </small>
-          )}
-        </List.Content>
-
-        <List.Content floated="right">
-          <small className={activeVersion ? 'text-muted-on-bg' : 'text-muted'}>
-            {item.publication_date}
-          </small>
-        </List.Content>
-      </List.Item>
-  );
-};
+    <List.Item key={item.id} {...(activeVersion && { className: "version active" })}>
+      <List.Content floated="left">
+        {activeVersion ? (
+          <span className="text-break">
+            {i18next.t("Version {{- version}}", { version: item.version })}
+          </span>
+        ) : (
+          <a href={`/records/${item.id}`} className="text-break">
+            {i18next.t("Version {{- version}}", { version: item.version })}
+          </a>
+        )}
+
+        {doi && (
+          <a
+            href={`https://doi.org/${doi}`}
+            className={"doi" + (activeVersion ? " text-muted-darken" : " text-muted")}
+          >
+            {doi}
+          </a>
+        )}
+      </List.Content>
 
-const PlaceholderLoader = ({ size = NUMBER_OF_VERSIONS }) => {
-  const PlaceholderItem = () => (
-    <Placeholder.Header>
-      <Placeholder.Line />
-      <Placeholder.Line />
-    </Placeholder.Header>
+      <List.Content floated="right">
+        <small className={activeVersion ? "text-muted-darken" : "text-muted"}>
+          {item.publication_date}
+        </small>
+      </List.Content>
+    </List.Item>
   );
-  let numberOfHeader = [];
-  for (let i = 0; i < size; i++) {
-    numberOfHeader.push(<PlaceholderItem key={i} />);
-  }
+};
 
-  return <Placeholder>{numberOfHeader}</Placeholder>;
+RecordVersionItem.propTypes = {
+  item: PropTypes.object.isRequired,
+  activeVersion: PropTypes.bool.isRequired,
 };
 
 const PreviewMessage = () => {
   return (
-    <Grid className="preview-message">
-      <Grid.Row>
-        <Grid.Column className="versions-preview-info">
-          <Message info>
-            <Message.Header>
-              <Icon name="eye" />
-              {i18next.t('Preview')}
-            </Message.Header>
-            <p>{i18next.t('Only published versions are displayed.')}</p>
-          </Message>
-        </Grid.Column>
-      </Grid.Row>
-    </Grid>
+    <Message info className="no-border-radius m-0">
+      <Message.Header>
+        <Icon name="eye" />
+        {i18next.t("Preview")}
+      </Message.Header>
+      <p>{i18next.t("Only published versions are displayed.")}</p>
+    </Message>
   );
 };
 
-export const RecordVersionsList = (props) => {
-  const record = deserializeRecord(props.record);
-  const { isPreview } = props;
-  const recid = record.id;
+export const RecordVersionsList = ({ record, isPreview }) => {
+  const recordDeserialized = deserializeRecord(record);
+  const recordParentDOI = recordDeserialized?.parent?.pids?.doi?.identifier;
+  const recordDraftParentDOIFormat = recordDeserialized?.new_draft_parent_doi;
+  const recid = recordDeserialized.id;
   const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
   const [currentRecordInResults, setCurrentRecordInResults] = useState(false);
   const [recordVersions, setRecordVersions] = useState({});
 
   useEffect(() => {
-    async function fetchVersions() {
-      const result = await axios(
-        `${record.links.versions}?size=${NUMBER_OF_VERSIONS}&sort=version&allversions=true`,
+    const fetchVersions = async () => {
+      return await http.get(
+        `${recordDeserialized.links.versions}?size=${NUMBER_OF_VERSIONS}&sort=version&allversions=true`,
         {
           headers: {
             Accept: "application/vnd.inveniordm.v1+json",
@@ -105,18 +98,54 @@ export const RecordVersionsList = (props) => {
           withCredentials: true,
         }
       );
-      let { hits, total } = result.data.hits;
-      hits = hits.map(deserializeRecord);
-      setCurrentRecordInResults(hits.some((record) => record.id === recid));
-      setRecordVersions({ hits, total });
-      setLoading(false);
+    };
+
+    const cancellableFetchVersions = withCancel(fetchVersions());
+
+    async function fetchVersionsAndSetState() {
+      try {
+        const result = await cancellableFetchVersions.promise;
+        let { hits, total } = result.data.hits;
+        hits = hits.map(deserializeRecord);
+        setCurrentRecordInResults(hits.some((record) => record.id === recid));
+        setRecordVersions({ hits, total });
+        setLoading(false);
+      } catch (error) {
+        if (error !== "UNMOUNTED") {
+          setError(i18next.t("An error occurred while fetching the versions."));
+          setLoading(false);
+        }
+      }
     }
-    fetchVersions();
-  }, []);
+    fetchVersionsAndSetState();
+
+    return () => {
+      cancellableFetchVersions?.cancel();
+    };
+  }, [recordDeserialized.links.versions, recid]);
 
-  return loading ? (
-    <>{isPreview ? <PreviewMessage /> : <PlaceholderLoader />}</>
-  ) : (
+  const loadingcmp = () => {
+    return isPreview ? (
+      <PreviewMessage />
+    ) : (
+      <>
+        <div className="rel-p-1" />
+        <Placeholder className="rel-ml-1 rel-mr-1">
+          <Placeholder.Header>
+            <Placeholder.Line />
+            <Placeholder.Line />
+            <Placeholder.Line />
+          </Placeholder.Header>
+        </Placeholder>
+      </>
+    );
+  };
+
+  const errorMessagecmp = () => (
+    <ErrorMessage className="rel-mr-1 rel-ml-1" content={i18next.t(error)} negative />
+  );
+
+  const recordVersionscmp = () => (
     <List divided>
       {isPreview ? <PreviewMessage /> : null}
       {recordVersions.hits.map((item) => (
@@ -128,24 +157,59 @@ export const RecordVersionsList = (props) => {
       ))}
       {!currentRecordInResults && (
         <>
-          <Grid padded className="dots">
-            <Grid.Row centered>...</Grid.Row>
-          </Grid>
-          <RecordVersionItem item={record} activeVersion={true} />
+          <Divider horizontal>...</Divider>
+          <RecordVersionItem item={recordDeserialized} activeVersion />
         </>
       )}
-      { recordVersions.total > 1 &&
-        <Grid className="all-versions-link">
+      {recordVersions.total > 1 && (
+        <Grid className="mt-0">
           <Grid.Row centered>
             <a
-              href={`/search?q=parent.id:${record.parent_id}&sort=version&f=allversions:true`}
+              href={`/search?q=parent.id:${recordDeserialized.parent_id}&sort=version&f=allversions:true`}
               className="font-small"
             >
-              {i18next.t(`View all {{total}} versions`,{total:recordVersions.total})}
+              {i18next.t(`View all {{count}} versions`, {
+                count: recordVersions.total,
+              })}
             </a>
           </Grid.Row>
         </Grid>
-      }
+      )}
+      {recordParentDOI ? (
+        <List.Item className="parent-doi pr-0">
+          <List.Content floated="left">
+            <p className="text-muted">
+              <strong>{i18next.t("Cite all versions?")}</strong>{" "}
+              {i18next.t("You can cite all versions by using the DOI")}{" "}
+              <a href={recordDeserialized.links.parent_doi}>{recordParentDOI}</a>.{" "}
+              {i18next.t(
+                "This DOI represents all versions, and will always resolve to the latest one."
+              )}{" "}
+              <a href="/help/versioning">{i18next.t("Read more")}</a>.
+            </p>
+          </List.Content>
+        </List.Item>
+      ) : recordDraftParentDOIFormat ? (
+        // new drafts without registered parent dois yet
+        <List.Item className="parent-doi pr-0">
+          <List.Content floated="left">
+            <p className="text-muted">
+              <strong>{i18next.t("Cite all versions?")}</strong>{" "}
+              {i18next.t("You can cite all versions by using the DOI")}{" "}
+              {recordDraftParentDOIFormat}.{" "}
+              {i18next.t("The DOI is registered when the first version is published.")}{" "}
+              <a href="/help/versioning">{i18next.t("Read more")}</a>.
+            </p>
+          </List.Content>
+        </List.Item>
+      ) : null}
     </List>
   );
+
+  return loading ? loadingcmp() : error ? errorMessagecmp() : recordVersionscmp();
+};
+
+RecordVersionsList.propTypes = {
+  record: PropTypes.object.isRequired,
+  isPreview: PropTypes.bool.isRequired,
 };

invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/landing_page/RemoveFromCommunity/RemoveFromCommunityAction.js

@@ -0,0 +1,188 @@
+// This file is part of InvenioRDM
+// Copyright (C) 2023 CERN.
+// Copyright (C) 2023 KTH Royal Institute of Technology
+//
+// Invenio App RDM is free software; you can redistribute it and/or modify it
+// under the terms of the MIT License; see LICENSE file for more details.
+
+import React, { Component } from "react";
+import { Button, Modal, Message, Icon, Checkbox } from "semantic-ui-react";
+import { i18next } from "@translations/invenio_app_rdm/i18next";
+import { http, ErrorMessage } from "react-invenio-forms";
+import PropTypes from "prop-types";
+
+export class RemoveFromCommunityAction extends Component {
+  constructor(props) {
+    super(props);
+    this.INITIAL_STATE = {
+      modalOpen: false,
+      loading: false,
+      error: undefined,
+      checkboxMembers: false,
+      checkboxRecords: false,
+      buttonDisabled: true,
+    };
+    this.state = this.INITIAL_STATE;
+
+    this.checkBoxRef = React.createRef();
+  }
+
+  componentDidUpdate() {
+    const { modalOpen } = this.state;
+    if (modalOpen && this.checkBoxRef) {
+      const {
+        current: { inputRef },
+      } = this.checkBoxRef;
+      inputRef?.current?.focus(); // A11y: Focus first interactive element when modal opens
+    }
+  }
+
+  openConfirmModal = () => this.setState({ modalOpen: true });
+  closeConfirmModal = () => this.setState(this.INITIAL_STATE);
+
+  handleDelete = async () => {
+    const { result, recordCommunityEndpoint, successCallback } = this.props;
+
+    this.setState({ loading: true });
+    const payload = {
+      communities: [{ id: result.id }],
+    };
+
+    try {
+      const response = await http.delete(recordCommunityEndpoint, {
+        data: payload,
+      });
+      successCallback(response.data);
+      this.closeConfirmModal();
+    } catch (e) {
+      this.setState({ error: e, loading: false });
+    }
+  };
+
+  handleCheckboxChange = (e, { id, checked }) => {
+    const { checkboxRecords, checkboxMembers } = this.state;
+
+    if (id === "members-confirm") {
+      this.setState({
+        checkboxMembers: checked,
+        buttonDisabled: !(checked && checkboxRecords),
+      });
+    }
+    if (id === "records-confirm") {
+      this.setState({
+        checkboxRecords: checked,
+        buttonDisabled: !(checkboxMembers && checked),
+      });
+    }
+  };
+
+  render() {
+    const {
+      modalOpen,
+      loading,
+      error,
+      checkboxMembers,
+      checkboxRecords,
+      buttonDisabled,
+    } = this.state;
+    const { result } = this.props;
+    const communityTitle = result.metadata.title;
+
+    return (
+      <>
+        <Button
+          size="mini"
+          negative
+          labelPosition="left"
+          icon="trash"
+          floated="right"
+          onClick={this.openConfirmModal}
+          content={i18next.t("Remove")}
+          aria-label={i18next.t("Remove {{communityTitle}} from this record", {
+            communityTitle,
+          })}
+        />
+        <Modal size="tiny" dimmer="blurring" open={modalOpen}>
+          <Modal.Header as="h2">{i18next.t("Remove community")}</Modal.Header>
+          <Modal.Content>
+            <p>
+              {i18next.t(
+                "Are you sure you want to remove the record from the community?"
+              )}
+            </p>
+
+            <Message negative>
+              <Message.Header className="rel-mb-1">
+                <Icon name="warning sign" className="rel-mr-1" />
+                {i18next.t("I understand the consequences:")}
+              </Message.Header>
+              <>
+                <Checkbox
+                  ref={this.checkBoxRef}
+                  id="members-confirm"
+                  label={
+                    /* eslint-disable-next-line jsx-a11y/label-has-associated-control */
+                    <label>
+                      {i18next.t("Members of the community ")}
+                      <b>"{communityTitle}"</b>
+                      {i18next.t(" will ")}
+                      <u>{i18next.t("lose their access")}</u>
+                      {i18next.t(" to the record.")}
+                    </label>
+                  }
+                  checked={checkboxMembers}
+                  onChange={this.handleCheckboxChange}
+                  className="mb-5"
+                />
+                <Checkbox
+                  id="records-confirm"
+                  label={i18next.t(
+                    "The record can only be re-included in the community by going through a new review by the community curators."
+                  )}
+                  checked={checkboxRecords}
+                  onChange={this.handleCheckboxChange}
+                  className="mb-5"
+                />
+              </>
+            </Message>
+          </Modal.Content>
+
+          <Modal.Actions>
+            {error && (
+              <ErrorMessage
+                header={i18next.t("Something went wrong")}
+                content={error.response?.data?.errors?.[0]?.message || error.message}
+                icon="exclamation"
+                className="text-align-left"
+                negative
+              />
+            )}
+            <Button
+              onClick={() => this.closeConfirmModal()}
+              floated="left"
+              disabled={loading}
+              loading={loading}
+              aria-label={i18next.t("Cancel removal")}
+            >
+              {i18next.t("Cancel")}
+            </Button>
+            <Button
+              disabled={buttonDisabled || loading}
+              negative
+              onClick={() => this.handleDelete()}
+              loading={loading}
+              content={i18next.t("Remove")}
+              aria-label={i18next.t("Confirm removal")}
+            />
+          </Modal.Actions>
+        </Modal>
+      </>
+    );
+  }
+}
+
+RemoveFromCommunityAction.propTypes = {
+  result: PropTypes.object.isRequired,
+  recordCommunityEndpoint: PropTypes.object.isRequired,
+  successCallback: PropTypes.func.isRequired,
+};

invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/landing_page/ShareOptions/AccessLinks/AccessDropdown.js

@@ -0,0 +1,93 @@
+/*
+ * This file is part of Invenio.
+ * Copyright (C) 2023-2024 CERN.
+ *
+ * Invenio is free software; you can redistribute it and/or modify it
+ * under the terms of the MIT License; see LICENSE file for more details.
+ */
+import React, { Component } from "react";
+import PropTypes from "prop-types";
+import { Dropdown } from "semantic-ui-react";
+import { i18next } from "@translations/invenio_app_rdm/i18next";
+import { http } from "react-invenio-forms";
+import { SuccessIcon, ErrorPopup } from "@js/invenio_communities/members";
+import { withCancel } from "react-invenio-forms";
+
+export const errorSerializer = (error) =>
+  error?.response?.data?.message || error?.message;
+
+const MIN_LOADING_DURATION = 400;
+
+export class AccessDropdown extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { error: undefined, loading: false, actionSuccess: undefined };
+  }
+
+  componentWillUnmount() {
+    this.cancellableAction && this.cancellableAction.cancel();
+  }
+
+  onSuccess = () =>
+    this.setState({ loading: false, actionSuccess: true, error: undefined });
+
+  handleUpdate = async (permission) => {
+    const { updateEndpoint, onPermissionChanged, result, entityType } = this.props;
+    const data = { permission: permission };
+    this.setState({ loading: true, actionSuccess: false });
+    this.cancellableAction = withCancel(http.patch(updateEndpoint, data));
+
+    try {
+      // prolong loading to make sure UI displays to the end user for long enough that the action was completed
+      await Promise.all([
+        new Promise((resolve) => setTimeout(resolve, MIN_LOADING_DURATION)),
+        this.cancellableAction.promise,
+      ]);
+      this.onSuccess();
+      onPermissionChanged(
+        result?.subject?.id ?? result.id,
+        data.permission,
+        entityType
+      );
+    } catch (error) {
+      if (error === "UNMOUNTED") return;
+      this.setState({
+        loading: false,
+        actionSuccess: false,
+        error: errorSerializer(error),
+      });
+      console.error(error);
+    }
+  };
+
+  render() {
+    const { result, dropdownOptions } = this.props;
+    const { loading, actionSuccess, error } = this.state;
+    return (
+      <div className="flex align-items-center access-dropdown-container">
+        <Dropdown
+          className="overflow-scroll"
+          placeholder={i18next.t("Select permissions")}
+          fluid
+          loading={loading}
+          selection
+          options={dropdownOptions}
+          onChange={(event, data) => this.handleUpdate(data.value)}
+          defaultValue={result.permission}
+        />
+        <div className="ml-5 action-status-container">
+          {actionSuccess && <SuccessIcon timeOutDelay={3000} show={actionSuccess} />}
+          {error && <ErrorPopup error={error} />}
+        </div>
+      </div>
+    );
+  }
+}
+
+AccessDropdown.propTypes = {
+  result: PropTypes.object.isRequired,
+  dropdownOptions: PropTypes.array.isRequired,
+  updateEndpoint: PropTypes.string.isRequired,
+  entityType: PropTypes.string.isRequired,
+  onPermissionChanged: PropTypes.func.isRequired,
+};

invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/landing_page/ShareOptions/AccessLinks/CreateAccessLink.js

@@ -0,0 +1,111 @@
+/*
+ * This file is part of Invenio.
+ * Copyright (C) 2023-2024 CERN.
+ *
+ * Invenio is free software; you can redistribute it and/or modify it
+ * under the terms of the MIT License; see LICENSE file for more details.
+ */
+import React, { Component } from "react";
+import PropTypes from "prop-types";
+import { Table, Input, Dropdown, Button, Icon, Grid } from "semantic-ui-react";
+import { i18next } from "@translations/invenio_app_rdm/i18next";
+import { dropdownOptions } from "./LinksSearchResultContainer";
+
+export class CreateAccessLink extends Component {
+  constructor(props) {
+    super(props);
+    const { record } = this.props;
+    const isDraft = record?.is_draft || record?.is_draft === null;
+    this.state = {
+      description: undefined,
+      expiresAt: undefined,
+      permission: isDraft ? dropdownOptions[1].key : dropdownOptions[0].key, // "can view" option is disabled for drafts
+    };
+  }
+
+  render() {
+    const { permission, expiresAt, description } = this.state;
+    const {
+      hasLinkExpirationError,
+      handleCreation,
+      loading,
+      dropdownOptions,
+      isAccessLinksExpirationRequired,
+    } = this.props;
+    const linkExpirationDateHelptext =
+      isAccessLinksExpirationRequired === true
+        ? i18next.t("Expiration date: YYYY-MM-DD (required).")
+        : i18next.t("Expiration date: YYYY-MM-DD or never if blank (optional).");
+    return (
+      <Table.Row>
+        <Table.Cell width={16}>
+          <Grid>
+            <Grid.Column width={4}>
+              <Input
+                id="access-request-description"
+                onChange={(e, data) => this.setState({ description: data.value })}
+                fluid
+              />
+              <label
+                htmlFor="access-request-description"
+                className="helptext mb-0 mt-10"
+              >
+                {i18next.t("Short name for your link (optional).")}
+              </label>
+            </Grid.Column>
+            <Grid.Column width={4}>
+              <Input
+                className={`${hasLinkExpirationError ? "error" : ""}`}
+                id="access-request-expires-at"
+                onChange={(e, data) => {
+                  this.setState({ expiresAt: data.value });
+                }}
+                fluid
+                placeholder={i18next.t("Expiration date format: YYYY-MM-DD")}
+              />
+              <label
+                htmlFor="access-request-expires-at"
+                className="helptext mb-0 mt-10"
+              >
+                {linkExpirationDateHelptext}
+              </label>
+            </Grid.Column>
+            <Grid.Column width={4}>
+              <Dropdown
+                placeholder={i18next.t("Select permissions")}
+                fluid
+                selection
+                onChange={(event, data) => this.setState({ permission: data.value })}
+                options={dropdownOptions}
+                defaultValue={permission}
+              />
+            </Grid.Column>
+
+            <Grid.Column width={4} textAlign="right">
+              <Button
+                onClick={() => handleCreation(permission, expiresAt, description)}
+                icon
+                loading={loading}
+                disabled={loading}
+                labelPosition="left"
+                positive
+              >
+                <Icon name="code branch" />
+                {i18next.t("Create a new link")}
+              </Button>
+            </Grid.Column>
+          </Grid>
+        </Table.Cell>
+      </Table.Row>
+    );
+  }
+}
+
+CreateAccessLink.propTypes = {
+  handleCreation: PropTypes.func.isRequired,
+  loading: PropTypes.bool.isRequired,
+  dropdownOptions: PropTypes.array.isRequired,
+  record: PropTypes.object.isRequired,
+  hasLinkExpirationError: PropTypes.bool.isRequired,
+  isAccessLinksExpirationRequired: PropTypes.bool.isRequired,
+};