@webiny/app-headless-cms 0.0.0-mt-3 → 0.0.0-unstable.5e7233243f

package/admin/views/contentEntries/ContentEntry.js

@@ -1,23 +1,47 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContentEntry = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _emotion = require("emotion");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _EmptyView = _interopRequireDefault(require("@webiny/app-admin/components/EmptyView"));
+
+var _Button = require("@webiny/ui/Button");
+
+var _add18px = require("@webiny/app-admin/assets/icons/add-18px.svg");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _Tabs = require("@webiny/ui/Tabs");
+
+var _Elevation = require("@webiny/ui/Elevation");
+
+var _Progress = require("@webiny/ui/Progress");
+
+var _RevisionsList = _interopRequireDefault(require("./ContentEntry/RevisionsList"));
+
+var _Header = _interopRequireDefault(require("./ContentEntry/header/Header"));
+
+var _useContentEntry2 = require("./hooks/useContentEntry");
+
+var _ContentEntryForm = require("../../components/ContentEntryForm/ContentEntryForm");
 
 var _templateObject, _templateObject2;
 
-import React from "react";
-import { css } from "emotion";
-import styled from "@emotion/styled";
-import EmptyView from "@webiny/app-admin/components/EmptyView";
-import { ButtonDefault, ButtonIcon } from "@webiny/ui/Button";
-import { ReactComponent as AddIcon } from "@svgr/webpack!@webiny/app-admin/assets/icons/add-18px.svg";
-import { i18n } from "@webiny/app/i18n";
-import { Tab, Tabs } from "@webiny/ui/Tabs";
-import { Elevation } from "@webiny/ui/Elevation";
-import { CircularProgress } from "@webiny/ui/Progress";
-import RevisionsList from "./ContentEntry/RevisionsList";
-import Header from "./ContentEntry/header/Header";
-import { useContentEntry } from "./hooks/useContentEntry";
-import { ContentEntryForm } from "../../components/ContentEntryForm/ContentEntryForm";
-var t = i18n.namespace("app-headless-cms/admin/content-model-entries/details");
-var DetailsContainer = /*#__PURE__*/styled("div", {
+var t = _i18n.i18n.namespace("app-headless-cms/admin/content-model-entries/details");
+
+var DetailsContainer = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e68rq0j0",
   label: "DetailsContainer"
 })({
@@ -28,7 +52,7 @@ var DetailsContainer = /*#__PURE__*/styled("div", {
     backgroundColor: "var(--mdc-theme-surface)"
   }
 });
-var RenderBlock = /*#__PURE__*/styled("div", {
+var RenderBlock = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e68rq0j1",
   label: "RenderBlock"
 })({
@@ -40,60 +64,59 @@ var RenderBlock = /*#__PURE__*/styled("div", {
   /*overflow: "scroll",*/
   padding: 25
 });
-var elevationStyles = /*#__PURE__*/css({
+var elevationStyles = /*#__PURE__*/(0, _emotion.css)({
   position: "relative"
 }, "label:elevationStyles;");
 
 var ContentEntry = function ContentEntry() {
-  var _useContentEntry = useContentEntry(),
+  var _useContentEntry = (0, _useContentEntry2.useContentEntry)(),
       contentModel = _useContentEntry.contentModel,
       loading = _useContentEntry.loading,
       entry = _useContentEntry.entry,
       showEmptyView = _useContentEntry.showEmptyView,
       canCreate = _useContentEntry.canCreate,
       createEntry = _useContentEntry.createEntry,
-      setTabsRef = _useContentEntry.setTabsRef,
+      tabsRef = _useContentEntry.tabsRef,
       setFormRef = _useContentEntry.setFormRef; // Render "No content selected" view.
 
 
   if (showEmptyView) {
-    return /*#__PURE__*/React.createElement(EmptyView, {
-      title: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Click on the left side list to display entry details {message}"])))({
+    return /*#__PURE__*/_react.default.createElement(_EmptyView.default, {
+      title: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Click on the left side list to display entry details {message}"])))({
         message: canCreate ? "or create a..." : ""
       }),
-      action: canCreate ? /*#__PURE__*/React.createElement(ButtonDefault, {
+      action: canCreate ? /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
         "data-testid": "new-record-button",
         onClick: createEntry
-      }, /*#__PURE__*/React.createElement(ButtonIcon, {
-        icon: /*#__PURE__*/React.createElement(AddIcon, null)
-      }), " ", t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["New Entry"])))) : null
+      }, /*#__PURE__*/_react.default.createElement(_Button.ButtonIcon, {
+        icon: /*#__PURE__*/_react.default.createElement(_add18px.ReactComponent, null)
+      }), " ", t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["New Entry"])))) : null
     });
   }
 
-  return /*#__PURE__*/React.createElement(DetailsContainer, null, /*#__PURE__*/React.createElement("test-id", {
+  return /*#__PURE__*/_react.default.createElement(DetailsContainer, null, /*#__PURE__*/_react.default.createElement("test-id", {
     "data-testid": "cms-content-details"
-  }, /*#__PURE__*/React.createElement(Tabs, {
-    ref: function ref(tabs) {
-      return setTabsRef(tabs);
-    }
-  }, /*#__PURE__*/React.createElement(Tab, {
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.Tabs, {
+    ref: tabsRef
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
     label: "Content",
     disabled: loading,
     "data-testid": "cms.content-form.tabs.content"
-  }, /*#__PURE__*/React.createElement(RenderBlock, null, /*#__PURE__*/React.createElement(Elevation, {
+  }, /*#__PURE__*/_react.default.createElement(RenderBlock, null, /*#__PURE__*/_react.default.createElement(_Elevation.Elevation, {
     z: 2,
     className: elevationStyles
-  }, loading && /*#__PURE__*/React.createElement(CircularProgress, null), /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(ContentEntryForm, {
+  }, loading && /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, null), /*#__PURE__*/_react.default.createElement(_Header.default, null), /*#__PURE__*/_react.default.createElement(_ContentEntryForm.ContentEntryForm, {
     contentModel: contentModel,
     entry: entry,
     onForm: function onForm(form) {
       return setFormRef(form);
-    }
-  })))), /*#__PURE__*/React.createElement(Tab, {
+    },
+    addEntryToListCache: true
+  })))), /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
     label: "Revisions",
     disabled: loading,
     "data-testid": "cms.content-form.tabs.revisions"
-  }, /*#__PURE__*/React.createElement(RevisionsList, null)))));
+  }, /*#__PURE__*/_react.default.createElement(_RevisionsList.default, null)))));
 };
 
-export default ContentEntry;
+exports.ContentEntry = ContentEntry;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","namespace","DetailsContainer","styled","height","overflow","position","nav","backgroundColor","RenderBlock","zIndex","padding","elevationStyles","css","ContentEntry","useContentEntry","contentModel","loading","entry","showEmptyView","canCreate","createEntry","tabsRef","setFormRef","message","form"],"sources":["ContentEntry.tsx"],"sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\nimport EmptyView from \"@webiny/app-admin/components/EmptyView\";\nimport { ButtonDefault, ButtonIcon } from \"@webiny/ui/Button\";\nimport { ReactComponent as AddIcon } from \"@webiny/app-admin/assets/icons/add-18px.svg\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Tab, Tabs } from \"@webiny/ui/Tabs\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport RevisionsList from \"./ContentEntry/RevisionsList\";\nimport Header from \"./ContentEntry/header/Header\";\nimport { useContentEntry } from \"./hooks/useContentEntry\";\nimport { ContentEntryForm } from \"~/admin/components/ContentEntryForm/ContentEntryForm\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/content-model-entries/details\");\n\nconst DetailsContainer = styled(\"div\")({\n    height: \"calc(100% - 10px)\",\n    overflow: \"hidden\",\n    position: \"relative\",\n    nav: {\n        backgroundColor: \"var(--mdc-theme-surface)\"\n    }\n});\n\nconst RenderBlock = styled(\"div\")({\n    position: \"relative\",\n    zIndex: 0,\n    backgroundColor: \"var(--mdc-theme-background)\",\n    height: \"100%\",\n    /*overflow: \"scroll\",*/\n    padding: 25\n});\n\nconst elevationStyles = css({\n    position: \"relative\"\n});\n\ndeclare global {\n    // eslint-disable-next-line\n    namespace JSX {\n        interface IntrinsicElements {\n            \"test-id\": {\n                children?: React.ReactNode;\n            };\n        }\n    }\n}\n\nexport const ContentEntry: React.FC = () => {\n    const {\n        contentModel,\n        loading,\n        entry,\n        showEmptyView,\n        canCreate,\n        createEntry,\n        tabsRef,\n        setFormRef\n    } = useContentEntry();\n\n    // Render \"No content selected\" view.\n    if (showEmptyView) {\n        return (\n            <EmptyView\n                title={t`Click on the left side list to display entry details {message}`({\n                    message: canCreate ? \"or create a...\" : \"\"\n                })}\n                action={\n                    canCreate ? (\n                        <ButtonDefault data-testid=\"new-record-button\" onClick={createEntry}>\n                            <ButtonIcon icon={<AddIcon />} /> {t`New Entry`}\n                        </ButtonDefault>\n                    ) : null\n                }\n            />\n        );\n    }\n\n    return (\n        <DetailsContainer>\n            <test-id data-testid=\"cms-content-details\">\n                <Tabs ref={tabsRef}>\n                    <Tab\n                        label={\"Content\"}\n                        disabled={loading}\n                        data-testid={\"cms.content-form.tabs.content\"}\n                    >\n                        <RenderBlock>\n                            <Elevation z={2} className={elevationStyles}>\n                                {loading && <CircularProgress />}\n                                <Header />\n                                <ContentEntryForm\n                                    contentModel={contentModel}\n                                    entry={entry}\n                                    onForm={form => setFormRef(form)}\n                                    addEntryToListCache={true}\n                                />\n                            </Elevation>\n                        </RenderBlock>\n                    </Tab>\n                    <Tab\n                        label={\"Revisions\"}\n                        disabled={loading}\n                        data-testid={\"cms.content-form.tabs.revisions\"}\n                    >\n                        <RevisionsList />\n                    </Tab>\n                </Tabs>\n            </test-id>\n        </DetailsContainer>\n    );\n};\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,SAAL,CAAe,sDAAf,CAAV;;AAEA,IAAMC,gBAAgB,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACnCC,MAAM,EAAE,mBAD2B;EAEnCC,QAAQ,EAAE,QAFyB;EAGnCC,QAAQ,EAAE,UAHyB;EAInCC,GAAG,EAAE;IACDC,eAAe,EAAE;EADhB;AAJ8B,CAAjB,CAAtB;AASA,IAAMC,WAAW,oBAAGN,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC9BG,QAAQ,EAAE,UADoB;EAE9BI,MAAM,EAAE,CAFsB;EAG9BF,eAAe,EAAE,6BAHa;EAI9BJ,MAAM,EAAE,MAJsB;;EAK9B;EACAO,OAAO,EAAE;AANqB,CAAjB,CAAjB;AASA,IAAMC,eAAe,gBAAG,IAAAC,YAAA,EAAI;EACxBP,QAAQ,EAAE;AADc,CAAJ,2BAAxB;;AAeO,IAAMQ,YAAsB,GAAG,SAAzBA,YAAyB,GAAM;EACxC,uBASI,IAAAC,iCAAA,GATJ;EAAA,IACIC,YADJ,oBACIA,YADJ;EAAA,IAEIC,OAFJ,oBAEIA,OAFJ;EAAA,IAGIC,KAHJ,oBAGIA,KAHJ;EAAA,IAIIC,aAJJ,oBAIIA,aAJJ;EAAA,IAKIC,SALJ,oBAKIA,SALJ;EAAA,IAMIC,WANJ,oBAMIA,WANJ;EAAA,IAOIC,OAPJ,oBAOIA,OAPJ;EAAA,IAQIC,UARJ,oBAQIA,UARJ,CADwC,CAYxC;;;EACA,IAAIJ,aAAJ,EAAmB;IACf,oBACI,6BAAC,kBAAD;MACI,KAAK,EAAEpB,CAAC,iJAAD,CAAkE;QACrEyB,OAAO,EAAEJ,SAAS,GAAG,gBAAH,GAAsB;MAD6B,CAAlE,CADX;MAII,MAAM,EACFA,SAAS,gBACL,6BAAC,qBAAD;QAAe,eAAY,mBAA3B;QAA+C,OAAO,EAAEC;MAAxD,gBACI,6BAAC,kBAAD;QAAY,IAAI,eAAE,6BAAC,uBAAD;MAAlB,EADJ,OACuCtB,CADvC,+FADK,GAIL;IATZ,EADJ;EAcH;;EAED,oBACI,6BAAC,gBAAD,qBACI;IAAS,eAAY;EAArB,gBACI,6BAAC,UAAD;IAAM,GAAG,EAAEuB;EAAX,gBACI,6BAAC,SAAD;IACI,KAAK,EAAE,SADX;IAEI,QAAQ,EAAEL,OAFd;IAGI,eAAa;EAHjB,gBAKI,6BAAC,WAAD,qBACI,6BAAC,oBAAD;IAAW,CAAC,EAAE,CAAd;IAAiB,SAAS,EAAEL;EAA5B,GACKK,OAAO,iBAAI,6BAAC,0BAAD,OADhB,eAEI,6BAAC,eAAD,OAFJ,eAGI,6BAAC,kCAAD;IACI,YAAY,EAAED,YADlB;IAEI,KAAK,EAAEE,KAFX;IAGI,MAAM,EAAE,gBAAAO,IAAI;MAAA,OAAIF,UAAU,CAACE,IAAD,CAAd;IAAA,CAHhB;IAII,mBAAmB,EAAE;EAJzB,EAHJ,CADJ,CALJ,CADJ,eAmBI,6BAAC,SAAD;IACI,KAAK,EAAE,WADX;IAEI,QAAQ,EAAER,OAFd;IAGI,eAAa;EAHjB,gBAKI,6BAAC,sBAAD,OALJ,CAnBJ,CADJ,CADJ,CADJ;AAiCH,CA/DM"}

package/admin/views/contentEntries/experiment/ContentEntriesModule.d.ts

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

package/admin/views/contentEntries/experiment/ContentEntriesModule.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContentEntriesModule = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _appAdmin = require("@webiny/app-admin");
+
+var _form = require("@webiny/form");
+
+var _Select = require("@webiny/ui/Select");
+
+var _ContentEntriesViewConfig = require("./ContentEntriesViewConfig");
+
+var _ContentEntriesRenderer = require("./ContentEntriesRenderer");
+
+var Filter = _ContentEntriesViewConfig.ContentEntriesViewConfig.Filter,
+    Sorter = _ContentEntriesViewConfig.ContentEntriesViewConfig.Sorter;
+
+var FilterByStatus = function FilterByStatus() {
+  var bind = (0, _form.useBind)({
+    name: "status",
+    defaultValue: "all",
+    beforeChange: function beforeChange(value, cb) {
+      cb(value === "all" ? undefined : value);
+    }
+  });
+  return /*#__PURE__*/_react.default.createElement(_Select.Select, Object.assign({}, bind, {
+    label: "Filter by status",
+    description: "Filter by a specific entry status."
+  }), /*#__PURE__*/_react.default.createElement("option", {
+    value: "all"
+  }, "All"), /*#__PURE__*/_react.default.createElement("option", {
+    value: "draft"
+  }, "Draft"), /*#__PURE__*/_react.default.createElement("option", {
+    value: "published"
+  }, "Published"), /*#__PURE__*/_react.default.createElement("option", {
+    value: "unpublished"
+  }, "Unpublished"), /*#__PURE__*/_react.default.createElement("option", {
+    value: "reviewRequested"
+  }, "Review requested"), /*#__PURE__*/_react.default.createElement("option", {
+    value: "changesRequested"
+  }, "Changes requested"));
+};
+
+var ContentEntriesModule = function ContentEntriesModule() {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_appAdmin.Compose, {
+    component: _ContentEntriesViewConfig.ContentEntriesViewRenderer,
+    with: _ContentEntriesRenderer.ContentEntriesRenderer
+  }), /*#__PURE__*/_react.default.createElement(_appAdmin.Plugins, null, /*#__PURE__*/_react.default.createElement(_ContentEntriesViewConfig.ContentEntriesViewConfig, null, /*#__PURE__*/_react.default.createElement(Filter, {
+    name: "status",
+    element: /*#__PURE__*/_react.default.createElement(FilterByStatus, null)
+  }), /*#__PURE__*/_react.default.createElement(Sorter, {
+    name: "savedOn_DESC",
+    label: "Newest to oldest"
+  }), /*#__PURE__*/_react.default.createElement(Sorter, {
+    name: "savedOn_ASC",
+    label: "Oldest to newest"
+  }))));
+};
+
+exports.ContentEntriesModule = ContentEntriesModule;

package/admin/views/contentEntries/experiment/ContentEntriesModule.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Filter","ContentEntriesViewConfig","Sorter","FilterByStatus","bind","useBind","name","defaultValue","beforeChange","value","cb","undefined","ContentEntriesModule","ContentEntriesViewRenderer","ContentEntriesRenderer"],"sources":["ContentEntriesModule.tsx"],"sourcesContent":["import React from \"react\";\nimport { Compose, Plugins } from \"@webiny/app-admin\";\nimport { useBind } from \"@webiny/form\";\nimport { Select } from \"@webiny/ui/Select\";\nimport { ContentEntriesViewRenderer, ContentEntriesViewConfig } from \"./ContentEntriesViewConfig\";\nimport { ContentEntriesRenderer } from \"./ContentEntriesRenderer\";\n\nconst { Filter, Sorter } = ContentEntriesViewConfig;\n\nconst FilterByStatus = () => {\n    const bind = useBind({\n        name: \"status\",\n        defaultValue: \"all\",\n        beforeChange(value, cb) {\n            cb(value === \"all\" ? undefined : value);\n        }\n    });\n\n    return (\n        <Select\n            {...bind}\n            label={\"Filter by status\"}\n            description={\"Filter by a specific entry status.\"}\n        >\n            <option value={\"all\"}>All</option>\n            <option value={\"draft\"}>Draft</option>\n            <option value={\"published\"}>Published</option>\n            <option value={\"unpublished\"}>Unpublished</option>\n            <option value={\"reviewRequested\"}>Review requested</option>\n            <option value={\"changesRequested\"}>Changes requested</option>\n        </Select>\n    );\n};\n\nexport const ContentEntriesModule = () => {\n    return (\n        <>\n            <Compose component={ContentEntriesViewRenderer} with={ContentEntriesRenderer} />\n            <Plugins>\n                <ContentEntriesViewConfig>\n                    <Filter name={\"status\"} element={<FilterByStatus />} />\n                    <Sorter name={\"savedOn_DESC\"} label={\"Newest to oldest\"} />\n                    <Sorter name={\"savedOn_ASC\"} label={\"Oldest to newest\"} />\n                </ContentEntriesViewConfig>\n            </Plugins>\n        </>\n    );\n};\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA,IAAQA,MAAR,GAA2BC,kDAA3B,CAAQD,MAAR;AAAA,IAAgBE,MAAhB,GAA2BD,kDAA3B,CAAgBC,MAAhB;;AAEA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,GAAM;EACzB,IAAMC,IAAI,GAAG,IAAAC,aAAA,EAAQ;IACjBC,IAAI,EAAE,QADW;IAEjBC,YAAY,EAAE,KAFG;IAGjBC,YAHiB,wBAGJC,KAHI,EAGGC,EAHH,EAGO;MACpBA,EAAE,CAACD,KAAK,KAAK,KAAV,GAAkBE,SAAlB,GAA8BF,KAA/B,CAAF;IACH;EALgB,CAAR,CAAb;EAQA,oBACI,6BAAC,cAAD,oBACQL,IADR;IAEI,KAAK,EAAE,kBAFX;IAGI,WAAW,EAAE;EAHjB,iBAKI;IAAQ,KAAK,EAAE;EAAf,SALJ,eAMI;IAAQ,KAAK,EAAE;EAAf,WANJ,eAOI;IAAQ,KAAK,EAAE;EAAf,eAPJ,eAQI;IAAQ,KAAK,EAAE;EAAf,iBARJ,eASI;IAAQ,KAAK,EAAE;EAAf,sBATJ,eAUI;IAAQ,KAAK,EAAE;EAAf,uBAVJ,CADJ;AAcH,CAvBD;;AAyBO,IAAMQ,oBAAoB,GAAG,SAAvBA,oBAAuB,GAAM;EACtC,oBACI,yEACI,6BAAC,iBAAD;IAAS,SAAS,EAAEC,oDAApB;IAAgD,IAAI,EAAEC;EAAtD,EADJ,eAEI,6BAAC,iBAAD,qBACI,6BAAC,kDAAD,qBACI,6BAAC,MAAD;IAAQ,IAAI,EAAE,QAAd;IAAwB,OAAO,eAAE,6BAAC,cAAD;EAAjC,EADJ,eAEI,6BAAC,MAAD;IAAQ,IAAI,EAAE,cAAd;IAA8B,KAAK,EAAE;EAArC,EAFJ,eAGI,6BAAC,MAAD;IAAQ,IAAI,EAAE,aAAd;IAA6B,KAAK,EAAE;EAApC,EAHJ,CADJ,CAFJ,CADJ;AAYH,CAbM"}

package/admin/views/contentEntries/experiment/ContentEntriesRenderer.d.ts

@@ -0,0 +1,2 @@
+import { HigherOrderComponent } from "@webiny/app-admin";
+export declare const ContentEntriesRenderer: HigherOrderComponent;

package/admin/views/contentEntries/experiment/ContentEntriesRenderer.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireWildcard3 = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContentEntriesRenderer = void 0;
+
+var _interopRequireWildcard2 = _interopRequireDefault(require("@babel/runtime/helpers/interopRequireWildcard"));
+
+var _react = _interopRequireWildcard3(require("react"));
+
+var _Progress = require("@webiny/ui/Progress");
+
+var ContentEntriesView = /*#__PURE__*/(0, _react.lazy)(function () {
+  return Promise.resolve().then(function () {
+    return (0, _interopRequireWildcard2.default)(require("../ContentEntries"));
+  });
+});
+
+var ContentEntriesRenderer = function ContentEntriesRenderer() {
+  return function ContentEntriesRenderer() {
+    return /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+      fallback: /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, null)
+    }, /*#__PURE__*/_react.default.createElement(ContentEntriesView, null));
+  };
+};
+
+exports.ContentEntriesRenderer = ContentEntriesRenderer;

package/admin/views/contentEntries/experiment/ContentEntriesRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ContentEntriesView","lazy","ContentEntriesRenderer"],"sources":["ContentEntriesRenderer.tsx"],"sourcesContent":["import React, { Suspense, lazy } from \"react\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { HigherOrderComponent } from \"@webiny/app-admin\";\n\nconst ContentEntriesView = lazy(() => import(\"../ContentEntries\"));\n\nexport const ContentEntriesRenderer: HigherOrderComponent = () => {\n    return function ContentEntriesRenderer() {\n        return (\n            <Suspense fallback={<CircularProgress />}>\n                <ContentEntriesView />\n            </Suspense>\n        );\n    };\n};\n"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AAGA,IAAMA,kBAAkB,gBAAG,IAAAC,WAAA,EAAK;EAAA;IAAA;EAAA;AAAA,CAAL,CAA3B;;AAEO,IAAMC,sBAA4C,GAAG,SAA/CA,sBAA+C,GAAM;EAC9D,OAAO,SAASA,sBAAT,GAAkC;IACrC,oBACI,6BAAC,eAAD;MAAU,QAAQ,eAAE,6BAAC,0BAAD;IAApB,gBACI,6BAAC,kBAAD,OADJ,CADJ;EAKH,CAND;AAOH,CARM"}

package/admin/views/contentEntries/experiment/ContentEntriesViewConfig.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+interface ContentEntriesViewConfig extends React.FC<unknown> {
+    Filter: React.FC<ContentEntriesViewConfigFilterProps>;
+    Sorter: React.FC<ContentEntriesViewConfigSorterProps>;
+}
+export declare const ContentEntriesViewConfig: ContentEntriesViewConfig;
+export interface ContentEntriesViewConfigFilterProps {
+    name: string;
+    element?: React.ReactElement<unknown>;
+    modelIds?: string[];
+    remove?: boolean;
+}
+export interface ContentEntriesViewConfigSorterProps {
+    name: string;
+    label: string;
+    modelIds?: string[];
+    remove?: boolean;
+}
+export declare const ContentEntriesView: import("@webiny/app-admin").ComposableFC<unknown>;
+export declare const ContentEntriesViewRenderer: import("@webiny/app-admin").ComposableFC<unknown>;
+export interface ContentEntriesViewConfigFilter {
+    name: string;
+    element: React.ReactElement;
+    modelIds: string[];
+}
+export interface ContentEntriesViewConfigSorter {
+    name: string;
+    label: string;
+    modelIds: string[];
+}
+export declare function useContentEntriesViewConfig(): {
+    filters: ContentEntriesViewConfigFilter[];
+    sorters: ContentEntriesViewConfigSorter[];
+};
+export {};

package/admin/views/contentEntries/experiment/ContentEntriesViewConfig.js

@@ -0,0 +1,152 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContentEntriesViewRenderer = exports.ContentEntriesViewConfig = exports.ContentEntriesView = void 0;
+exports.useContentEntriesViewConfig = useContentEntriesViewConfig;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _appAdmin = require("@webiny/app-admin");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Property = require("./Property");
+
+var ContentEntriesViewConfigApply = (0, _appAdmin.makeComposable)("ContentEntriesViewConfigApply", function (_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children);
+});
+
+var createHOC = function createHOC(newChildren) {
+  return function (BaseComponent) {
+    return function ConfigHOC(_ref2) {
+      var children = _ref2.children;
+      return /*#__PURE__*/_react.default.createElement(BaseComponent, null, newChildren, children);
+    };
+  };
+};
+
+var ContentEntriesViewConfig = function ContentEntriesViewConfig(_ref3) {
+  var children = _ref3.children;
+  return /*#__PURE__*/_react.default.createElement(_appAdmin.Compose, {
+    component: ContentEntriesViewConfigApply,
+    with: createHOC(children)
+  });
+};
+
+exports.ContentEntriesViewConfig = ContentEntriesViewConfig;
+
+var Filter = function Filter(_ref4) {
+  var name = _ref4.name,
+      element = _ref4.element,
+      _ref4$modelIds = _ref4.modelIds,
+      modelIds = _ref4$modelIds === void 0 ? [] : _ref4$modelIds,
+      _ref4$remove = _ref4.remove,
+      remove = _ref4$remove === void 0 ? false : _ref4$remove;
+  return /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: name,
+    name: "filter",
+    merge: true,
+    remove: remove
+  }, /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: "name",
+    name: "name",
+    value: name
+  }), /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: "modelIds",
+    name: "modelIds",
+    value: modelIds
+  }), element ? /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: "element",
+    name: "element",
+    value: element
+  }) : null);
+};
+
+var Sorter = function Sorter(_ref5) {
+  var name = _ref5.name,
+      label = _ref5.label,
+      _ref5$modelIds = _ref5.modelIds,
+      modelIds = _ref5$modelIds === void 0 ? [] : _ref5$modelIds,
+      _ref5$remove = _ref5.remove,
+      remove = _ref5$remove === void 0 ? false : _ref5$remove;
+  return /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: name,
+    name: "sorter",
+    merge: true,
+    remove: remove
+  }, /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: "name",
+    name: "name",
+    value: name
+  }), /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: "label",
+    name: "label",
+    value: label
+  }), /*#__PURE__*/_react.default.createElement(_Property.Property, {
+    id: "modelIds",
+    name: "modelIds",
+    value: modelIds
+  }));
+};
+
+ContentEntriesViewConfig.Filter = Filter;
+ContentEntriesViewConfig.Sorter = Sorter;
+var defaultContext = {
+  properties: []
+};
+
+var ViewContext = /*#__PURE__*/_react.default.createContext(defaultContext);
+
+var ContentEntriesView = (0, _appAdmin.makeComposable)("ContentEntriesView", function () {
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      properties = _useState2[0],
+      setProperties = _useState2[1];
+
+  var context = {
+    properties: properties
+  };
+
+  var stateUpdater = function stateUpdater(properties) {
+    setProperties(properties);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(ViewContext.Provider, {
+    value: context
+  }, /*#__PURE__*/_react.default.createElement(_Property.PropertyContainer, {
+    name: "view",
+    onChange: stateUpdater
+  }, /*#__PURE__*/_react.default.createElement(ContentEntriesViewConfigApply, null), /*#__PURE__*/_react.default.createElement(ContentEntriesViewRenderer, null)));
+});
+exports.ContentEntriesView = ContentEntriesView;
+var ContentEntriesViewRenderer = (0, _appAdmin.makeComposable)("ContentEntriesViewRenderer");
+exports.ContentEntriesViewRenderer = ContentEntriesViewRenderer;
+
+function byName(name) {
+  return function (obj) {
+    return obj.name === name;
+  };
+}
+
+function useContentEntriesViewConfig() {
+  var _useContext = (0, _react.useContext)(ViewContext),
+      properties = _useContext.properties;
+
+  var filters = properties.filter(byName("filter")).map(function (f) {
+    return (0, _Property.toObject)(f);
+  });
+  var sorters = properties.filter(byName("sorter")).map(function (f) {
+    return (0, _Property.toObject)(f);
+  });
+  return {
+    filters: filters,
+    sorters: sorters
+  };
+}

package/admin/views/contentEntries/experiment/ContentEntriesViewConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ContentEntriesViewConfigApply","makeComposable","children","createHOC","newChildren","BaseComponent","ConfigHOC","ContentEntriesViewConfig","Filter","name","element","modelIds","remove","Sorter","label","defaultContext","properties","ViewContext","React","createContext","ContentEntriesView","useState","setProperties","context","stateUpdater","ContentEntriesViewRenderer","byName","obj","useContentEntriesViewConfig","useContext","filters","filter","map","f","toObject","sorters"],"sources":["ContentEntriesViewConfig.tsx"],"sourcesContent":["import { makeComposable, Compose, HigherOrderComponent } from \"@webiny/app-admin\";\nimport React, { useContext, useState } from \"react\";\nimport { Property, PropertyContainer, toObject } from \"./Property\";\n\ninterface ContentEntriesViewConfig extends React.FC<unknown> {\n    Filter: React.FC<ContentEntriesViewConfigFilterProps>;\n    Sorter: React.FC<ContentEntriesViewConfigSorterProps>;\n}\n\nconst ContentEntriesViewConfigApply = makeComposable(\n    \"ContentEntriesViewConfigApply\",\n    ({ children }) => {\n        return <>{children}</>;\n    }\n);\n\nconst createHOC =\n    (newChildren: React.ReactNode): HigherOrderComponent =>\n    BaseComponent => {\n        return function ConfigHOC({ children }) {\n            return (\n                <BaseComponent>\n                    {newChildren}\n                    {children}\n                </BaseComponent>\n            );\n        };\n    };\n\nexport const ContentEntriesViewConfig: ContentEntriesViewConfig = ({ children }) => {\n    return <Compose component={ContentEntriesViewConfigApply} with={createHOC(children)} />;\n};\n\nexport interface ContentEntriesViewConfigFilterProps {\n    name: string;\n    element?: React.ReactElement<unknown>;\n    modelIds?: string[];\n    remove?: boolean;\n}\n\nconst Filter: React.FC<ContentEntriesViewConfigFilterProps> = ({\n    name,\n    element,\n    modelIds = [],\n    remove = false\n}) => {\n    return (\n        <Property id={name} name={\"filter\"} merge={true} remove={remove}>\n            <Property id={\"name\"} name={\"name\"} value={name} />\n            <Property id={\"modelIds\"} name={\"modelIds\"} value={modelIds} />\n            {element ? <Property id={\"element\"} name={\"element\"} value={element} /> : null}\n        </Property>\n    );\n};\n\nexport interface ContentEntriesViewConfigSorterProps {\n    name: string;\n    label: string;\n    modelIds?: string[];\n    remove?: boolean;\n}\n\nconst Sorter: React.FC<ContentEntriesViewConfigSorterProps> = ({\n    name,\n    label,\n    modelIds = [],\n    remove = false\n}) => {\n    return (\n        <Property id={name} name={\"sorter\"} merge={true} remove={remove}>\n            <Property id={\"name\"} name={\"name\"} value={name} />\n            <Property id={\"label\"} name={\"label\"} value={label} />\n            <Property id={\"modelIds\"} name={\"modelIds\"} value={modelIds} />\n        </Property>\n    );\n};\n\nContentEntriesViewConfig.Filter = Filter;\nContentEntriesViewConfig.Sorter = Sorter;\n\ninterface ViewContext {\n    properties: Property[];\n}\n\nconst defaultContext = { properties: [] };\n\nconst ViewContext = React.createContext<ViewContext>(defaultContext);\n\nexport const ContentEntriesView = makeComposable(\"ContentEntriesView\", () => {\n    const [properties, setProperties] = useState<Property[]>([]);\n    const context = { properties };\n\n    const stateUpdater = (properties: Property[]) => {\n        setProperties(properties);\n    };\n\n    return (\n        <ViewContext.Provider value={context}>\n            <PropertyContainer name={\"view\"} onChange={stateUpdater}>\n                <ContentEntriesViewConfigApply />\n                <ContentEntriesViewRenderer />\n            </PropertyContainer>\n        </ViewContext.Provider>\n    );\n});\n\nexport const ContentEntriesViewRenderer = makeComposable(\"ContentEntriesViewRenderer\");\n\nfunction byName(name: string) {\n    return (obj: Property) => obj.name === name;\n}\n\nexport interface ContentEntriesViewConfigFilter {\n    name: string;\n    element: React.ReactElement;\n    modelIds: string[];\n}\n\nexport interface ContentEntriesViewConfigSorter {\n    name: string;\n    label: string;\n    modelIds: string[];\n}\n\nexport function useContentEntriesViewConfig(): {\n    filters: ContentEntriesViewConfigFilter[];\n    sorters: ContentEntriesViewConfigSorter[];\n} {\n    const { properties } = useContext(ViewContext);\n\n    const filters = properties\n        .filter(byName(\"filter\"))\n        .map(f => toObject<ContentEntriesViewConfigFilter>(f));\n\n    const sorters = properties\n        .filter(byName(\"sorter\"))\n        .map(f => toObject<ContentEntriesViewConfigSorter>(f));\n\n    return {\n        filters,\n        sorters\n    };\n}\n"],"mappings":"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"}

package/admin/views/contentEntries/experiment/Property.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Note by @pavel910:
+ *
+ * TS is disabled in this file, as this is a wild experiment, and I need to come back and fix some types, which are not very
+ * obvious. I don't have time to do it right now. If the experiment is successful, I'll come back and clean this up, and
+ * extract this whole logic into a separate package, as this is a tiny framework for building data objects using React, and
+ * we might want to use it in many more places (all views, Page Builder Editor, etc.).
+ *
+ * More on this a bit later, if the experiment is successful.
+ */
+import { FC } from "react";
+export declare function toObject<T = unknown>(property: Property): T;
+export declare function toArray(objects: Property[]): {}[];
+export interface Property<TValue = unknown> {
+    id?: string;
+    name: string;
+    value?: TValue;
+    properties?: Property[];
+}
+interface PropertyContainerProps {
+    name: string;
+    onChange: any;
+}
+export declare const PropertyContainer: FC<PropertyContainerProps>;
+interface PropertyProps {
+    id?: string;
+    name: string;
+    value?: unknown;
+    merge?: boolean;
+    replace?: boolean;
+    remove?: boolean;
+}
+export declare const Property: FC<PropertyProps>;
+export {};