@plone/volto 18.0.0-alpha.42 → 18.0.0-alpha.44

package/dist/server/assets/ContentTypes-C40JO5N_.js

@@ -0,0 +1,567 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { Component } from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux";
+import { compose } from "redux";
+import { Link } from "react-router-dom";
+import { I as Icon, as as folderSVG, c3 as layoutSVG, b6 as deleteSVG, bH as getControlpanel, c4 as postControlpanel, c5 as deleteControlpanel, T as Toast, c6 as getId, be as ModalForm, bI as getParentUrl, o as backSVG } from "../entry-server.js";
+import { createPortal } from "react-dom";
+import { last } from "lodash-es";
+import { Dropdown, Container, Confirm, Header, Table, Button } from "semantic-ui-react";
+import { toast } from "react-toastify";
+import { injectIntl, FormattedMessage, defineMessages } from "react-intl";
+import { E as Error2 } from "./Error-MJ-ObF_2.js";
+import { e as editSVG, T as Toolbar, a as addSVG } from "./Toolbar-DVsVq7NQ.js";
+import "classnames";
+import "moment";
+import "react-router";
+import "react-router-hash-link";
+import "tlds";
+import "prepend-http";
+import "lodash-move";
+import "react-dom/server";
+import "react-transition-group";
+import "promise-file-reader";
+import "uuid";
+import "pretty-bytes";
+import "react-side-effect";
+import "github-slugger";
+import "slate";
+import "hoist-non-react-statics";
+import "query-string";
+import "slate-react";
+import "prettier/standalone";
+import "prettier/parser-html";
+import "prismjs/components/prism-core.js";
+import "react-animate-height";
+import "react-popper";
+import "react-sortable-hoc";
+import "react-dates/initialize.js";
+import "react-anchor-link-smooth-scroll";
+import "jwt-decode";
+import "react-router-config";
+import "react-fast-compare";
+import "object-assign";
+import "lodash-es/split.js";
+import "lodash-es/join.js";
+import "lodash-es/trim.js";
+import "react-cookie";
+import "react-intl-redux";
+import "universal-cookie";
+import "slate-hyperscript";
+import "is-hotkey";
+import "react-dropzone";
+import "react-intersection-observer";
+import "is-url";
+import "lodash-es/isUndefined.js";
+import "lodash-es/isString.js";
+import "redux-mock-store";
+import "serialize-javascript";
+import "superagent";
+import "connected-react-router";
+import "react-beautiful-dnd";
+import "detect-browser";
+import "locale";
+import "history";
+import "redux-thunk";
+import "redux-localstorage-simple";
+import "debug";
+import "express";
+import "http-proxy-middleware";
+import "./users-BY0qskQF.js";
+import "./User-CeYa32LY.js";
+import "./PersonalInformation--cOokZv2.js";
+const ContentTypesActions = ({
+  item,
+  path,
+  onEdit,
+  onDelete,
+  onLayout,
+  onSchema
+}) => {
+  return /* @__PURE__ */ jsx(Dropdown, { icon: "ellipsis horizontal", className: `actions-${item.id}`, children: /* @__PURE__ */ jsxs(Dropdown.Menu, { className: "left", children: [
+    /* @__PURE__ */ jsxs(
+      Dropdown.Item,
+      {
+        onClick: onEdit,
+        value: `${path}/${item.id}`,
+        className: `edit-${item.id}`,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { name: editSVG, size: "15px" }),
+          /* @__PURE__ */ jsx(FormattedMessage, { id: "Edit", defaultMessage: "Edit" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(Dropdown.Item, { onClick: onSchema, value: item.id, children: [
+      /* @__PURE__ */ jsx(Icon, { name: folderSVG, size: "15px" }),
+      /* @__PURE__ */ jsx(FormattedMessage, { id: "Schema", defaultMessage: "Schema" })
+    ] }),
+    /* @__PURE__ */ jsxs(
+      Dropdown.Item,
+      {
+        onClick: onLayout,
+        value: `${path}/${item.id}/layout`,
+        className: `layout-${item.id}`,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { name: layoutSVG, size: "15px" }),
+          /* @__PURE__ */ jsx(FormattedMessage, { id: "Layout", defaultMessage: "Layout" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      Dropdown.Item,
+      {
+        onClick: onDelete,
+        value: item["@id"],
+        className: `delete-${item.id}`,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { name: deleteSVG, size: "15px" }),
+          /* @__PURE__ */ jsx(FormattedMessage, { id: "Delete", defaultMessage: "Delete" })
+        ]
+      }
+    )
+  ] }) });
+};
+const ContentTypesActions$1 = injectIntl(ContentTypesActions);
+const messages = defineMessages({
+  add: {
+    id: "Add",
+    defaultMessage: "Add"
+  },
+  back: {
+    id: "Back",
+    defaultMessage: "Back"
+  },
+  yes: {
+    id: "Yes",
+    defaultMessage: "Yes"
+  },
+  no: {
+    id: "No",
+    defaultMessage: "No"
+  },
+  addTypeFormTitle: {
+    id: "Add new content type",
+    defaultMessage: "Add new content type"
+  },
+  addTypeButtonTitle: {
+    id: "Add new content type",
+    defaultMessage: "Add new content type"
+  },
+  addTypeFormTitleTitle: {
+    id: "Title",
+    defaultMessage: "Title"
+  },
+  addTypeFormDescriptionTitle: {
+    id: "Description",
+    defaultMessage: "Description"
+  },
+  success: {
+    id: "Success",
+    defaultMessage: "Success"
+  },
+  typeCreated: {
+    id: "Content type created",
+    defaultMessage: "Content type created"
+  },
+  deleteConfirmTitle: {
+    id: "Delete Type",
+    defaultMessage: "Delete Type"
+  },
+  typeDeleted: {
+    id: "Content type deleted",
+    defaultMessage: "Content type deleted"
+  }
+});
+class ContentTypes extends Component {
+  /**
+   * Constructor
+   * @method constructor
+   * @param {Object} props Component properties
+   * @constructs Types
+   */
+  constructor(props) {
+    super(props);
+    this.onAddTypeSubmit = this.onAddTypeSubmit.bind(this);
+    this.onAddTypeError = this.onAddTypeError.bind(this);
+    this.onAddTypeSuccess = this.onAddTypeSuccess.bind(this);
+    this.onEdit = this.onEdit.bind(this);
+    this.onLayout = this.onLayout.bind(this);
+    this.onSchema = this.onSchema.bind(this);
+    this.onDelete = this.onDelete.bind(this);
+    this.onDeleteCancel = this.onDeleteCancel.bind(this);
+    this.onDeleteOk = this.onDeleteOk.bind(this);
+    this.onDeleteTypeSuccess = this.onDeleteTypeSuccess.bind(this);
+    this.state = {
+      showAddType: false,
+      addTypeError: "",
+      showDelete: false,
+      typeToDelete: void 0,
+      error: null,
+      isClient: false
+    };
+  }
+  /**
+   * Component did mount
+   * @method componentDidMount
+   * @returns {undefined}
+   */
+  componentDidMount() {
+    this.props.getControlpanel(this.props.id);
+    this.setState({ isClient: true });
+  }
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (this.props.cpanelRequest.get.loading && nextProps.cpanelRequest.get.error) {
+      this.setState({
+        error: nextProps.cpanelRequest.get.error
+      });
+    }
+    if (this.props.cpanelRequest.post.loading && nextProps.cpanelRequest.post.loaded) {
+      this.props.getControlpanel(this.props.id);
+      this.onAddTypeSuccess();
+    }
+    if (this.props.cpanelRequest.post.loading && nextProps.cpanelRequest.post.error) {
+      this.onAddTypeError(nextProps.cpanelRequest.post.error);
+    }
+    if (this.props.cpanelRequest.delete.loading && nextProps.cpanelRequest.delete.loaded) {
+      this.props.getControlpanel(this.props.id);
+      this.onDeleteTypeSuccess();
+    }
+  }
+  /** Add  */
+  /**
+   * @param {object} data Form data from the ModalForm.
+   * @param {func} callback to set new form data in the ModalForm
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onAddTypeSubmit(data, callback) {
+    this.props.postControlpanel(this.props.id, data);
+    this.setState({
+      addTypeSetFormDataCallback: callback
+    });
+  }
+  /**
+   * Handle Errors after postControlpanel()
+   *
+   * @param {*} error object. Requires the property .message
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onAddTypeError(error) {
+    this.setState({
+      addTypeError: error.message
+    });
+  }
+  /**
+   * Handle Success after postControlpanel()
+   *
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onAddTypeSuccess() {
+    this.state.addTypeSetFormDataCallback({});
+    this.setState({
+      showAddType: false,
+      addTypeError: void 0,
+      addTypeSetFormDataCallback: void 0
+    });
+    toast.success(
+      /* @__PURE__ */ jsx(
+        Toast,
+        {
+          success: true,
+          title: this.props.intl.formatMessage(messages.success),
+          content: this.props.intl.formatMessage(messages.typeCreated)
+        }
+      )
+    );
+  }
+  /** Edit  */
+  /**
+   * @param {*} event Event object.
+   * @param {*} { value }
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onEdit(event, { value }) {
+    this.props.history.push(value);
+  }
+  /**
+   * Layout button click
+   * @param {*} event
+   * @param {string} value
+   * @returns {undefined}
+   */
+  onLayout(event, { value }) {
+    this.props.history.push(value);
+  }
+  /** Delete */
+  /**
+   * @param {*} event Event object.
+   * @param {*} { value }
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onDelete(event, { value }) {
+    if (value) {
+      this.setState({
+        showDelete: true,
+        typeToDelete: value
+      });
+    }
+  }
+  /** Folder
+   * @param {Object} event Event object.
+   * @param {string} { value }
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onSchema(event, { value }) {
+    if (value) {
+      this.props.history.push(`${this.props.pathname}/${value}/schema`);
+    }
+  }
+  /**
+   * On delete ok
+   * @method onDeleteOk
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onDeleteOk() {
+    const item = getId(this.state.typeToDelete);
+    this.props.deleteControlpanel(this.props.id, item);
+    this.setState({
+      showDelete: false,
+      typeToDelete: void 0
+    });
+  }
+  /**
+   * On delete cancel
+   * @method onDeleteCancel
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onDeleteCancel() {
+    this.setState({
+      showDelete: false,
+      typeToDelete: void 0
+    });
+  }
+  /**
+   * Handle Success after deleteControlpanel()
+   *
+   * @method onDeleteTypeSuccess
+   * @memberof ContentTypes
+   * @returns {undefined}
+   */
+  onDeleteTypeSuccess() {
+    toast.success(
+      /* @__PURE__ */ jsx(
+        Toast,
+        {
+          success: true,
+          title: this.props.intl.formatMessage(messages.success),
+          content: this.props.intl.formatMessage(messages.typeDeleted)
+        }
+      )
+    );
+  }
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    if (this.state.error) {
+      return /* @__PURE__ */ jsx(Error2, { error: this.state.error });
+    }
+    if (!this.props.controlpanel) {
+      return /* @__PURE__ */ jsx("div", {});
+    }
+    return /* @__PURE__ */ jsxs(Container, { className: "types-control-panel", children: [
+      /* @__PURE__ */ jsxs("div", { className: "container", children: [
+        /* @__PURE__ */ jsx(
+          Confirm,
+          {
+            open: this.state.showDelete,
+            header: this.props.intl.formatMessage(messages.deleteConfirmTitle),
+            cancelButton: this.props.intl.formatMessage(messages.no),
+            confirmButton: this.props.intl.formatMessage(messages.yes),
+            content: /* @__PURE__ */ jsx("div", { className: "content", children: /* @__PURE__ */ jsx("ul", { className: "content", children: /* @__PURE__ */ jsx(
+              FormattedMessage,
+              {
+                id: "Do you really want to delete the type {typename}?",
+                defaultMessage: "Do you really want to delete type {typename}?",
+                values: {
+                  typename: /* @__PURE__ */ jsx("b", { children: getId(this.state.typeToDelete || "") })
+                }
+              }
+            ) }) }),
+            onCancel: this.onDeleteCancel,
+            onConfirm: this.onDeleteOk
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ModalForm,
+          {
+            open: this.state.showAddType,
+            className: "modal",
+            onSubmit: this.onAddTypeSubmit,
+            submitError: this.state.addTypeError,
+            onCancel: () => this.setState({ showAddType: false }),
+            title: this.props.intl.formatMessage(messages.addTypeFormTitle),
+            loading: this.props.cpanelRequest.post.loading,
+            schema: {
+              fieldsets: [
+                {
+                  id: "default",
+                  title: "Content type",
+                  fields: ["title", "description"]
+                }
+              ],
+              properties: {
+                title: {
+                  title: this.props.intl.formatMessage(
+                    messages.addTypeFormTitleTitle
+                  ),
+                  type: "string",
+                  description: ""
+                },
+                description: {
+                  title: this.props.intl.formatMessage(
+                    messages.addTypeFormDescriptionTitle
+                  ),
+                  type: "string",
+                  description: ""
+                }
+              },
+              required: ["title"]
+            }
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsxs("article", { id: "content", children: [
+        /* @__PURE__ */ jsx(Header, { disabled: true, children: this.props.controlpanel.title }),
+        /* @__PURE__ */ jsx("section", { id: "content-core", children: /* @__PURE__ */ jsxs(Table, { compact: true, singleLine: true, striped: true, children: [
+          /* @__PURE__ */ jsx(Table.Header, { children: /* @__PURE__ */ jsxs(Table.Row, { children: [
+            /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Type", defaultMessage: "Type" }) }),
+            /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx(
+              FormattedMessage,
+              {
+                id: "Description",
+                defaultMessage: "Description"
+              }
+            ) }),
+            /* @__PURE__ */ jsx(Table.HeaderCell, { children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Items", defaultMessage: "Items" }) }),
+            /* @__PURE__ */ jsx(Table.HeaderCell, { textAlign: "right", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "Actions", defaultMessage: "Actions" }) })
+          ] }) }),
+          /* @__PURE__ */ jsx(Table.Body, { children: this.props.controlpanel.items.map((item) => /* @__PURE__ */ jsxs(Table.Row, { children: [
+            /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsx(Link, { to: `${this.props.pathname}/${item["id"]}`, children: item.title }) }),
+            /* @__PURE__ */ jsx(Table.Cell, { children: item.description }),
+            /* @__PURE__ */ jsx(Table.Cell, { children: item.count }),
+            /* @__PURE__ */ jsx(Table.Cell, { textAlign: "right", children: /* @__PURE__ */ jsx(
+              ContentTypesActions$1,
+              {
+                item,
+                path: this.props.pathname,
+                onEdit: this.onEdit,
+                onDelete: this.onDelete,
+                onSchema: this.onSchema,
+                onLayout: this.onLayout
+              }
+            ) })
+          ] }, item["@id"])) })
+        ] }) })
+      ] }) }),
+      this.state.isClient && createPortal(
+        /* @__PURE__ */ jsx(
+          Toolbar,
+          {
+            pathname: this.props.pathname,
+            hideDefaultViewButtons: true,
+            inner: /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Link, { to: getParentUrl(this.props.pathname), className: "item", children: /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  name: backSVG,
+                  size: "30px",
+                  className: "contents circled",
+                  title: this.props.intl.formatMessage(messages.back)
+                }
+              ) }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  className: "add",
+                  "aria-label": this.props.intl.formatMessage(messages.add),
+                  tabIndex: 0,
+                  id: "toolbar-add",
+                  onClick: () => {
+                    this.setState({ showAddType: true });
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    Icon,
+                    {
+                      name: addSVG,
+                      title: this.props.intl.formatMessage(
+                        messages.addTypeButtonTitle
+                      )
+                    }
+                  )
+                }
+              )
+            ] })
+          }
+        ),
+        document.getElementById("toolbar")
+      )
+    ] });
+  }
+}
+/**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+__publicField(ContentTypes, "propTypes", {
+  id: PropTypes.string.isRequired,
+  getControlpanel: PropTypes.func.isRequired,
+  postControlpanel: PropTypes.func.isRequired,
+  deleteControlpanel: PropTypes.func.isRequired,
+  pathname: PropTypes.string.isRequired,
+  cpanelRequest: PropTypes.objectOf(PropTypes.any).isRequired,
+  controlpanel: PropTypes.shape({
+    "@id": PropTypes.string,
+    items: PropTypes.arrayOf(
+      PropTypes.shape({
+        "@id": PropTypes.string,
+        title: PropTypes.string,
+        description: PropTypes.string,
+        count: PropTypes.integer
+      })
+    )
+  })
+});
+const ContentTypes$1 = compose(
+  injectIntl,
+  connect(
+    (state, props) => ({
+      controlpanel: state.controlpanels.controlpanel,
+      cpanelRequest: state.controlpanels,
+      pathname: props.location.pathname,
+      id: last(props.location.pathname.split("/"))
+    }),
+    {
+      getControlpanel,
+      postControlpanel,
+      deleteControlpanel
+    }
+  )
+)(ContentTypes);
+export {
+  ContentTypes$1 as default
+};