@webiny/app-headless-cms 0.0.0-mt-1

package/admin/views/contentEntries/ContentEntry/RevisionsList.js

@@ -0,0 +1,59 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import React from "react";
+import { css } from "emotion";
+import { List } from "@webiny/ui/List";
+import { Elevation } from "@webiny/ui/Elevation";
+import { CircularProgress } from "@webiny/ui/Progress";
+import { i18n } from "@webiny/app/i18n";
+import RevisionListItem from "./RevisionListItem";
+import { useContentEntry } from "../hooks/useContentEntry";
+var t = i18n.ns("app-headless-cms/admin/plugins/content-details/content-revisions");
+var style = {
+  list: /*#__PURE__*/css({
+    position: "relative",
+    margin: 25,
+    display: "flex",
+    flexDirection: "column",
+    overflow: "auto",
+    maxHeight: "calc(100vh - 160px)",
+    ".mdc-list .mdc-list-item": {
+      borderBottom: "1px solid var(--mdc-theme-on-background)"
+    },
+    ".mdc-list .mdc-list-item:last-child": {
+      borderBottom: "none"
+    }
+  }, "label:list;"),
+  nothingToShow: /*#__PURE__*/css({
+    padding: 20,
+    margin: 25,
+    textAlign: "center"
+  }, "label:nothingToShow;")
+};
+
+var RevisionsList = function RevisionsList() {
+  var _useContentEntry = useContentEntry(),
+      entry = _useContentEntry.entry,
+      revisions = _useContentEntry.revisions,
+      loading = _useContentEntry.loading;
+
+  return /*#__PURE__*/React.createElement(Elevation, {
+    className: style.list,
+    z: 2
+  }, loading && /*#__PURE__*/React.createElement(CircularProgress, null), entry.id && revisions.length ? /*#__PURE__*/React.createElement(List, {
+    nonInteractive: true,
+    twoLine: true,
+    "data-testid": "cms.content-form.revisions"
+  }, revisions.map(function (revision) {
+    return /*#__PURE__*/React.createElement(RevisionListItem, {
+      revision: revision,
+      key: revision.id
+    });
+  })) : /*#__PURE__*/React.createElement("div", {
+    className: style.nothingToShow
+  }, t(_templateObject || (_templateObject = _taggedTemplateLiteral(["No revisions to show."])))));
+};
+
+export default RevisionsList;

package/admin/views/contentEntries/ContentEntry/cache.d.ts

@@ -0,0 +1,7 @@
+import { CmsEditorContentEntry } from "../../../../types";
+export declare const addEntryToListCache: (model: any, cache: any, entry: CmsEditorContentEntry, variables: any) => void;
+export declare const updateLatestRevisionInListCache: (model: any, cache: any, revision: any, variables: any) => void;
+export declare const removeEntryFromListCache: (model: any, cache: any, revision: any, variables: any) => void;
+export declare const removeRevisionFromEntryCache: (model: any, cache: any, revision: any) => any;
+export declare const addRevisionToRevisionsCache: (model: any, cache: any, revision: any) => void;
+export declare const unpublishPreviouslyPublishedRevision: (model: any, cache: any, publishedId: any) => void;

package/admin/views/contentEntries/ContentEntry/cache.js

@@ -0,0 +1,183 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import dotProp from "dot-prop-immutable";
+import orderBy from "lodash/orderBy";
+import * as GQL from "../../../graphql/contentEntries";
+/*
+ * We need to preserve the order of entries with new entry addition
+ * because we're not re-fetching the list but updating it directly inside cache.
+ * */
+
+var sortEntries = function sortEntries(list, sort) {
+  if (!sort || typeof sort !== "string") {
+    return list;
+  }
+
+  var _sort$split = sort.split("_"),
+      _sort$split2 = _slicedToArray(_sort$split, 2),
+      key = _sort$split2[0],
+      value = _sort$split2[1];
+
+  var order = value.toLowerCase();
+  return orderBy(list, [key], [order]);
+};
+
+export var addEntryToListCache = function addEntryToListCache(model, cache, entry, variables) {
+  var gqlParams = {
+    query: GQL.createListQuery(model),
+    variables: variables
+  };
+
+  var _cache$readQuery = cache.readQuery(gqlParams),
+      content = _cache$readQuery.content;
+
+  if (!content || !content.data) {
+    return;
+  }
+
+  cache.writeQuery(_objectSpread(_objectSpread({}, gqlParams), {}, {
+    data: {
+      content: _objectSpread(_objectSpread({}, content), {}, {
+        data: sortEntries([entry].concat(_toConsumableArray(content.data)), variables.sort)
+      })
+    }
+  }));
+};
+export var updateLatestRevisionInListCache = function updateLatestRevisionInListCache(model, cache, revision, variables) {
+  var gqlParams = {
+    query: GQL.createListQuery(model),
+    variables: variables
+  };
+
+  var _revision$id$split = revision.id.split("#"),
+      _revision$id$split2 = _slicedToArray(_revision$id$split, 1),
+      uniqueId = _revision$id$split2[0];
+
+  var _cache$readQuery2 = cache.readQuery(gqlParams),
+      content = _cache$readQuery2.content;
+
+  if (!content || !content.data) {
+    return;
+  }
+
+  var index = content.data.findIndex(function (item) {
+    return item.id.startsWith(uniqueId);
+  });
+
+  if (index === -1) {
+    return;
+  }
+
+  cache.writeQuery(_objectSpread(_objectSpread({}, gqlParams), {}, {
+    data: {
+      content: dotProp.set(content, "data.".concat(index), revision)
+    }
+  }));
+};
+export var removeEntryFromListCache = function removeEntryFromListCache(model, cache, revision, variables) {
+  // Delete the item from list cache
+  var gqlParams = {
+    query: GQL.createListQuery(model),
+    variables: variables
+  };
+
+  var _cache$readQuery3 = cache.readQuery(gqlParams),
+      content = _cache$readQuery3.content;
+
+  if (!content || !content.data) {
+    return;
+  }
+
+  var entryId = revision.id.split("#")[0];
+  var index = content.data.findIndex(function (item) {
+    return item.id.startsWith(entryId);
+  });
+
+  if (index === -1) {
+    return;
+  }
+
+  cache.writeQuery(_objectSpread(_objectSpread({}, gqlParams), {}, {
+    data: {
+      content: dotProp.delete(content, "data.".concat(index))
+    }
+  }));
+};
+export var removeRevisionFromEntryCache = function removeRevisionFromEntryCache(model, cache, revision) {
+  var gqlParams = {
+    query: GQL.createRevisionsQuery(model),
+    variables: {
+      id: revision.id.split("#")[0]
+    }
+  };
+
+  var _cache$readQuery4 = cache.readQuery(gqlParams),
+      revisions = _cache$readQuery4.revisions;
+
+  if (!revisions || !revisions.data) {
+    return;
+  }
+
+  var index = revisions.data.findIndex(function (item) {
+    return item.id === revision.id;
+  });
+  var newRevisions = dotProp.delete(revisions, "data.".concat(index));
+  cache.writeQuery(_objectSpread(_objectSpread({}, gqlParams), {}, {
+    data: {
+      revisions: newRevisions
+    }
+  })); // Return new revisions
+
+  return newRevisions.data;
+};
+export var addRevisionToRevisionsCache = function addRevisionToRevisionsCache(model, cache, revision) {
+  var gqlParams = {
+    query: GQL.createRevisionsQuery(model),
+    variables: {
+      id: revision.id.split("#")[0]
+    }
+  };
+
+  var _cache$readQuery5 = cache.readQuery(gqlParams),
+      revisions = _cache$readQuery5.revisions;
+
+  if (!revisions || !revisions.data) {
+    return;
+  }
+
+  cache.writeQuery(_objectSpread(_objectSpread({}, gqlParams), {}, {
+    data: {
+      revisions: dotProp.set(revisions, "data", [revision].concat(_toConsumableArray(revisions.data)))
+    }
+  }));
+};
+export var unpublishPreviouslyPublishedRevision = function unpublishPreviouslyPublishedRevision(model, cache, publishedId) {
+  var gqlParams = {
+    query: GQL.createRevisionsQuery(model),
+    variables: {
+      id: publishedId.split("#")[0]
+    }
+  };
+
+  var _cache$readQuery6 = cache.readQuery(gqlParams),
+      revisions = _cache$readQuery6.revisions;
+
+  if (!revisions || !revisions.data) {
+    return;
+  }
+
+  var prevPublished = revisions.data.findIndex(function (item) {
+    return item.id !== publishedId && item.meta.status === "published";
+  });
+
+  if (prevPublished === -1) {
+    return;
+  }
+
+  cache.writeQuery(_objectSpread(_objectSpread({}, gqlParams), {}, {
+    data: {
+      revisions: dotProp.set(revisions, "data.".concat(prevPublished, ".meta.status"), "unpublished")
+    }
+  }));
+};

package/admin/views/contentEntries/ContentEntry/header/Header.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Header: (props: any) => JSX.Element;
+export default Header;

package/admin/views/contentEntries/ContentEntry/header/Header.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { css } from "emotion";
+import { renderPlugins } from "@webiny/app/plugins";
+import { Grid, Cell } from "@webiny/ui/Grid";
+import classNames from "classnames";
+var toolbarGrid = /*#__PURE__*/css({
+  borderBottom: "1px solid var(--mdc-theme-on-background)"
+}, "label:toolbarGrid;");
+var headerActions = /*#__PURE__*/css({
+  display: "flex",
+  alignItems: "center"
+}, "label:headerActions;");
+var headerActionsLeft = /*#__PURE__*/css({
+  justifyContent: "flex-end"
+}, "label:headerActionsLeft;");
+var headerActionsRight = /*#__PURE__*/css({
+  justifyContent: "flex-start"
+}, "label:headerActionsRight;");
+
+var Header = function Header(props) {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Grid, {
+    className: toolbarGrid
+  }, /*#__PURE__*/React.createElement(Cell, {
+    span: 4,
+    className: classNames(headerActions, headerActionsRight)
+  }, renderPlugins("cms-content-details-header-left", props)), /*#__PURE__*/React.createElement(Cell, {
+    span: 8,
+    className: classNames(headerActions, headerActionsLeft)
+  }, renderPlugins("cms-content-details-header-right", props))));
+};
+
+export default Header;

package/admin/views/contentEntries/ContentEntry/header/contentFormOptionsMenu/ContentFormOptionsMenu.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const ContentFormOptionsMenu: () => JSX.Element;
+export default ContentFormOptionsMenu;

package/admin/views/contentEntries/ContentEntry/header/contentFormOptionsMenu/ContentFormOptionsMenu.js

@@ -0,0 +1,141 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useCallback, useMemo } from "react";
+import { css } from "emotion";
+import get from "lodash/get";
+import { IconButton } from "@webiny/ui/Button";
+import { Menu, MenuItem } from "@webiny/ui/Menu";
+import { ListItemGraphic } from "@webiny/ui/List";
+import { Icon } from "@webiny/ui/Icon";
+import { useRouter } from "@webiny/react-router";
+import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
+import { useDialog } from "@webiny/app-admin/hooks/useDialog";
+import { useConfirmationDialog } from "@webiny/app-admin/hooks/useConfirmationDialog";
+import { i18n } from "@webiny/app/i18n";
+import { createDeleteMutation } from "../../../../../graphql/contentEntries";
+import usePermission from "../../../../../hooks/usePermission";
+import { ReactComponent as MoreVerticalIcon } from "@svgr/webpack!../../../../../icons/more_vert.svg";
+import { ReactComponent as DeleteIcon } from "@svgr/webpack!../../../../../icons/delete.svg";
+import { removeEntryFromListCache } from "../../cache";
+import { useMutation } from "../../../../../hooks";
+import { useContentEntry } from "../../../hooks/useContentEntry";
+var t = i18n.ns("app-headless-cms/admin/plugins/content-details/header/content-form-options-menu");
+var menuStyles = /*#__PURE__*/css({
+  width: 250,
+  right: -105,
+  left: "auto !important",
+  ".disabled": {
+    opacity: 0.5,
+    pointerEvents: "none"
+  }
+}, "label:menuStyles;");
+
+var ContentFormOptionsMenu = function ContentFormOptionsMenu() {
+  var _useContentEntry = useContentEntry(),
+      contentModel = _useContentEntry.contentModel,
+      entry = _useContentEntry.entry,
+      loading = _useContentEntry.loading,
+      setLoading = _useContentEntry.setLoading,
+      listQueryVariables = _useContentEntry.listQueryVariables;
+
+  var _useSnackbar = useSnackbar(),
+      showSnackbar = _useSnackbar.showSnackbar;
+
+  var _useRouter = useRouter(),
+      history = _useRouter.history;
+
+  var _useDialog = useDialog(),
+      showDialog = _useDialog.showDialog;
+
+  var _usePermission = usePermission(),
+      canDelete = _usePermission.canDelete;
+
+  var DELETE_CONTENT = useMemo(function () {
+    return createDeleteMutation(contentModel);
+  }, [contentModel.modelId]);
+
+  var _useMutation = useMutation(DELETE_CONTENT),
+      _useMutation2 = _slicedToArray(_useMutation, 1),
+      deleteContentMutation = _useMutation2[0];
+
+  var title = get(entry, "meta.title");
+
+  var _useConfirmationDialo = useConfirmationDialog({
+    title: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Delete content entry"]))),
+    message: /*#__PURE__*/React.createElement("p", null, t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["You are about to delete this content entry and all of its revisions!"]))), /*#__PURE__*/React.createElement("br", null), t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Are you sure you want to permanently delete {title}?"])))({
+      title: /*#__PURE__*/React.createElement("strong", null, title)
+    })),
+    dataTestId: "cms.content-form.header.delete-dialog"
+  }),
+      showConfirmation = _useConfirmationDialo.showConfirmation;
+
+  var confirmDelete = useCallback(function () {
+    showConfirmation( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _entry$id$split, _entry$id$split2, uniqueId;
+
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              setLoading(true);
+              _entry$id$split = entry.id.split("#"), _entry$id$split2 = _slicedToArray(_entry$id$split, 1), uniqueId = _entry$id$split2[0];
+              _context.next = 4;
+              return deleteContentMutation({
+                variables: {
+                  revision: uniqueId
+                },
+                update: function update(cache, _ref2) {
+                  var data = _ref2.data;
+                  var error = data.content.error;
+
+                  if (error) {
+                    return showDialog(error.message, {
+                      title: t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Could not delete content"])))
+                    });
+                  }
+
+                  removeEntryFromListCache(contentModel, cache, entry, listQueryVariables);
+                  showSnackbar(t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["{title} was deleted successfully!"])))({
+                    title: /*#__PURE__*/React.createElement("strong", null, title)
+                  }));
+                  history.push("/cms/content-entries/".concat(contentModel.modelId));
+                }
+              });
+
+            case 4:
+              setLoading(false);
+
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    })));
+  }, null);
+
+  if (!canDelete(entry, "cms.contentEntry")) {
+    return null;
+  }
+
+  return /*#__PURE__*/React.createElement(Menu, {
+    className: menuStyles,
+    handle: /*#__PURE__*/React.createElement(IconButton, {
+      icon: /*#__PURE__*/React.createElement(MoreVerticalIcon, null),
+      "data-testid": "cms.content-form.header.more-options"
+    })
+  }, /*#__PURE__*/React.createElement(MenuItem, {
+    onClick: confirmDelete,
+    disabled: !entry.id || loading,
+    "data-testid": "cms.content-form.header.delete"
+  }, /*#__PURE__*/React.createElement(ListItemGraphic, null, /*#__PURE__*/React.createElement(Icon, {
+    icon: /*#__PURE__*/React.createElement(DeleteIcon, null)
+  })), "Delete"));
+};
+
+export default ContentFormOptionsMenu;

package/admin/views/contentEntries/ContentEntry/header/index.d.ts

@@ -0,0 +1,3 @@
+import { CmsContentDetailsPlugin } from "../../../../../types";
+declare const plugins: CmsContentDetailsPlugin[];
+export default plugins;

package/admin/views/contentEntries/ContentEntry/header/index.js

@@ -0,0 +1,45 @@
+import * as React from "react";
+import RevisionSelector from "./revisionSelector/RevisionSelector";
+import RequestReview from "./requestReview/RequestReview";
+import RequestChanges from "./requestChanges/RequestChanges";
+import SaveContentButton from "./saveContent/SaveContent";
+import SaveAndPublishButton from "./saveAndPublishContent/SaveAndPublishContent";
+import ContentFormOptionsMenu from "./contentFormOptionsMenu/ContentFormOptionsMenu";
+var plugins = [{
+  name: "cms-content-details-revision-selector",
+  type: "cms-content-details-header-left",
+  render: function render(props) {
+    return /*#__PURE__*/React.createElement(RevisionSelector, props);
+  }
+}, {
+  name: "cms-content-details-header-request-review",
+  type: "cms-content-details-header-right",
+  render: function render(props) {
+    return /*#__PURE__*/React.createElement(RequestReview, props);
+  }
+}, {
+  name: "cms-content-details-header-request-changes",
+  type: "cms-content-details-header-right",
+  render: function render(props) {
+    return /*#__PURE__*/React.createElement(RequestChanges, props);
+  }
+}, {
+  name: "cms-content-details-header-save",
+  type: "cms-content-details-header-right",
+  render: function render(props) {
+    return /*#__PURE__*/React.createElement(SaveContentButton, props);
+  }
+}, {
+  name: "cms-content-details-header-save-and-publish",
+  type: "cms-content-details-header-right",
+  render: function render(props) {
+    return /*#__PURE__*/React.createElement(SaveAndPublishButton, props);
+  }
+}, {
+  name: "cms-content-details-header-option-menu",
+  type: "cms-content-details-header-right",
+  render: function render(props) {
+    return /*#__PURE__*/React.createElement(ContentFormOptionsMenu, props);
+  }
+}];
+export default plugins;

package/admin/views/contentEntries/ContentEntry/header/requestChanges/RequestChanges.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const RequestChanges: () => JSX.Element;
+export default RequestChanges;

package/admin/views/contentEntries/ContentEntry/header/requestChanges/RequestChanges.js

@@ -0,0 +1,67 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2, _templateObject3;
+
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React from "react";
+import { IconButton } from "@webiny/ui/Button";
+import { Tooltip } from "@webiny/ui/Tooltip";
+import { useConfirmationDialog } from "@webiny/app-admin/hooks/useConfirmationDialog";
+import { i18n } from "@webiny/app/i18n";
+import { ReactComponent as RequestChangesIcon } from "@svgr/webpack!./rule-24px.svg";
+import usePermission from "../../../../../hooks/usePermission";
+import { useRevision } from "../../useRevision";
+import { useContentEntry } from "../../../hooks/useContentEntry";
+var t = i18n.ns("app-headless-cms/admin/content-details/header/request-review");
+
+var RequestChanges = function RequestChanges() {
+  var _useContentEntry = useContentEntry(),
+      entry = _useContentEntry.entry;
+
+  var _useRevision = useRevision({
+    revision: entry
+  }),
+      requestChanges = _useRevision.requestChanges;
+
+  var _usePermission = usePermission(),
+      canRequestChange = _usePermission.canRequestChange;
+
+  var _useConfirmationDialo = useConfirmationDialog({
+    title: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Request Changes"]))),
+    message: /*#__PURE__*/React.createElement("p", null, t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["You are about to request changes on this content entry. Are you sure you want to continue?"]))))
+  }),
+      showConfirmation = _useConfirmationDialo.showConfirmation;
+
+  if (!canRequestChange("cms.contentEntry")) {
+    return null;
+  }
+
+  var buttonEnabled = entry.id && (entry.meta.status === "draft" || entry.meta.status === "reviewRequested");
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
+    content: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Request Changes"]))),
+    placement: "top"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    disabled: !buttonEnabled,
+    icon: /*#__PURE__*/React.createElement(RequestChangesIcon, null),
+    onClick: function onClick() {
+      return showConfirmation( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return requestChanges(entry.id);
+
+              case 2:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee);
+      })));
+    }
+  })));
+};
+
+export default RequestChanges;

package/admin/views/contentEntries/ContentEntry/header/requestChanges/rule-24px.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24"><g><rect fill="none" height="24" width="24"/><path d="M15.83,10.29l-2.12-2.12c-0.39-0.39-0.39-1.02,0-1.41l0,0c0.39-0.39,1.02-0.39,1.41,0l1.41,1.41l3.54-3.54 c0.39-0.39,1.02-0.39,1.41,0l0,0c0.39,0.39,0.39,1.02,0,1.41l-4.24,4.24C16.85,10.68,16.22,10.68,15.83,10.29z M10,7H3 C2.45,7,2,7.45,2,8v0c0,0.55,0.45,1,1,1h7c0.55,0,1-0.45,1-1v0C11,7.45,10.55,7,10,7z M20.29,12.71L20.29,12.71 c-0.39-0.39-1.02-0.39-1.41,0L17,14.59l-1.88-1.88c-0.39-0.39-1.02-0.39-1.41,0l0,0c-0.39,0.39-0.39,1.02,0,1.41L15.59,16 l-1.88,1.88c-0.39,0.39-0.39,1.02,0,1.41l0,0c0.39,0.39,1.02,0.39,1.41,0L17,17.41l1.88,1.88c0.39,0.39,1.02,0.39,1.41,0l0,0 c0.39-0.39,0.39-1.02,0-1.41L18.41,16l1.88-1.88C20.68,13.73,20.68,13.1,20.29,12.71z M10,15H3c-0.55,0-1,0.45-1,1v0 c0,0.55,0.45,1,1,1h7c0.55,0,1-0.45,1-1v0C11,15.45,10.55,15,10,15z"/></g></svg>

package/admin/views/contentEntries/ContentEntry/header/requestReview/RequestReview.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const RequestReview: () => JSX.Element;
+export default RequestReview;

package/admin/views/contentEntries/ContentEntry/header/requestReview/RequestReview.js

@@ -0,0 +1,69 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2, _templateObject3;
+
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useCallback } from "react";
+import { IconButton } from "@webiny/ui/Button";
+import { Tooltip } from "@webiny/ui/Tooltip";
+import { useConfirmationDialog } from "@webiny/app-admin/hooks/useConfirmationDialog";
+import { i18n } from "@webiny/app/i18n";
+import { ReactComponent as RequestReviewIcon } from "@svgr/webpack!./emoji_people-24px.svg";
+import { useRevision } from "../../useRevision";
+import usePermission from "../../../../../hooks/usePermission";
+import { useContentEntry } from "../../../hooks/useContentEntry";
+var t = i18n.ns("app-headless-cms/admin/content-details/header/request-review");
+
+var RequestReview = function RequestReview() {
+  var _useContentEntry = useContentEntry(),
+      entry = _useContentEntry.entry;
+
+  var _useRevision = useRevision({
+    revision: entry
+  }),
+      requestReview = _useRevision.requestReview;
+
+  var _usePermission = usePermission(),
+      canRequestReview = _usePermission.canRequestReview;
+
+  var _useConfirmationDialo = useConfirmationDialog({
+    title: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Request Review"]))),
+    message: /*#__PURE__*/React.createElement("p", null, t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["You are about to request a review of this content entry. Are you sure you want to continue?"]))))
+  }),
+      showConfirmation = _useConfirmationDialo.showConfirmation;
+
+  var onClick = useCallback(function () {
+    showConfirmation( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return requestReview(entry.id);
+
+            case 2:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    })));
+  }, [entry.id]);
+
+  if (!canRequestReview("cms.contentEntry")) {
+    return null;
+  }
+
+  var buttonEnabled = entry.id && (entry.meta.status === "draft" || entry.meta.status === "changesRequested");
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
+    content: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Request Review"]))),
+    placement: "top"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    disabled: !buttonEnabled,
+    icon: /*#__PURE__*/React.createElement(RequestReviewIcon, null),
+    onClick: onClick
+  })));
+};
+
+export default RequestReview;

package/admin/views/contentEntries/ContentEntry/header/requestReview/emoji_people-24px.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24"><g><rect fill="none" height="24" width="24"/><rect fill="none" height="24" width="24"/></g><g><g/><g><circle cx="12" cy="4" r="2"/><path d="M15.89,8.11C15.5,7.72,14.83,7,13.53,7c-0.21,0-1.42,0-2.54,0C8.53,6.99,6.48,5.2,6.07,2.85C5.99,2.36,5.58,2,5.09,2h0 c-0.61,0-1.09,0.54-1,1.14C4.53,5.8,6.47,7.95,9,8.71V21c0,0.55,0.45,1,1,1h0c0.55,0,1-0.45,1-1v-5h2v5c0,0.55,0.45,1,1,1h0 c0.55,0,1-0.45,1-1V10.05l3.24,3.24c0.39,0.39,1.02,0.39,1.41,0v0c0.39-0.39,0.39-1.02,0-1.41L15.89,8.11z"/></g></g></svg>

package/admin/views/contentEntries/ContentEntry/header/revisionSelector/RevisionSelector.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const RevisionSelector: () => JSX.Element;
+export default RevisionSelector;