@webiny/app-headless-cms 0.0.0-mt-3 → 0.0.0-unstable.2af142b57e

package/admin/views/contentEntries/ContentEntriesList.js

@@ -1,40 +1,50 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+"use strict";
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
-
-import React, { useMemo } from "react";
-import debounce from "lodash/debounce";
-import { css } from "emotion";
-import TimeAgo from "timeago-react";
-import pluralize from "pluralize";
-import styled from "@emotion/styled";
-import { i18n } from "@webiny/app/i18n";
-import { Form } from "@webiny/form";
-import { Typography } from "@webiny/ui/Typography";
-import * as UIList from "@webiny/ui/List";
-import { ButtonIcon, ButtonSecondary } from "@webiny/ui/Button";
-import { Cell, Grid } from "@webiny/ui/Grid";
-import { Select } from "@webiny/ui/Select";
-import { Scrollbar } from "@webiny/ui/Scrollbar";
-import { ReactComponent as AddIcon } from "@svgr/webpack!@webiny/app-admin/assets/icons/add-18px.svg";
-import { ReactComponent as FilterIcon } from "@svgr/webpack!@webiny/app-admin/assets/icons/filter-24px.svg";
-import SearchUI from "@webiny/app-admin/components/SearchUI";
-import statusLabels from "../../constants/statusLabels";
-import { useCallback } from "react";
-import { useContentEntriesList } from "./hooks/useContentEntriesList";
-var t = i18n.ns("app-headless-cms/admin/contents/data-list");
-var rightAlign = /*#__PURE__*/css({
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _react = _interopRequireWildcard(require("react"));
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _emotion = require("emotion");
+var _timeagoReact = _interopRequireDefault(require("timeago-react"));
+var _pluralize = _interopRequireDefault(require("pluralize"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _i18n = require("@webiny/app/i18n");
+var _form = require("@webiny/form");
+var _Typography = require("@webiny/ui/Typography");
+var UIList = _interopRequireWildcard(require("@webiny/ui/List"));
+var _Button = require("@webiny/ui/Button");
+var _Grid = require("@webiny/ui/Grid");
+var _Scrollbar = require("@webiny/ui/Scrollbar");
+var _Select = require("@webiny/ui/Select");
+var _Tooltip = require("@webiny/ui/Tooltip");
+var _add18px = require("@webiny/app-admin/assets/icons/add-18px.svg");
+var _filter24px = require("@webiny/app-admin/assets/icons/filter-24px.svg");
+var _SearchUI = _interopRequireDefault(require("@webiny/app-admin/components/SearchUI"));
+var _statusLabels = _interopRequireDefault(require("../../constants/statusLabels"));
+var _useContentEntriesList = require("./hooks/useContentEntriesList");
+var _ContentEntriesViewConfig = require("./experiment/ContentEntriesViewConfig");
+var _reactRouter = require("@webiny/react-router");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+var _excluded = ["sort", "status"];
+var t = _i18n.i18n.ns("app-headless-cms/admin/contents/data-list");
+var rightAlign = /*#__PURE__*/(0, _emotion.css)({
   alignItems: "flex-end !important",
   justifyContent: "center !important"
 }, "label:rightAlign;");
-var ModelId = /*#__PURE__*/styled("span", {
+var ModelId = /*#__PURE__*/(0, _styled.default)("span", {
   target: "e1yw2ynr0",
   label: "ModelId"
 })({
   color: "var(--mdc-theme-text-secondary-on-background)"
 });
-var InlineLoaderWrapper = /*#__PURE__*/styled("div", {
+var InlineLoaderWrapper = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1yw2ynr1",
   label: "InlineLoaderWrapper"
 })({
@@ -48,133 +58,143 @@ var InlineLoaderWrapper = /*#__PURE__*/styled("div", {
   height: 40,
   backgroundColor: "var(--mdc-theme-surface)"
 });
-var listItemMinHeight = /*#__PURE__*/css({
+var listItemMinHeight = /*#__PURE__*/(0, _emotion.css)({
   minHeight: "66px !important"
 }, "label:listItemMinHeight;");
-
+var disabled = /*#__PURE__*/(0, _emotion.css)({
+  color: "rgba(0, 0, 0, 0.54)",
+  cursor: "default"
+}, "label:disabled;");
 var ContentEntriesList = function ContentEntriesList() {
-  var _useContentEntriesLis = useContentEntriesList(),
-      contentModel = _useContentEntriesLis.contentModel,
-      entryId = _useContentEntriesLis.entryId,
-      loading = _useContentEntriesLis.loading,
-      canCreate = _useContentEntriesLis.canCreate,
-      onCreate = _useContentEntriesLis.onCreate,
-      data = _useContentEntriesLis.data,
-      editEntry = _useContentEntriesLis.editEntry,
-      loadMore = _useContentEntriesLis.loadMore,
-      loadMoreLoading = _useContentEntriesLis.loadMoreLoading,
-      listQueryVariables = _useContentEntriesLis.listQueryVariables,
-      setListQueryVariables = _useContentEntriesLis.setListQueryVariables,
-      sorters = _useContentEntriesLis.sorters,
-      filter = _useContentEntriesLis.filter,
-      setFilter = _useContentEntriesLis.setFilter;
-
-  var loadMoreOnScroll = useCallback(debounce(function (scrollFrame) {
+  var _useContentEntriesLis = (0, _useContentEntriesList.useContentEntriesList)(),
+    contentModel = _useContentEntriesLis.contentModel,
+    id = _useContentEntriesLis.id,
+    loading = _useContentEntriesLis.loading,
+    canCreate = _useContentEntriesLis.canCreate,
+    onCreate = _useContentEntriesLis.onCreate,
+    data = _useContentEntriesLis.data,
+    editEntry = _useContentEntriesLis.editEntry,
+    loadMore = _useContentEntriesLis.loadMore,
+    loadMoreLoading = _useContentEntriesLis.loadMoreLoading,
+    listQueryVariables = _useContentEntriesLis.listQueryVariables,
+    setListQueryVariables = _useContentEntriesLis.setListQueryVariables,
+    sorters = _useContentEntriesLis.sorters,
+    filter = _useContentEntriesLis.filter,
+    setFilter = _useContentEntriesLis.setFilter;
+  var viewConfig = (0, _ContentEntriesViewConfig.useContentEntriesViewConfig)();
+  var loadMoreOnScroll = (0, _react.useCallback)((0, _debounce.default)(function (scrollFrame) {
     if (scrollFrame.top > 0.9) {
       loadMore();
     }
   }, 500), [data]);
-  var entriesDataListModalOverlay = useMemo(function () {
-    return /*#__PURE__*/React.createElement(UIList.DataListModalOverlay, null, /*#__PURE__*/React.createElement(Form, {
-      data: listQueryVariables,
-      onChange: function onChange(_ref) {
-        var status = _ref.status,
-            sort = _ref.sort;
-        setListQueryVariables(function (prevState) {
-          return _objectSpread(_objectSpread({}, prevState), {}, {
-            sort: sort,
-            status: status
-          });
+  var formInitialData = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, listQueryVariables), {}, {
+    sort: listQueryVariables.sort ? listQueryVariables.sort[0] : ""
+  });
+  var appliesToContentModel = (0, _react.useCallback)(function (_ref) {
+    var modelIds = _ref.modelIds;
+    return modelIds.length === 0 || modelIds.includes(contentModel.modelId);
+  }, [contentModel]);
+  var entriesDataListModalOverlay = (0, _react.useMemo)(function () {
+    return /*#__PURE__*/_react.default.createElement(UIList.DataListModalOverlay, null, /*#__PURE__*/_react.default.createElement(_form.Form, {
+      data: formInitialData,
+      onChange: function onChange(_ref2) {
+        var sort = _ref2.sort,
+          status = _ref2.status,
+          data = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+        setListQueryVariables(function () {
+          return (0, _objectSpread2.default)({
+            status: status,
+            // GraphQL Schema requires "sort" to be an array.
+            sort: [sort]
+          }, data);
         });
       }
-    }, function (_ref2) {
-      var Bind = _ref2.Bind;
-      return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Cell, {
+    }, function (_ref3) {
+      var Bind = _ref3.Bind;
+      return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
         span: 12
-      }, /*#__PURE__*/React.createElement(Bind, {
+      }, /*#__PURE__*/_react.default.createElement(Bind, {
         name: "sort"
-      }, /*#__PURE__*/React.createElement(Select, {
-        label: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Sort by"])))
-      }, sorters.map(function (_ref3) {
-        var label = _ref3.label,
-            value = _ref3.value;
-        return /*#__PURE__*/React.createElement("option", {
-          key: label,
+      }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
+        label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Sort by"])))
+      }, sorters.map(function (_ref4) {
+        var value = _ref4.value,
+          label = _ref4.label;
+        return /*#__PURE__*/_react.default.createElement("option", {
+          key: value,
           value: value
         }, label);
-      })))), /*#__PURE__*/React.createElement(Cell, {
-        span: 12
-      }, /*#__PURE__*/React.createElement(Bind, {
-        name: "status"
-      }, /*#__PURE__*/React.createElement(Select, {
-        label: t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Filter by status"]))),
-        description: "Filter by a specific page status."
-      }, /*#__PURE__*/React.createElement("option", {
-        value: "all"
-      }, t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["All"])))), /*#__PURE__*/React.createElement("option", {
-        value: "draft"
-      }, t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Draft"])))), /*#__PURE__*/React.createElement("option", {
-        value: "published"
-      }, t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Published"])))), /*#__PURE__*/React.createElement("option", {
-        value: "unpublished"
-      }, t(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["Unpublished"])))), /*#__PURE__*/React.createElement("option", {
-        value: "reviewRequested"
-      }, t(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["Review requested"])))), /*#__PURE__*/React.createElement("option", {
-        value: "changesRequested"
-      }, t(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["Changes requested"]))))))));
+      })))), viewConfig.filters.filter(appliesToContentModel).map(function (filter) {
+        return /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+          span: 12,
+          key: filter.name
+        }, filter.element);
+      }));
     }));
-  }, [listQueryVariables]);
-  return /*#__PURE__*/React.createElement(UIList.DataList, {
+  }, [listQueryVariables, viewConfig.filters]);
+  return /*#__PURE__*/_react.default.createElement(UIList.DataList, {
     loading: loading,
     data: data,
-    title: /*#__PURE__*/React.createElement("span", null, pluralize(contentModel.name), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Typography, {
+    title: /*#__PURE__*/_react.default.createElement("span", null, (0, _pluralize.default)(contentModel.name), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
       use: "subtitle1"
-    }, /*#__PURE__*/React.createElement(ModelId, null, "Model ID: ", contentModel.modelId))),
-    actions: canCreate ? /*#__PURE__*/React.createElement(ButtonSecondary, {
+    }, /*#__PURE__*/_react.default.createElement(ModelId, null, "Model ID:", " ", contentModel.plugin ? /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
+      content: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Content model is registered via a plugin."]))),
+      placement: "top"
+    }, /*#__PURE__*/_react.default.createElement(_reactRouter.Link, {
+      to: "#",
+      className: disabled
+    }, contentModel.modelId)) : /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
+      content: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Edit content model"]))),
+      placement: "top"
+    }, /*#__PURE__*/_react.default.createElement(_reactRouter.Link, {
+      to: "/cms/content-models/".concat(contentModel.modelId)
+    }, contentModel.modelId))))),
+    actions: canCreate ? /*#__PURE__*/_react.default.createElement(_Button.ButtonSecondary, {
       "data-testid": "new-record-button",
       onClick: onCreate
-    }, /*#__PURE__*/React.createElement(ButtonIcon, {
-      icon: /*#__PURE__*/React.createElement(AddIcon, null)
-    }), " ", t(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["New Entry"])))) : null,
-    search: /*#__PURE__*/React.createElement(SearchUI, {
+    }, /*#__PURE__*/_react.default.createElement(_Button.ButtonIcon, {
+      icon: /*#__PURE__*/_react.default.createElement(_add18px.ReactComponent, null)
+    }), " ", t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["New Entry"])))) : null,
+    search: /*#__PURE__*/_react.default.createElement(_SearchUI.default, {
       value: filter,
       onChange: setFilter,
-      inputPlaceholder: t(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["Search {title}"])))({
-        title: pluralize(contentModel.name)
+      inputPlaceholder: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Search {title}"])))({
+        title: (0, _pluralize.default)(contentModel.name)
       })
     }),
     modalOverlay: entriesDataListModalOverlay,
-    modalOverlayAction: /*#__PURE__*/React.createElement(UIList.DataListModalOverlayAction, {
-      icon: /*#__PURE__*/React.createElement(FilterIcon, null),
+    modalOverlayAction: /*#__PURE__*/_react.default.createElement(UIList.DataListModalOverlayAction, {
+      icon: /*#__PURE__*/_react.default.createElement(_filter24px.ReactComponent, null),
       "data-testid": "default-data-list.filter"
     })
-  }, function (_ref4) {
-    var data = _ref4.data;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Scrollbar, {
+  }, function (_ref5) {
+    var data = _ref5.data;
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Scrollbar.Scrollbar, {
       "data-testid": "default-data-list",
       onScrollFrame: function onScrollFrame(scrollFrame) {
         return loadMoreOnScroll(scrollFrame);
       }
     }, data.map(function (item) {
-      return /*#__PURE__*/React.createElement(UIList.ListItem, {
+      return /*#__PURE__*/_react.default.createElement(UIList.ListItem, {
         key: item.id,
         className: listItemMinHeight,
-        selected: item.id === entryId
-      }, /*#__PURE__*/React.createElement(UIList.ListItemText, {
+        selected: item.id === id
+      }, /*#__PURE__*/_react.default.createElement(UIList.ListItemText, {
         onClick: editEntry(item)
-      }, item.meta.title || "Untitled", /*#__PURE__*/React.createElement(UIList.ListItemTextSecondary, null, t(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["Last modified: {time}."])))({
-        time: /*#__PURE__*/React.createElement(TimeAgo, {
+      }, item.meta.title || "Untitled", /*#__PURE__*/_react.default.createElement(UIList.ListItemTextSecondary, null, t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Last modified: {time}."])))({
+        time: /*#__PURE__*/_react.default.createElement(_timeagoReact.default, {
           datetime: item.savedOn
         })
-      }))), /*#__PURE__*/React.createElement(UIList.ListItemMeta, {
+      }))), /*#__PURE__*/_react.default.createElement(UIList.ListItemMeta, {
         className: rightAlign
-      }, /*#__PURE__*/React.createElement(Typography, {
-        use: "subtitle2"
-      }, statusLabels[item.meta.status], " (v", item.meta.version, ")")));
-    })), loadMoreLoading && /*#__PURE__*/React.createElement(InlineLoaderWrapper, null, /*#__PURE__*/React.createElement(Typography, {
+      }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+        use: "body2",
+        "data-testid": "ul.list.subtitle"
+      }, _statusLabels.default[item.meta.status], " (v", item.meta.version, ")")));
+    })), loadMoreLoading && /*#__PURE__*/_react.default.createElement(InlineLoaderWrapper, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
       use: "overline"
-    }, t(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["Loading more entries..."]))))));
+    }, t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["Loading more entries..."]))))));
   });
 };
-
-export default ContentEntriesList;
+var _default = ContentEntriesList;
+exports.default = _default;

package/admin/views/contentEntries/ContentEntriesList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","rightAlign","css","alignItems","justifyContent","ModelId","styled","color","InlineLoaderWrapper","position","bottom","left","display","width","height","backgroundColor","listItemMinHeight","minHeight","disabled","cursor","ContentEntriesList","useContentEntriesList","contentModel","id","loading","canCreate","onCreate","data","editEntry","loadMore","loadMoreLoading","listQueryVariables","setListQueryVariables","sorters","filter","setFilter","viewConfig","useContentEntriesViewConfig","loadMoreOnScroll","useCallback","debounce","scrollFrame","top","formInitialData","sort","appliesToContentModel","modelIds","length","includes","modelId","entriesDataListModalOverlay","useMemo","status","Bind","map","value","label","filters","name","element","pluralize","plugin","title","item","meta","time","savedOn","statusLabels","version"],"sources":["ContentEntriesList.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport { css } from \"emotion\";\n/**\n * Package timeago-react does not have types.\n */\n// @ts-ignore\nimport TimeAgo from \"timeago-react\";\nimport pluralize from \"pluralize\";\nimport styled from \"@emotion/styled\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Form } from \"@webiny/form\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport * as UIList from \"@webiny/ui/List\";\nimport { ButtonIcon, ButtonSecondary } from \"@webiny/ui/Button\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\nimport { Scrollbar } from \"@webiny/ui/Scrollbar\";\nimport { Select } from \"@webiny/ui/Select\";\nimport { Tooltip } from \"@webiny/ui/Tooltip\";\nimport { ReactComponent as AddIcon } from \"@webiny/app-admin/assets/icons/add-18px.svg\";\nimport { ReactComponent as FilterIcon } from \"@webiny/app-admin/assets/icons/filter-24px.svg\";\nimport SearchUI from \"@webiny/app-admin/components/SearchUI\";\nimport statusLabels from \"../../constants/statusLabels\";\nimport { useCallback } from \"react\";\nimport { useContentEntriesList } from \"~/admin/views/contentEntries/hooks/useContentEntriesList\";\nimport { positionValues as PositionValues } from \"react-custom-scrollbars\";\nimport { CmsEditorContentEntry } from \"~/types\";\nimport {\n    useContentEntriesViewConfig,\n    ContentEntriesViewConfigFilter\n} from \"./experiment/ContentEntriesViewConfig\";\nimport { Link } from \"@webiny/react-router\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/contents/data-list\");\n\nconst rightAlign = css({\n    alignItems: \"flex-end !important\",\n    justifyContent: \"center !important\"\n});\n\nconst ModelId = styled(\"span\")({\n    color: \"var(--mdc-theme-text-secondary-on-background)\"\n});\n\nconst InlineLoaderWrapper = styled(\"div\")({\n    position: \"absolute\",\n    bottom: 0,\n    left: 0,\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    width: \"100%\",\n    height: 40,\n    backgroundColor: \"var(--mdc-theme-surface)\"\n});\n\nconst listItemMinHeight = css({\n    minHeight: \"66px !important\"\n});\n\nconst disabled = css({\n    color: \"rgba(0, 0, 0, 0.54)\",\n    cursor: \"default\"\n});\n\nconst ContentEntriesList: React.FC = () => {\n    const {\n        contentModel,\n        id,\n        loading,\n        canCreate,\n        onCreate,\n        data,\n        editEntry,\n        loadMore,\n        loadMoreLoading,\n        listQueryVariables,\n        setListQueryVariables,\n        sorters,\n        filter,\n        setFilter\n    } = useContentEntriesList();\n\n    const viewConfig = useContentEntriesViewConfig();\n\n    const loadMoreOnScroll = useCallback(\n        debounce((scrollFrame: PositionValues) => {\n            if (scrollFrame.top > 0.9) {\n                loadMore();\n            }\n        }, 500),\n        [data]\n    );\n\n    const formInitialData = {\n        ...listQueryVariables,\n        sort: listQueryVariables.sort ? listQueryVariables.sort[0] : \"\"\n    };\n\n    const appliesToContentModel = useCallback(\n        ({ modelIds }: ContentEntriesViewConfigFilter) => {\n            return modelIds.length === 0 || modelIds.includes(contentModel.modelId);\n        },\n        [contentModel]\n    );\n\n    const entriesDataListModalOverlay = useMemo(\n        () => (\n            <UIList.DataListModalOverlay>\n                <Form\n                    data={formInitialData}\n                    onChange={({ sort, status, ...data }) => {\n                        setListQueryVariables(() => ({\n                            status,\n                            // GraphQL Schema requires \"sort\" to be an array.\n                            sort: [sort],\n                            // Spread the rest of form data\n                            ...data\n                        }));\n                    }}\n                >\n                    {({ Bind }) => (\n                        <Grid>\n                            <Cell span={12}>\n                                <Bind name={\"sort\"}>\n                                    <Select label={t`Sort by`}>\n                                        {sorters.map(({ value, label }) => {\n                                            return (\n                                                <option key={value} value={value}>\n                                                    {label}\n                                                </option>\n                                            );\n                                        })}\n                                    </Select>\n                                </Bind>\n                            </Cell>\n                            {viewConfig.filters.filter(appliesToContentModel).map(filter => (\n                                <Cell span={12} key={filter.name}>\n                                    {filter.element}\n                                </Cell>\n                            ))}\n                        </Grid>\n                    )}\n                </Form>\n            </UIList.DataListModalOverlay>\n        ),\n        [listQueryVariables, viewConfig.filters]\n    );\n\n    return (\n        <UIList.DataList\n            loading={loading}\n            data={data}\n            title={\n                <span>\n                    {pluralize(contentModel.name)}\n                    <br />\n                    <Typography use={\"subtitle1\"}>\n                        <ModelId>\n                            Model ID:{\" \"}\n                            {contentModel.plugin ? (\n                                <Tooltip\n                                    content={t`Content model is registered via a plugin.`}\n                                    placement={\"top\"}\n                                >\n                                    <Link to=\"#\" className={disabled}>\n                                        {contentModel.modelId}\n                                    </Link>\n                                </Tooltip>\n                            ) : (\n                                <Tooltip content={t`Edit content model`} placement={\"top\"}>\n                                    <Link to={`/cms/content-models/${contentModel.modelId}`}>\n                                        {contentModel.modelId}\n                                    </Link>\n                                </Tooltip>\n                            )}\n                        </ModelId>\n                    </Typography>\n                </span>\n            }\n            actions={\n                canCreate ? (\n                    <ButtonSecondary data-testid=\"new-record-button\" onClick={onCreate}>\n                        <ButtonIcon icon={<AddIcon />} /> {t`New Entry`}\n                    </ButtonSecondary>\n                ) : null\n            }\n            search={\n                <SearchUI\n                    value={filter}\n                    onChange={setFilter}\n                    inputPlaceholder={t`Search {title}`({ title: pluralize(contentModel.name) })}\n                />\n            }\n            modalOverlay={entriesDataListModalOverlay}\n            modalOverlayAction={\n                <UIList.DataListModalOverlayAction\n                    icon={<FilterIcon />}\n                    data-testid={\"default-data-list.filter\"}\n                />\n            }\n        >\n            {({ data }: { data: CmsEditorContentEntry[] }) => (\n                <>\n                    <Scrollbar\n                        data-testid=\"default-data-list\"\n                        onScrollFrame={scrollFrame => loadMoreOnScroll(scrollFrame)}\n                    >\n                        {data.map(item => (\n                            <UIList.ListItem\n                                key={item.id}\n                                className={listItemMinHeight}\n                                selected={item.id === id}\n                            >\n                                <UIList.ListItemText onClick={editEntry(item)}>\n                                    {item.meta.title || \"Untitled\"}\n                                    <UIList.ListItemTextSecondary>\n                                        {t`Last modified: {time}.`({\n                                            time: <TimeAgo datetime={item.savedOn} />\n                                        })}\n                                    </UIList.ListItemTextSecondary>\n                                </UIList.ListItemText>\n\n                                <UIList.ListItemMeta className={rightAlign}>\n                                    <Typography use={\"body2\"} data-testid=\"ul.list.subtitle\">\n                                        {statusLabels[item.meta.status]} (v{item.meta.version})\n                                    </Typography>\n                                </UIList.ListItemMeta>\n                            </UIList.ListItem>\n                        ))}\n                    </Scrollbar>\n                    {loadMoreLoading && (\n                        <InlineLoaderWrapper>\n                            <Typography use={\"overline\"}>{t`Loading more entries...`}</Typography>\n                        </InlineLoaderWrapper>\n                    )}\n                </>\n            )}\n        </UIList.DataList>\n    );\n};\n\nexport default ContentEntriesList;\n"],"mappings":"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"}

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

@@ -1,13 +1,15 @@
-import React, { Dispatch, SetStateAction, MutableRefObject } from "react";
+import React, { Dispatch, SetStateAction, MutableRefObject, RefObject } from "react";
 import { ContentEntriesContext } from "../ContentEntriesContext";
 import { CmsContentEntryRevision, CmsEditorContentEntry } from "../../../../types";
-import { Tabs } from "@webiny/ui/Tabs";
+import { TabsImperativeApi } from "@webiny/ui/Tabs";
+interface ContentEntryContextForm {
+    submit: (ev: React.SyntheticEvent) => Promise<CmsEditorContentEntry | null>;
+}
+declare type ContentEntryContextFormRef = MutableRefObject<ContentEntryContextForm>;
 export interface ContentEntryContext extends ContentEntriesContext {
     createEntry: () => void;
     entry: CmsEditorContentEntry;
-    form: MutableRefObject<{
-        submit: Function;
-    }>;
+    form: ContentEntryContextFormRef;
     setFormRef: (form: {
         submit: Function;
     }) => void;
@@ -15,14 +17,17 @@ export interface ContentEntryContext extends ContentEntriesContext {
     setLoading: Dispatch<SetStateAction<boolean>>;
     revisions: CmsContentEntryRevision[];
     refetchContent: () => void;
-    tabs: MutableRefObject<Tabs>;
-    setTabsRef: (tabs: Tabs) => void;
+    tabsRef: RefObject<TabsImperativeApi | undefined>;
     showEmptyView: boolean;
 }
-export declare const Context: React.Context<ContentEntryContext>;
-export declare const Provider: {
-    ({ children }: {
-        children: any;
-    }): JSX.Element;
-    displayName: string;
-};
+export declare const Context: React.Context<ContentEntryContext | undefined>;
+export interface ContentEntryContextProviderProps extends Partial<UseContentEntryProviderProps> {
+    children: React.ReactNode;
+}
+interface UseContentEntryProviderProps {
+    getContentId: () => string | null;
+    isNewEntry: () => boolean;
+}
+export declare const useContentEntryProviderProps: () => UseContentEntryProviderProps;
+export declare const Provider: React.FC<ContentEntryContextProviderProps>;
+export {};