@webiny/app-headless-cms 0.0.0-mt-2 → 0.0.0-unstable.13771d80a8

package/admin/views/contentModels/CloneContentModelDialog.js

@@ -0,0 +1,255 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CloneContentModelDialog = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var UID = _interopRequireWildcard(require("@webiny/ui/Dialog"));
+var _reactRouter = require("@webiny/react-router");
+var _form = require("@webiny/form");
+var _Input = require("@webiny/ui/Input");
+var _Select = require("@webiny/ui/Select");
+var _useSnackbar2 = require("@webiny/app-admin/hooks/useSnackbar");
+var _Progress = require("@webiny/ui/Progress");
+var _validation = require("@webiny/validation");
+var _hooks = require("../../hooks");
+var _i18n = require("@webiny/app/i18n");
+var _Button = require("@webiny/ui/Button");
+var _Grid = require("@webiny/ui/Grid");
+var _cache = require("./cache");
+var _useI18N2 = require("@webiny/app-i18n/hooks/useI18N");
+var _viewsGraphql = require("../../viewsGraphql");
+var _Dialog2 = require("../../components/Dialog");
+var _nameValidator = require("./helpers/nameValidator");
+var _apiNameValidator = require("./helpers/apiNameValidator");
+var _IconPicker = require("../../components/IconPicker");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
+var t = _i18n.i18n.ns("app-headless-cms/admin/views/content-models/clone-content-model-dialog");
+var getSelectedGroup = function getSelectedGroup(groups, model) {
+  if (!groups || groups.length === 0 || !model) {
+    return "";
+  }
+  var current = model.group.id;
+  var group = groups.find(function (g) {
+    return g.value === current;
+  });
+  if (group) {
+    return group.value;
+  }
+  var defaultSelected = groups.find(function () {
+    return true;
+  });
+  return defaultSelected ? defaultSelected.value : null;
+};
+var CloneContentModelDialog = function CloneContentModelDialog(_ref) {
+  var onClose = _ref.onClose,
+    contentModel = _ref.contentModel,
+    closeModal = _ref.closeModal;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
+    showSnackbar = _useSnackbar.showSnackbar;
+  var _useRouter = (0, _reactRouter.useRouter)(),
+    history = _useRouter.history;
+  var _useI18N = (0, _useI18N2.useI18N)(),
+    getLocales = _useI18N.getLocales,
+    getCurrentLocale = _useI18N.getCurrentLocale,
+    setCurrentLocale = _useI18N.setCurrentLocale;
+  var client = (0, _hooks.useApolloClient)();
+  var currentLocale = getCurrentLocale("content");
+  var _useState3 = (0, _react.useState)(currentLocale || ""),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    locale = _useState4[0],
+    setLocale = _useState4[1];
+  var _useState5 = (0, _react.useState)(null),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    groups = _useState6[0],
+    setGroups = _useState6[1];
+  var _useState7 = (0, _react.useState)([]),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    models = _useState8[0],
+    setModels = _useState8[1];
+  var _useMutation = (0, _hooks.useMutation)(_viewsGraphql.CREATE_CONTENT_MODEL_FROM, {
+      onError: function onError(error) {
+        setLoading(false);
+        showSnackbar(error.message);
+      },
+      update: function update(cache, response) {
+        if (!response.data) {
+          showSnackbar("Missing data on Create Content Model From Mutation Response.");
+          return;
+        }
+        var _response$data$create = response.data.createContentModelFrom,
+          model = _response$data$create.data,
+          error = _response$data$create.error;
+        if (error) {
+          setLoading(false);
+          showSnackbar(error.message);
+          return;
+        }
+        if (currentLocale !== locale) {
+          setCurrentLocale(locale, "content");
+          window.location.reload();
+          return;
+        }
+        (0, _cache.addModelToListCache)(cache, model);
+        (0, _cache.addModelToGroupCache)(cache, model);
+        history.push("/cms/content-models/");
+        closeModal();
+      }
+    }),
+    _useMutation2 = (0, _slicedToArray2.default)(_useMutation, 1),
+    createContentModelFrom = _useMutation2[0];
+  var locales = getLocales().map(function (_ref2) {
+    var code = _ref2.code;
+    return {
+      value: code,
+      label: code === currentLocale ? "Current locale (".concat(code, ")") : code
+    };
+  });
+  var listMenuGroupsQuery = (0, _hooks.useQueryLocale)(_viewsGraphql.LIST_MENU_CONTENT_GROUPS_MODELS, locale);
+  (0, _react.useEffect)(function () {
+    if (!listMenuGroupsQuery.data || listMenuGroupsQuery.loading) {
+      return;
+    }
+    var options = [];
+    var models = [];
+    var items = listMenuGroupsQuery.data.listContentModelGroups.data || [];
+    var _iterator = (0, _createForOfIteratorHelper2.default)(items),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var item = _step.value;
+        options.push({
+          value: item.id,
+          label: item.name
+        });
+        models.push.apply(models, (0, _toConsumableArray2.default)(item.contentModels));
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+    setGroups(options);
+    setModels(models);
+  }, [listMenuGroupsQuery.data, listMenuGroupsQuery.loading]);
+  var selectedGroup = getSelectedGroup(groups, contentModel);
+  var nameValidator = (0, _react.useCallback)((0, _nameValidator.createNameValidator)({
+    models: models
+  }), [client, models]);
+  var apiNameValidator = (0, _react.useCallback)((0, _apiNameValidator.createApiNameValidator)({
+    client: client,
+    models: models
+  }), [client, models]);
+  return /*#__PURE__*/_react.default.createElement(_Dialog2.Dialog, {
+    open: true,
+    onClose: onClose,
+    "data-testid": "cms-clone-content-model-modal"
+  }, !groups && /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, {
+    label: "Please wait while we load required information."
+  }), /*#__PURE__*/_react.default.createElement(_form.Form, {
+    data: {
+      group: selectedGroup,
+      locale: locale,
+      name: contentModel.name
+    },
+    onSubmit: function onSubmit(data) {
+      setLoading(true);
+      createContentModelFrom({
+        variables: {
+          modelId: contentModel.modelId,
+          /**
+           * We know that data is CmsModel
+           */
+          data: data
+        }
+      });
+    }
+  }, function (_ref3) {
+    var Bind = _ref3.Bind,
+      submit = _ref3.submit;
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, loading && /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, null), /*#__PURE__*/_react.default.createElement(UID.DialogTitle, null, t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Clone Content Model"])))), /*#__PURE__*/_react.default.createElement(UID.DialogContent, null, /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "name",
+      validators: [_validation.validation.create("required,maxLength:100"), nameValidator]
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      label: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Name"]))),
+      description: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["The name of the content model"])))
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "locale",
+      validators: _validation.validation.create("required"),
+      afterChange: function afterChange(value) {
+        if (!value) {
+          return;
+        }
+        setLocale(value);
+        setGroups(null);
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
+      description: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Choose a locale into which you wish to clone the model"]))),
+      label: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Content model locale"]))),
+      options: locales
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "singularApiName",
+      validators: [_validation.validation.create("required,maxLength:100"), apiNameValidator]
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      label: t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Singular API Name"]))),
+      description: t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["The API name of the content model. For example: AuthorCategory."]))),
+      "data-testid": "cms.newcontentmodeldialog.singularApiName"
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "pluralApiName",
+      validators: [_validation.validation.create("required,maxLength:100"), apiNameValidator]
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      label: t(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["Plural API Name"]))),
+      description: t(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["The plural API name of the content model. For example: AuthorCategories."]))),
+      "data-testid": "cms.newcontentmodeldialog.pluralApiName"
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "group",
+      validators: _validation.validation.create("required")
+    }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
+      description: t(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["Choose a content model group"]))),
+      label: t(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["Content model group"]))),
+      options: groups || []
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "icon"
+    }, /*#__PURE__*/_react.default.createElement(_IconPicker.IconPicker, {
+      label: t(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["Icon"]))),
+      description: t(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["Choose an icon to represent the model."])))
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "description"
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      rows: 4,
+      maxLength: 200,
+      characterCount: true,
+      label: t(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["Description"])))
+    }))))), /*#__PURE__*/_react.default.createElement(UID.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
+      onClick: function onClick(ev) {
+        submit(ev);
+      }
+    }, "+ ", t(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["Clone"]))))));
+  }));
+};
+exports.CloneContentModelDialog = CloneContentModelDialog;

package/admin/views/contentModels/CloneContentModelDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","getSelectedGroup","groups","model","length","current","group","id","find","g","value","defaultSelected","CloneContentModelDialog","onClose","contentModel","closeModal","useState","loading","setLoading","useSnackbar","showSnackbar","useRouter","history","useI18N","getLocales","getCurrentLocale","setCurrentLocale","client","useApolloClient","currentLocale","locale","setLocale","setGroups","models","setModels","useMutation","CREATE_CONTENT_MODEL_FROM","onError","error","message","update","cache","response","data","createContentModelFrom","window","location","reload","addModelToListCache","addModelToGroupCache","push","locales","map","code","label","listMenuGroupsQuery","useQueryLocale","LIST_MENU_CONTENT_GROUPS_MODELS","useEffect","options","items","listContentModelGroups","item","name","contentModels","selectedGroup","nameValidator","useCallback","createNameValidator","apiNameValidator","createApiNameValidator","variables","modelId","Bind","submit","validation","create","ev"],"sources":["CloneContentModelDialog.tsx"],"sourcesContent":["import React, { useState, useCallback, useEffect } from \"react\";\nimport * as UID from \"@webiny/ui/Dialog\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { Form } from \"@webiny/form\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { Select } from \"@webiny/ui/Select\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { validation } from \"@webiny/validation\";\nimport { useApolloClient, useMutation, useQueryLocale } from \"../../hooks\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ButtonDefault } from \"@webiny/ui/Button\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { addModelToGroupCache, addModelToListCache } from \"./cache\";\nimport { CmsModel } from \"~/types\";\nimport { useI18N } from \"@webiny/app-i18n/hooks/useI18N\";\nimport {\n    CREATE_CONTENT_MODEL_FROM,\n    LIST_MENU_CONTENT_GROUPS_MODELS,\n    CreateCmsModelFromMutationResponse,\n    CreateCmsModelFromMutationVariables,\n    ListMenuCmsGroupsQueryResponse\n} from \"../../viewsGraphql\";\nimport { CmsGroupOption } from \"~/admin/views/contentModels/types\";\nimport { Dialog } from \"~/admin/components/Dialog\";\nimport { createNameValidator } from \"~/admin/views/contentModels/helpers/nameValidator\";\nimport { createApiNameValidator } from \"~/admin/views/contentModels/helpers/apiNameValidator\";\nimport { IconPicker } from \"~/admin/components/IconPicker\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/views/content-models/clone-content-model-dialog\");\n\ninterface Props {\n    onClose: UID.DialogOnClose;\n    contentModel: CmsModel;\n    closeModal: () => void;\n}\n\nconst getSelectedGroup = (groups: CmsGroupOption[] | null, model: CmsModel): string | null => {\n    if (!groups || groups.length === 0 || !model) {\n        return \"\";\n    }\n    const current = model.group.id;\n    const group = groups.find(g => g.value === current);\n    if (group) {\n        return group.value;\n    }\n    const defaultSelected = groups.find(() => true);\n    return defaultSelected ? defaultSelected.value : null;\n};\n\nexport const CloneContentModelDialog: React.FC<Props> = ({ onClose, contentModel, closeModal }) => {\n    const [loading, setLoading] = useState<boolean>(false);\n    const { showSnackbar } = useSnackbar();\n    const { history } = useRouter();\n    const { getLocales, getCurrentLocale, setCurrentLocale } = useI18N();\n    const client = useApolloClient();\n\n    const currentLocale = getCurrentLocale(\"content\");\n    const [locale, setLocale] = useState<string>(currentLocale || \"\");\n    const [groups, setGroups] = useState<CmsGroupOption[] | null>(null);\n    const [models, setModels] = useState<CmsModel[]>([]);\n\n    const [createContentModelFrom] = useMutation<\n        CreateCmsModelFromMutationResponse,\n        CreateCmsModelFromMutationVariables\n    >(CREATE_CONTENT_MODEL_FROM, {\n        onError(error) {\n            setLoading(false);\n            showSnackbar(error.message);\n        },\n        update(cache, response) {\n            if (!response.data) {\n                showSnackbar(`Missing data on Create Content Model From Mutation Response.`);\n                return;\n            }\n            const { data: model, error } = response.data.createContentModelFrom;\n\n            if (error) {\n                setLoading(false);\n                showSnackbar(error.message);\n                return;\n            }\n\n            if (currentLocale !== locale) {\n                setCurrentLocale(locale, \"content\");\n                window.location.reload();\n                return;\n            }\n\n            addModelToListCache(cache, model);\n            addModelToGroupCache(cache, model);\n\n            history.push(\"/cms/content-models/\");\n            closeModal();\n        }\n    });\n\n    const locales = getLocales().map(({ code }) => {\n        return {\n            value: code,\n            label: code === currentLocale ? `Current locale (${code})` : code\n        };\n    });\n\n    const listMenuGroupsQuery = useQueryLocale<ListMenuCmsGroupsQueryResponse>(\n        LIST_MENU_CONTENT_GROUPS_MODELS,\n        locale\n    );\n\n    useEffect(() => {\n        if (!listMenuGroupsQuery.data || listMenuGroupsQuery.loading) {\n            return;\n        }\n        const options: CmsGroupOption[] = [];\n        const models: CmsModel[] = [];\n        const items = listMenuGroupsQuery.data.listContentModelGroups.data || [];\n        for (const item of items) {\n            options.push({\n                value: item.id,\n                label: item.name\n            });\n            models.push(...item.contentModels);\n        }\n        setGroups(options);\n        setModels(models);\n    }, [listMenuGroupsQuery.data, listMenuGroupsQuery.loading]);\n\n    const selectedGroup = getSelectedGroup(groups, contentModel);\n\n    const nameValidator = useCallback(createNameValidator({ models }), [client, models]);\n\n    const apiNameValidator = useCallback(createApiNameValidator({ client, models }), [\n        client,\n        models\n    ]);\n\n    return (\n        <Dialog open={true} onClose={onClose} data-testid=\"cms-clone-content-model-modal\">\n            {!groups && (\n                <CircularProgress label={\"Please wait while we load required information.\"} />\n            )}\n\n            <Form\n                data={{\n                    group: selectedGroup,\n                    locale,\n                    name: contentModel.name\n                }}\n                onSubmit={data => {\n                    setLoading(true);\n                    createContentModelFrom({\n                        variables: {\n                            modelId: contentModel.modelId,\n                            /**\n                             * We know that data is CmsModel\n                             */\n                            data: data as unknown as CmsModel\n                        }\n                    });\n                }}\n            >\n                {({ Bind, submit }) => (\n                    <>\n                        {loading && <CircularProgress />}\n                        <UID.DialogTitle>{t`Clone Content Model`}</UID.DialogTitle>\n                        <UID.DialogContent>\n                            <Grid>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"name\"}\n                                        validators={[\n                                            validation.create(\"required,maxLength:100\"),\n                                            nameValidator\n                                        ]}\n                                    >\n                                        <Input\n                                            label={t`Name`}\n                                            description={t`The name of the content model`}\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"locale\"}\n                                        validators={validation.create(\"required\")}\n                                        afterChange={(value?: string) => {\n                                            if (!value) {\n                                                return;\n                                            }\n                                            setLocale(value);\n                                            setGroups(null);\n                                        }}\n                                    >\n                                        <Select\n                                            description={t`Choose a locale into which you wish to clone the model`}\n                                            label={t`Content model locale`}\n                                            options={locales}\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"singularApiName\"}\n                                        validators={[\n                                            validation.create(\"required,maxLength:100\"),\n                                            apiNameValidator\n                                        ]}\n                                    >\n                                        <Input\n                                            label={t`Singular API Name`}\n                                            description={t`The API name of the content model. For example: AuthorCategory.`}\n                                            data-testid=\"cms.newcontentmodeldialog.singularApiName\"\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"pluralApiName\"}\n                                        validators={[\n                                            validation.create(\"required,maxLength:100\"),\n                                            apiNameValidator\n                                        ]}\n                                    >\n                                        <Input\n                                            label={t`Plural API Name`}\n                                            description={t`The plural API name of the content model. For example: AuthorCategories.`}\n                                            data-testid=\"cms.newcontentmodeldialog.pluralApiName\"\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind name={\"group\"} validators={validation.create(\"required\")}>\n                                        <Select\n                                            description={t`Choose a content model group`}\n                                            label={t`Content model group`}\n                                            options={groups || []}\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind name=\"icon\">\n                                        <IconPicker\n                                            label={t`Icon`}\n                                            description={t`Choose an icon to represent the model.`}\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind name=\"description\">\n                                        <Input\n                                            rows={4}\n                                            maxLength={200}\n                                            characterCount\n                                            label={t`Description`}\n                                        />\n                                    </Bind>\n                                </Cell>\n                            </Grid>\n                        </UID.DialogContent>\n                        <UID.DialogActions>\n                            <ButtonDefault\n                                onClick={ev => {\n                                    submit(ev);\n                                }}\n                            >\n                                + {t`Clone`}\n                            </ButtonDefault>\n                        </UID.DialogActions>\n                    </>\n                )}\n            </Form>\n        </Dialog>\n    );\n};\n"],"mappings":"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"}

package/admin/views/contentModels/ContentModelEditor.d.ts

@@ -1,2 +1,3 @@
-/// <reference types="react" />
-export default function ContentModelEditorView(): JSX.Element;
+import React from "react";
+declare const ContentModelEditorView: React.FC;
+export default ContentModelEditorView;

package/admin/views/contentModels/ContentModelEditor.js

@@ -1,35 +1,34 @@
-import React from "react";
-import HTML5Backend from "react-dnd-html5-backend";
-import { DndProvider } from "react-dnd";
-import { Editor } from "../../components/ContentModelEditor/Editor";
-import { useRouter } from "@webiny/react-router";
-import { useCms } from "../../hooks";
-import { ContentModelEditorProvider } from "../../components/ContentModelEditor/Context";
-import Snackbar from "@webiny/app-admin/ui/views/AdminView/components/Snackbar";
-export default function ContentModelEditorView() {
-  var _useRouter = useRouter(),
-      match = _useRouter.match;
-
-  var _useCms = useCms(),
-      apolloClient = _useCms.apolloClient;
-
-  var _ref = match.params,
-      modelId = _ref.modelId;
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactDndHtml5Backend = require("react-dnd-html5-backend");
+var _reactDnd = require("react-dnd");
+var _Editor = require("../../components/ContentModelEditor/Editor");
+var _reactRouter = require("@webiny/react-router");
+var _hooks = require("../../hooks");
+var _ContentModelEditor = require("../../components/ContentModelEditor");
+var ContentModelEditorView = function ContentModelEditorView() {
+  var _useRouter = (0, _reactRouter.useRouter)(),
+    params = _useRouter.params;
+  var _useCms = (0, _hooks.useCms)(),
+    apolloClient = _useCms.apolloClient;
+  var _ref = params ? params : {},
+    modelId = _ref.modelId;
   if (!apolloClient) {
     return null;
   }
-
-  return /*#__PURE__*/React.createElement(ContentModelEditorProvider, {
+  return /*#__PURE__*/_react.default.createElement(_ContentModelEditor.ContentModelEditorProvider, {
     key: modelId,
     apolloClient: apolloClient,
     modelId: modelId
-  }, /*#__PURE__*/React.createElement(DndProvider, {
-    backend: HTML5Backend
-  }, /*#__PURE__*/React.createElement(Editor, null), /*#__PURE__*/React.createElement("div", {
-    style: {
-      zIndex: 10,
-      position: "absolute"
-    }
-  }, /*#__PURE__*/React.createElement(Snackbar, null))));
-}
+  }, /*#__PURE__*/_react.default.createElement(_reactDnd.DndProvider, {
+    backend: _reactDndHtml5Backend.HTML5Backend
+  }, /*#__PURE__*/_react.default.createElement(_Editor.Editor, null)));
+};
+var _default = ContentModelEditorView;
+exports.default = _default;

package/admin/views/contentModels/ContentModelEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ContentModelEditorView","useRouter","params","useCms","apolloClient","modelId","HTML5Backend"],"sources":["ContentModelEditor.tsx"],"sourcesContent":["import React from \"react\";\nimport { HTML5Backend } from \"react-dnd-html5-backend\";\nimport { DndProvider } from \"react-dnd\";\nimport { Editor } from \"~/admin/components/ContentModelEditor/Editor\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useCms } from \"~/admin/hooks\";\nimport { ContentModelEditorProvider } from \"~/admin/components/ContentModelEditor\";\nimport { CmsModel } from \"~/types\";\n\ntype QueryMatch = Pick<Partial<CmsModel>, \"modelId\">;\n\nconst ContentModelEditorView: React.FC = () => {\n    const { params } = useRouter();\n    const { apolloClient } = useCms();\n\n    const { modelId } = (params ? params : {}) as QueryMatch;\n    if (!apolloClient) {\n        return null;\n    }\n    return (\n        <ContentModelEditorProvider key={modelId} apolloClient={apolloClient} modelId={modelId}>\n            <DndProvider backend={HTML5Backend}>\n                <Editor />\n            </DndProvider>\n        </ContentModelEditorProvider>\n    );\n};\nexport default ContentModelEditorView;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA,IAAMA,sBAAgC,GAAG,SAAnCA,sBAAgC,GAAS;EAC3C,iBAAmB,IAAAC,sBAAS,GAAE;IAAtBC,MAAM,cAANA,MAAM;EACd,cAAyB,IAAAC,aAAM,GAAE;IAAzBC,YAAY,WAAZA,YAAY;EAEpB,WAAqBF,MAAM,GAAGA,MAAM,GAAG,CAAC,CAAC;IAAjCG,OAAO,QAAPA,OAAO;EACf,IAAI,CAACD,YAAY,EAAE;IACf,OAAO,IAAI;EACf;EACA,oBACI,6BAAC,8CAA0B;IAAC,GAAG,EAAEC,OAAQ;IAAC,YAAY,EAAED,YAAa;IAAC,OAAO,EAAEC;EAAQ,gBACnF,6BAAC,qBAAW;IAAC,OAAO,EAAEC;EAAa,gBAC/B,6BAAC,cAAM,OAAG,CACA,CACW;AAErC,CAAC;AAAC,eACaN,sBAAsB;AAAA"}

package/admin/views/contentModels/ContentModels.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-declare function ContentModels(): JSX.Element;
+import React from "react";
+declare const ContentModels: React.FC;
 export default ContentModels;

package/admin/views/contentModels/ContentModels.js

@@ -1,12 +1,20 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React, { useCallback, useMemo } from "react";
-import { css } from "emotion";
-import { useSecurity } from "@webiny/app-security";
-import ContentModelsDataList from "./ContentModelsDataList";
-import NewContentModelDialog from "./NewContentModelDialog";
-import { Cell } from "@webiny/ui/Grid";
-import { Grid } from "@webiny/ui/Grid";
-var grid = /*#__PURE__*/css({
+"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.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _CloneContentModelDialog = require("./CloneContentModelDialog");
+var _NewContentModelDialog = _interopRequireDefault(require("./NewContentModelDialog"));
+var _ContentModelsDataList = _interopRequireDefault(require("./ContentModelsDataList"));
+var _emotion = require("emotion");
+var _appSecurity = require("@webiny/app-security");
+var _Grid = require("@webiny/ui/Grid");
+var grid = /*#__PURE__*/(0, _emotion.css)({
   "&.mdc-layout-grid": {
     padding: 0,
     backgroundColor: "var(--mdc-theme-background)",
@@ -15,7 +23,7 @@ var grid = /*#__PURE__*/css({
     }
   }
 }, "label:grid;");
-var centeredContent = /*#__PURE__*/css({
+var centeredContent = /*#__PURE__*/(0, _emotion.css)({
   backgroundColor: "var(--mdc-theme-surface)",
   ">.webiny-data-list": {
     display: "flex",
@@ -32,51 +40,64 @@ var centeredContent = /*#__PURE__*/css({
     overflow: "auto"
   }
 }, "label:centeredContent;");
-
-function ContentModels() {
-  var _React$useState = React.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      newContentModelDialogOpened = _React$useState2[0],
-      openNewContentModelDialog = _React$useState2[1];
-
-  var _useSecurity = useSecurity(),
-      identity = _useSecurity.identity;
-
-  var canCreate = useMemo(function () {
-    var permission = identity.getPermission("cms.contentModel");
-
+var ContentModels = function ContentModels() {
+  var _React$useState = _react.default.useState(false),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    newContentModelDialogOpened = _React$useState2[0],
+    openNewContentModelDialog = _React$useState2[1];
+  var _React$useState3 = _react.default.useState(null),
+    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+    cloneContentModel = _React$useState4[0],
+    setCloneContentModel = _React$useState4[1];
+  var _useSecurity = (0, _appSecurity.useSecurity)(),
+    identity = _useSecurity.identity,
+    getPermission = _useSecurity.getPermission;
+  var canCreate = (0, _react.useMemo)(function () {
+    var permission = getPermission("cms.contentModel");
     if (!permission) {
       return false;
     }
-
     if (typeof permission.rwd !== "string") {
       return true;
     }
-
     return permission.rwd.includes("w");
+  }, [identity]);
+  var closeModal = (0, _react.useCallback)(function () {
+    setCloneContentModel(null);
   }, []);
-  var onCreate = useCallback(function () {
+  var onCreate = (0, _react.useCallback)(function () {
     return openNewContentModelDialog(true);
   }, []);
-  var onClose = useCallback(function () {
+  var onClose = (0, _react.useCallback)(function () {
     return openNewContentModelDialog(false);
   }, []);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(NewContentModelDialog, {
+  var onClone = (0, _react.useCallback)(function (contentModel) {
+    return setCloneContentModel(contentModel);
+  }, []);
+  var onCloneClose = (0, _react.useCallback)(function () {
+    return setCloneContentModel(null);
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_NewContentModelDialog.default, {
     open: newContentModelDialogOpened,
     onClose: onClose
-  }), /*#__PURE__*/React.createElement(Grid, {
+  }), cloneContentModel && /*#__PURE__*/_react.default.createElement(_CloneContentModelDialog.CloneContentModelDialog, {
+    contentModel: cloneContentModel,
+    onClose: onCloneClose,
+    closeModal: closeModal
+  }), /*#__PURE__*/_react.default.createElement(_Grid.Grid, {
     className: grid
-  }, /*#__PURE__*/React.createElement(Cell, {
+  }, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
     span: 3
-  }), /*#__PURE__*/React.createElement(Cell, {
+  }), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
     span: 6,
     className: centeredContent
-  }, /*#__PURE__*/React.createElement(ContentModelsDataList, {
+  }, /*#__PURE__*/_react.default.createElement(_ContentModelsDataList.default, {
     canCreate: canCreate,
-    onCreate: onCreate
-  })), /*#__PURE__*/React.createElement(Cell, {
+    onCreate: onCreate,
+    onClone: onClone
+  })), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
     span: 3
   })));
-}
-
-export default ContentModels;
+};
+var _default = ContentModels;
+exports.default = _default;

package/admin/views/contentModels/ContentModels.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["grid","css","padding","backgroundColor","gridGap","centeredContent","display","flexDirection","height","overflow","maxHeight","ContentModels","React","useState","newContentModelDialogOpened","openNewContentModelDialog","cloneContentModel","setCloneContentModel","useSecurity","identity","getPermission","canCreate","useMemo","permission","rwd","includes","closeModal","useCallback","onCreate","onClose","onClone","contentModel","onCloneClose"],"sources":["ContentModels.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { CloneContentModelDialog } from \"./CloneContentModelDialog\";\nimport NewContentModelDialog from \"./NewContentModelDialog\";\nimport ContentModelsDataList from \"./ContentModelsDataList\";\nimport { css } from \"emotion\";\nimport { useSecurity } from \"@webiny/app-security\";\nimport { Cell } from \"@webiny/ui/Grid\";\nimport { Grid } from \"@webiny/ui/Grid\";\nimport { CmsModel, CmsSecurityPermission } from \"~/types\";\n\nconst grid = css({\n    \"&.mdc-layout-grid\": {\n        padding: 0,\n        backgroundColor: \"var(--mdc-theme-background)\",\n        \">.mdc-layout-grid__inner\": {\n            gridGap: 0\n        }\n    }\n});\n\nconst centeredContent = css({\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    \">.webiny-data-list\": {\n        display: \"flex\",\n        flexDirection: \"column\",\n        height: \"calc(100vh - 70px)\",\n        \".mdc-list\": {\n            overflow: \"auto\"\n        }\n    },\n    \">.mdc-list\": {\n        display: \"flex\",\n        flexDirection: \"column\",\n        maxHeight: \"calc(100vh - 70px)\",\n        overflow: \"auto\"\n    }\n});\n\nconst ContentModels: React.FC = () => {\n    const [newContentModelDialogOpened, openNewContentModelDialog] = React.useState(false);\n\n    const [cloneContentModel, setCloneContentModel] = React.useState<CmsModel | null>(null);\n\n    const { identity, getPermission } = useSecurity();\n\n    const canCreate = useMemo((): boolean => {\n        const permission = getPermission<CmsSecurityPermission>(\"cms.contentModel\");\n        if (!permission) {\n            return false;\n        }\n\n        if (typeof permission.rwd !== \"string\") {\n            return true;\n        }\n\n        return permission.rwd.includes(\"w\");\n    }, [identity]);\n\n    const closeModal = useCallback(() => {\n        setCloneContentModel(null);\n    }, []);\n\n    const onCreate = useCallback((): void => openNewContentModelDialog(true), []);\n    const onClose = useCallback((): void => openNewContentModelDialog(false), []);\n    const onClone = useCallback(\n        (contentModel: CmsModel): void => setCloneContentModel(contentModel),\n        []\n    );\n    const onCloneClose = useCallback((): void => setCloneContentModel(null), []);\n\n    return (\n        <>\n            <NewContentModelDialog open={newContentModelDialogOpened} onClose={onClose} />\n            {cloneContentModel && (\n                <CloneContentModelDialog\n                    contentModel={cloneContentModel}\n                    onClose={onCloneClose}\n                    closeModal={closeModal}\n                />\n            )}\n            <Grid className={grid}>\n                <Cell span={3} />\n                <Cell span={6} className={centeredContent}>\n                    <ContentModelsDataList\n                        canCreate={canCreate}\n                        onCreate={onCreate}\n                        onClone={onClone}\n                    />\n                </Cell>\n                <Cell span={3} />\n            </Grid>\n        </>\n    );\n};\n\nexport default ContentModels;\n"],"mappings":"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"}

package/admin/views/contentModels/ContentModelsDataList.d.ts

@@ -1,7 +1,9 @@
-/// <reference types="react" />
-declare type ContentModelsDataListProps = {
+import React from "react";
+import { CmsEditorContentModel } from "../../../types";
+interface ContentModelsDataListProps {
     canCreate: boolean;
     onCreate: () => void;
-};
-declare const ContentModelsDataList: ({ canCreate, onCreate }: ContentModelsDataListProps) => JSX.Element;
+    onClone: (contentModel: CmsEditorContentModel) => void;
+}
+declare const ContentModelsDataList: React.FC<ContentModelsDataListProps>;
 export default ContentModelsDataList;