@webiny/app-headless-cms 0.0.0-ee-vpcs.549378cf03

package/admin/components/FieldEditor/EditFieldDialog.js

@@ -0,0 +1,182 @@
+"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.default = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _Dialog = require("../Dialog");
+
+var _form = require("@webiny/form");
+
+var _Tabs = require("@webiny/ui/Tabs");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _plugins = require("@webiny/plugins");
+
+var _GeneralTab = _interopRequireDefault(require("./EditFieldDialog/GeneralTab"));
+
+var _AppearanceTab = _interopRequireDefault(require("./EditFieldDialog/AppearanceTab"));
+
+var _PredefinedValues = _interopRequireDefault(require("./EditFieldDialog/PredefinedValues"));
+
+var _ValidatorsList = require("./EditFieldDialog/ValidatorsList");
+
+var _Button = require("@webiny/ui/Button");
+
+var _hooks = require("../../hooks");
+
+var _ModelFieldProvider = require("../ModelFieldProvider");
+
+var _ValidationsSection = require("./EditFieldDialog/ValidationsSection");
+
+var _getValidators = require("./EditFieldDialog/getValidators");
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+
+var t = _i18n.i18n.namespace("app-headless-cms/admin/components/editor");
+
+var FullScreenDialog = /*#__PURE__*/(0, _styled.default)(_Dialog.Dialog, {
+  label: "FullScreenDialog",
+  target: "eoy63ui0"
+})("width:100vw;height:100vh;.mdc-dialog__surface{width:100%;max-width:100% !important;max-height:100% !important;.webiny-ui-dialog__content{max-width:100% !important;max-height:100% !important;width:100vw;height:calc(100vh - 155px);overflow:scroll !important;}}");
+
+function setupState(field, fieldPlugin, contentModel) {
+  var clonedField = (0, _cloneDeep.default)(field);
+
+  if (!clonedField.renderer || !clonedField.renderer.name) {
+    var _plugins$byType$filte = _plugins.plugins.byType("cms-editor-field-renderer").filter(function (item) {
+      return item.renderer.canUse({
+        field: field,
+        fieldPlugin: fieldPlugin
+      });
+    }),
+        _plugins$byType$filte2 = (0, _slicedToArray2.default)(_plugins$byType$filte, 1),
+        renderPlugin = _plugins$byType$filte2[0];
+
+    if (renderPlugin) {
+      clonedField.renderer = {
+        name: renderPlugin.renderer.rendererName
+      };
+    }
+  }
+
+  return {
+    shadowField: clonedField,
+    isTitleField: contentModel.titleFieldId === field.fieldId
+  };
+}
+
+var EditFieldDialog = function EditFieldDialog(props) {
+  var _useModelField = (0, _hooks.useModelField)(),
+      field = _useModelField.field,
+      fieldPlugin = _useModelField.fieldPlugin;
+
+  var _useModelEditor = (0, _hooks.useModelEditor)(),
+      contentModel = _useModelEditor.data,
+      setContentModelData = _useModelEditor.setData;
+
+  var _useState = (0, _react.useState)(setupState(field, fieldPlugin, contentModel)),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 1),
+      _useState2$ = _useState2[0],
+      shadowField = _useState2$.shadowField,
+      isTitleField = _useState2$.isTitleField;
+
+  var headerTitle = t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Field Settings - {fieldTypeLabel}"])))({
+    fieldTypeLabel: fieldPlugin.field.label
+  });
+
+  var onSubmit = function onSubmit(data, form) {
+    /**
+     * In case title field `fieldId` changed, we need to update the title field on the model itself.
+     */
+    if (isTitleField && contentModel.titleFieldId !== data.fieldId) {
+      setContentModelData(function (prev) {
+        return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, prev), {}, {
+          titleFieldId: data.fieldId
+        });
+      });
+    }
+
+    props.onSubmit(data, form);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(FullScreenDialog, {
+    preventOutsideDismiss: true,
+    open: true,
+    onClose: props.onClose,
+    "data-testid": "cms-editor-edit-fields-dialog"
+  }, /*#__PURE__*/_react.default.createElement(_Dialog.DialogTitle, null, headerTitle), /*#__PURE__*/_react.default.createElement(_form.Form, {
+    data: shadowField,
+    onSubmit: onSubmit
+  }, function (_ref) {
+    var shadowField = _ref.data,
+        submit = _ref.submit;
+    var individualValidation = (0, _getValidators.getFieldValidators)(shadowField, fieldPlugin);
+    var hasValidators = individualValidation.validators.length > 0;
+    var showValidatorsTab = shadowField.multipleValues || individualValidation.validators.length > 0;
+    var predefinedValuesTabEnabled = fieldPlugin.field.allowPredefinedValues && shadowField.predefinedValues && shadowField.predefinedValues.enabled;
+    var listValidation = (0, _getValidators.getListValidators)(shadowField, fieldPlugin);
+    return (
+      /*#__PURE__*/
+
+      /**
+       * We're using the `shadowField` as the new context, because we want all changes by form inputs
+       * to immediately be propagated to all dialog components.
+       */
+      _react.default.createElement(_ModelFieldProvider.ModelFieldProvider, {
+        field: shadowField
+      }, /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, null, /*#__PURE__*/_react.default.createElement(_Tabs.Tabs, null, /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
+        label: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["General"])))
+      }, /*#__PURE__*/_react.default.createElement(_GeneralTab.default, null)), /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
+        label: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Predefined Values"]))),
+        disabled: !predefinedValuesTabEnabled
+      }, predefinedValuesTabEnabled && /*#__PURE__*/_react.default.createElement(_PredefinedValues.default, null)), /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
+        visible: showValidatorsTab,
+        label: "Validators",
+        "data-testid": "cms.editor.field.tabs.validators"
+      }, shadowField.multipleValues ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ValidationsSection.ValidationsSection, {
+        validators: listValidation.validators,
+        fieldKey: "listValidators",
+        title: listValidation.title || "List validators",
+        description: listValidation.description || "These validators are applied to the entire list of values."
+      }), hasValidators ? /*#__PURE__*/_react.default.createElement(_ValidationsSection.ValidationsSection, {
+        fieldKey: "validators",
+        validators: individualValidation.validators,
+        title: individualValidation.title || "Individual value validators",
+        description: individualValidation.description || "These validators are applied to each value in the list."
+      }) : null) : null, !shadowField.multipleValues && hasValidators ? /*#__PURE__*/_react.default.createElement(_ValidatorsList.ValidatorsList, {
+        name: "validation",
+        validators: individualValidation.validators
+      }) : null), /*#__PURE__*/_react.default.createElement(_Tabs.Tab, {
+        label: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Appearance"])))
+      }, /*#__PURE__*/_react.default.createElement(_AppearanceTab.default, null)))), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
+        "data-testid": "cms.editor.field.settings.cancel",
+        onClick: props.onClose
+      }, t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Cancel"])))), /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
+        "data-testid": "cms.editor.field.settings.save",
+        onClick: submit
+      }, t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Save Field"]))))))
+    );
+  }));
+};
+
+var _default = EditFieldDialog;
+exports.default = _default;

package/admin/components/FieldEditor/EditFieldDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","namespace","FullScreenDialog","styled","Dialog","setupState","field","fieldPlugin","contentModel","clonedField","cloneDeep","renderer","name","plugins","byType","filter","item","canUse","renderPlugin","rendererName","shadowField","isTitleField","titleFieldId","fieldId","EditFieldDialog","props","useModelField","useModelEditor","data","setContentModelData","setData","useState","headerTitle","fieldTypeLabel","label","onSubmit","form","prev","onClose","submit","individualValidation","getFieldValidators","hasValidators","validators","length","showValidatorsTab","multipleValues","predefinedValuesTabEnabled","allowPredefinedValues","predefinedValues","enabled","listValidation","getListValidators","title","description"],"sources":["EditFieldDialog.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport styled from \"@emotion/styled\";\nimport { Dialog, DialogContent, DialogTitle, DialogActions } from \"~/admin/components/Dialog\";\nimport { Form, FormOnSubmit } from \"@webiny/form\";\nimport { Tabs, Tab } from \"@webiny/ui/Tabs\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport {\n    CmsEditorContentModel,\n    CmsModelField,\n    CmsEditorFieldRendererPlugin,\n    CmsEditorFieldTypePlugin\n} from \"~/types\";\nimport { plugins } from \"@webiny/plugins\";\nimport GeneralTab from \"./EditFieldDialog/GeneralTab\";\nimport AppearanceTab from \"./EditFieldDialog/AppearanceTab\";\nimport PredefinedValues from \"./EditFieldDialog/PredefinedValues\";\nimport { ValidatorsList } from \"./EditFieldDialog/ValidatorsList\";\nimport { ButtonDefault, ButtonPrimary } from \"@webiny/ui/Button\";\nimport { useModelField, useModelEditor } from \"~/admin/hooks\";\nimport { ModelFieldProvider } from \"~/admin/components/ModelFieldProvider\";\nimport { ValidationsSection } from \"~/admin/components/FieldEditor/EditFieldDialog/ValidationsSection\";\nimport { getFieldValidators, getListValidators } from \"./EditFieldDialog/getValidators\";\n\nconst t = i18n.namespace(\"app-headless-cms/admin/components/editor\");\n\nconst FullScreenDialog = styled(Dialog)`\n    width: 100vw;\n    height: 100vh;\n    .mdc-dialog__surface {\n        width: 100%;\n        max-width: 100% !important;\n        max-height: 100% !important;\n        .webiny-ui-dialog__content {\n            max-width: 100% !important;\n            max-height: 100% !important;\n            width: 100vw;\n            height: calc(100vh - 155px);\n            overflow: scroll !important;\n        }\n    }\n`;\n\nfunction setupState(\n    field: CmsModelField,\n    fieldPlugin: CmsEditorFieldTypePlugin,\n    contentModel: CmsEditorContentModel\n): EditFieldState {\n    const clonedField = cloneDeep(field);\n\n    if (!clonedField.renderer || !clonedField.renderer.name) {\n        const [renderPlugin] = plugins\n            .byType<CmsEditorFieldRendererPlugin>(\"cms-editor-field-renderer\")\n            .filter(item => item.renderer.canUse({ field, fieldPlugin }));\n\n        if (renderPlugin) {\n            clonedField.renderer = { name: renderPlugin.renderer.rendererName };\n        }\n    }\n\n    return {\n        shadowField: clonedField,\n        isTitleField: contentModel.titleFieldId === field.fieldId\n    };\n}\n\ninterface EditFieldState {\n    shadowField: CmsModelField;\n    isTitleField: boolean;\n}\n\ninterface EditFieldDialogProps {\n    onClose: () => void;\n    onSubmit: FormOnSubmit<CmsModelField>;\n}\n\nconst EditFieldDialog: React.FC<EditFieldDialogProps> = props => {\n    const { field, fieldPlugin } = useModelField();\n    const { data: contentModel, setData: setContentModelData } = useModelEditor();\n    const [{ shadowField, isTitleField }] = useState<EditFieldState>(\n        setupState(field, fieldPlugin, contentModel)\n    );\n\n    const headerTitle = t`Field Settings - {fieldTypeLabel}`({\n        fieldTypeLabel: fieldPlugin.field.label\n    });\n\n    const onSubmit: FormOnSubmit<CmsModelField> = (data, form) => {\n        /**\n         * In case title field `fieldId` changed, we need to update the title field on the model itself.\n         */\n        if (isTitleField && contentModel.titleFieldId !== data.fieldId) {\n            setContentModelData(prev => {\n                return {\n                    ...prev,\n                    titleFieldId: data.fieldId\n                };\n            });\n        }\n\n        props.onSubmit(data, form);\n    };\n\n    return (\n        <FullScreenDialog\n            preventOutsideDismiss\n            open={true}\n            onClose={props.onClose}\n            data-testid={\"cms-editor-edit-fields-dialog\"}\n        >\n            <DialogTitle>{headerTitle}</DialogTitle>\n            <Form<CmsModelField> data={shadowField} onSubmit={onSubmit}>\n                {({ data: shadowField, submit }) => {\n                    const individualValidation = getFieldValidators(shadowField, fieldPlugin);\n\n                    const hasValidators = individualValidation.validators.length > 0;\n\n                    const showValidatorsTab =\n                        shadowField.multipleValues || individualValidation.validators.length > 0;\n\n                    const predefinedValuesTabEnabled =\n                        fieldPlugin.field.allowPredefinedValues &&\n                        shadowField.predefinedValues &&\n                        shadowField.predefinedValues.enabled;\n\n                    const listValidation = getListValidators(shadowField, fieldPlugin);\n\n                    return (\n                        /**\n                         * We're using the `shadowField` as the new context, because we want all changes by form inputs\n                         * to immediately be propagated to all dialog components.\n                         */\n                        <ModelFieldProvider field={shadowField}>\n                            <DialogContent>\n                                <Tabs>\n                                    <Tab label={t`General`}>\n                                        <GeneralTab />\n                                    </Tab>\n                                    <Tab\n                                        label={t`Predefined Values`}\n                                        disabled={!predefinedValuesTabEnabled}\n                                    >\n                                        {predefinedValuesTabEnabled && <PredefinedValues />}\n                                    </Tab>\n\n                                    <Tab\n                                        visible={showValidatorsTab}\n                                        label={\"Validators\"}\n                                        data-testid={\"cms.editor.field.tabs.validators\"}\n                                    >\n                                        {shadowField.multipleValues ? (\n                                            <>\n                                                <ValidationsSection\n                                                    validators={listValidation.validators}\n                                                    fieldKey={\"listValidators\"}\n                                                    title={\n                                                        listValidation.title || \"List validators\"\n                                                    }\n                                                    description={\n                                                        listValidation.description ||\n                                                        \"These validators are applied to the entire list of values.\"\n                                                    }\n                                                />\n\n                                                {hasValidators ? (\n                                                    <ValidationsSection\n                                                        fieldKey={\"validators\"}\n                                                        validators={individualValidation.validators}\n                                                        title={\n                                                            individualValidation.title ||\n                                                            \"Individual value validators\"\n                                                        }\n                                                        description={\n                                                            individualValidation.description ||\n                                                            \"These validators are applied to each value in the list.\"\n                                                        }\n                                                    />\n                                                ) : null}\n                                            </>\n                                        ) : null}\n\n                                        {!shadowField.multipleValues && hasValidators ? (\n                                            <ValidatorsList\n                                                name={\"validation\"}\n                                                validators={individualValidation.validators}\n                                            />\n                                        ) : null}\n                                    </Tab>\n                                    <Tab label={t`Appearance`}>\n                                        <AppearanceTab />\n                                    </Tab>\n                                </Tabs>\n                            </DialogContent>\n                            <DialogActions>\n                                <ButtonDefault\n                                    data-testid=\"cms.editor.field.settings.cancel\"\n                                    onClick={props.onClose}\n                                >{t`Cancel`}</ButtonDefault>\n                                <ButtonPrimary\n                                    data-testid=\"cms.editor.field.settings.save\"\n                                    onClick={submit}\n                                >{t`Save Field`}</ButtonPrimary>\n                            </DialogActions>\n                        </ModelFieldProvider>\n                    );\n                }}\n            </Form>\n        </FullScreenDialog>\n    );\n};\n\nexport default EditFieldDialog;\n"],"mappings":"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"}

package/admin/components/FieldEditor/Field.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { CmsModelField } from "../../../types";
+export interface FieldProps {
+    field: CmsModelField;
+    onDelete: (field: CmsModelField) => void;
+    onEdit: (field: CmsModelField) => void;
+    parent?: CmsModelField;
+}
+declare const _default: React.NamedExoticComponent<FieldProps>;
+export default _default;

package/admin/components/FieldEditor/Field.js

@@ -0,0 +1,238 @@
+"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.default = void 0;
+
+var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _emotion = require("emotion");
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _Button = require("@webiny/ui/Button");
+
+var _Typography = require("@webiny/ui/Typography");
+
+var _edit = require("@material-design-icons/svg/outlined/edit.svg");
+
+var _delete = require("../../icons/delete.svg");
+
+var _title24px = require("../../icons/title-24px.svg");
+
+var _more_vert = require("../../icons/more_vert.svg");
+
+var _Menu = require("@webiny/ui/Menu");
+
+var _plugins = require("@webiny/plugins");
+
+var _List = require("@webiny/ui/List");
+
+var _Icon = require("@webiny/ui/Icon");
+
+var _i18n = require("@webiny/app/i18n");
+
+var _useSnackbar2 = require("@webiny/app-admin/hooks/useSnackbar");
+
+var _hooks = require("../../hooks");
+
+var _useModelFieldEditor2 = require("./useModelFieldEditor");
+
+var _appAdmin = require("@webiny/app-admin");
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+
+var t = _i18n.i18n.ns("app-headless-cms/admin/components/editor/field");
+
+var FieldContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "erv8xml0",
+  label: "FieldContainer"
+})({
+  display: "flex",
+  flexDirection: "row",
+  justifyContent: "space-between",
+  alignItems: "center"
+});
+var LowerCase = /*#__PURE__*/(0, _styled.default)("span", {
+  label: "LowerCase",
+  target: "erv8xml1"
+})("text-transform:lowercase;");
+var Info = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "erv8xml2",
+  label: "Info"
+})({
+  display: "flex",
+  flexDirection: "column",
+  "> *": {
+    flex: "1 100%",
+    lineHeight: "150%"
+  }
+});
+var Actions = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "erv8xml3",
+  label: "Actions"
+})({
+  display: "flex",
+  flexDirection: "row",
+  alignItems: "right",
+  "> *": {
+    flex: "1 100%"
+  }
+});
+var menuStyles = /*#__PURE__*/(0, _emotion.css)({
+  width: 220,
+  right: -105,
+  left: "auto !important",
+  ".disabled": {
+    opacity: 0.5,
+    pointerEvents: "none"
+  }
+}, "label:menuStyles;");
+var FieldExtra = /*#__PURE__*/(0, _styled.default)("div", {
+  label: "FieldExtra",
+  target: "erv8xml4"
+})("padding:10px 0 10px;:empty{display:none;}");
+var allowedTitleFieldTypes = ["text", "number"];
+
+var isFieldAllowedToBeTitle = function isFieldAllowedToBeTitle(field, parent) {
+  if (field.multipleValues || parent) {
+    return false;
+  } else if (allowedTitleFieldTypes.includes(field.type) === false) {
+    return false;
+  }
+
+  return true;
+};
+
+var Field = function Field(props) {
+  var field = props.field,
+      onEdit = props.onEdit,
+      parent = props.parent;
+
+  var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
+      showSnackbar = _useSnackbar.showSnackbar;
+
+  var _useModelEditor = (0, _hooks.useModelEditor)(),
+      setData = _useModelEditor.setData,
+      data = _useModelEditor.data;
+
+  var _useModelFieldEditor = (0, _useModelFieldEditor2.useModelFieldEditor)(),
+      getFieldPlugin = _useModelFieldEditor.getFieldPlugin,
+      getFieldRendererPlugin = _useModelFieldEditor.getFieldRendererPlugin;
+
+  var _useConfirmationDialo = (0, _appAdmin.useConfirmationDialog)({
+    title: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Warning - You are trying to delete a locked field!"]))),
+    message: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["You are about to delete a field which is used in the data storage"])))), /*#__PURE__*/_react.default.createElement("p", null, t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["All data in that field will be lost and there is no going back!"])))), /*#__PURE__*/_react.default.createElement("p", null, "\xA0"), /*#__PURE__*/_react.default.createElement("p", null, t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Are you sure you want to continue?"])))))
+  }),
+      showConfirmation = _useConfirmationDialo.showConfirmation;
+
+  var lockedFields = data ? data.lockedFields || [] : [];
+  var isLocked = lockedFields.some(function (lockedField) {
+    return lockedField.fieldId === field.storageId;
+  });
+  var onDelete = (0, _react.useCallback)(function () {
+    if (!isLocked) {
+      props.onDelete(field);
+      return;
+    }
+
+    showConfirmation(function () {
+      props.onDelete(field);
+    });
+  }, [field.fieldId, lockedFields]);
+  var setAsTitle = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
+    var response;
+    return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return setData(function (data) {
+              return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, data), {}, {
+                titleFieldId: field.fieldId
+              });
+            });
+
+          case 2:
+            response = _context.sent;
+
+            if (!(response && response.error)) {
+              _context.next = 5;
+              break;
+            }
+
+            return _context.abrupt("return", showSnackbar(response.error.message));
+
+          case 5:
+            showSnackbar(t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Title field set successfully."]))));
+
+          case 6:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  })), [field.fieldId, setData]);
+  var fieldPlugin = getFieldPlugin(field.type);
+
+  var editorFieldOptionPlugins = _plugins.plugins.byType("cms-editor-field-option");
+
+  if (!fieldPlugin) {
+    return null;
+  }
+
+  var rendererPlugin = getFieldRendererPlugin(field.renderer.name);
+  var canEdit = fieldPlugin.field.canEditSettings !== false;
+  var isTitleField = data && field.fieldId === data.titleFieldId && !parent;
+  var info = [rendererPlugin === null || rendererPlugin === void 0 ? void 0 : rendererPlugin.renderer.name, field.multipleValues ? "multiple values" : null, isTitleField ? "entry title" : null].filter(Boolean).join(", ");
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(FieldContainer, null, /*#__PURE__*/_react.default.createElement(Info, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+    use: "subtitle1"
+  }, field.label), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+    use: "caption"
+  }, fieldPlugin.field.label, " ", field.multipleValues && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(LowerCase, null, "(", info, ")"))), /*#__PURE__*/_react.default.createElement(Actions, null, canEdit ? /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
+    "data-testid": "cms.editor.edit-field",
+    icon: /*#__PURE__*/_react.default.createElement(_edit.ReactComponent, null),
+    onClick: function onClick() {
+      return onEdit(field);
+    }
+  }) : null, /*#__PURE__*/_react.default.createElement(_Menu.Menu, {
+    className: menuStyles,
+    handle: /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
+      icon: /*#__PURE__*/_react.default.createElement(_more_vert.ReactComponent, null)
+    })
+  }, editorFieldOptionPlugins.map(function (pl) {
+    return /*#__PURE__*/_react.default.cloneElement(pl.render(), {
+      key: pl.name
+    });
+  }), /*#__PURE__*/_react.default.createElement(_Menu.MenuItem, {
+    disabled: !isFieldAllowedToBeTitle(field, parent),
+    onClick: setAsTitle
+  }, /*#__PURE__*/_react.default.createElement(_List.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+    icon: /*#__PURE__*/_react.default.createElement(_title24px.ReactComponent, null)
+  })), t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Use as title"])))), /*#__PURE__*/_react.default.createElement(_Menu.MenuItem, {
+    onClick: onDelete
+  }, /*#__PURE__*/_react.default.createElement(_List.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+    icon: /*#__PURE__*/_react.default.createElement(_delete.ReactComponent, null)
+  })), t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["Delete"]))))))), /*#__PURE__*/_react.default.createElement(FieldExtra, null, fieldPlugin.field.render && fieldPlugin.field.render({
+    field: field,
+    data: data,
+    setData: setData
+  })));
+};
+
+var _default = /*#__PURE__*/_react.default.memo(Field);
+
+exports.default = _default;

package/admin/components/FieldEditor/Field.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","FieldContainer","styled","display","flexDirection","justifyContent","alignItems","LowerCase","Info","flex","lineHeight","Actions","menuStyles","css","width","right","left","opacity","pointerEvents","FieldExtra","allowedTitleFieldTypes","isFieldAllowedToBeTitle","field","parent","multipleValues","includes","type","Field","props","onEdit","useSnackbar","showSnackbar","useModelEditor","setData","data","useModelFieldEditor","getFieldPlugin","getFieldRendererPlugin","useConfirmationDialog","title","message","showConfirmation","lockedFields","isLocked","some","lockedField","fieldId","storageId","onDelete","useCallback","setAsTitle","titleFieldId","response","error","fieldPlugin","editorFieldOptionPlugins","plugins","byType","rendererPlugin","renderer","name","canEdit","canEditSettings","isTitleField","info","filter","Boolean","join","label","map","pl","React","cloneElement","render","key","memo"],"sources":["Field.tsx"],"sourcesContent":["import React, { Fragment, useCallback } from \"react\";\nimport { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { ReactComponent as EditIcon } from \"@material-design-icons/svg/outlined/edit.svg\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/delete.svg\";\nimport { ReactComponent as TitleIcon } from \"~/admin/icons/title-24px.svg\";\nimport { ReactComponent as MoreVerticalIcon } from \"~/admin/icons/more_vert.svg\";\nimport { Menu, MenuItem } from \"@webiny/ui/Menu\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CmsModelField, CmsEditorFieldOptionPlugin } from \"~/types\";\nimport { ListItemGraphic } from \"@webiny/ui/List\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { useModelEditor } from \"~/admin/hooks\";\nimport { useModelFieldEditor } from \"~/admin/components/FieldEditor/useModelFieldEditor\";\nimport { useConfirmationDialog } from \"@webiny/app-admin\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/editor/field\");\n\nconst FieldContainer = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"space-between\",\n    alignItems: \"center\"\n});\n\nconst LowerCase = styled.span`\n    text-transform: lowercase;\n`;\n\nconst Info = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"column\",\n    \"> *\": {\n        flex: \"1 100%\",\n        lineHeight: \"150%\"\n    }\n});\n\nconst Actions = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"right\",\n    \"> *\": {\n        flex: \"1 100%\"\n    }\n});\n\nconst menuStyles = css({\n    width: 220,\n    right: -105,\n    left: \"auto !important\",\n    \".disabled\": {\n        opacity: 0.5,\n        pointerEvents: \"none\"\n    }\n});\n\nconst FieldExtra = styled.div`\n    padding: 10px 0 10px;\n    :empty {\n        display: none;\n    }\n`;\n\nconst allowedTitleFieldTypes: string[] = [\"text\", \"number\"];\n\nconst isFieldAllowedToBeTitle = (field: CmsModelField, parent?: CmsModelField) => {\n    if (field.multipleValues || parent) {\n        return false;\n    } else if (allowedTitleFieldTypes.includes(field.type) === false) {\n        return false;\n    }\n    return true;\n};\n\nexport interface FieldProps {\n    field: CmsModelField;\n    onDelete: (field: CmsModelField) => void;\n    onEdit: (field: CmsModelField) => void;\n    parent?: CmsModelField;\n}\nconst Field: React.FC<FieldProps> = props => {\n    const { field, onEdit, parent } = props;\n    const { showSnackbar } = useSnackbar();\n    const { setData, data } = useModelEditor();\n    const { getFieldPlugin, getFieldRendererPlugin } = useModelFieldEditor();\n\n    const { showConfirmation } = useConfirmationDialog({\n        title: t`Warning - You are trying to delete a locked field!`,\n        message: (\n            <>\n                <p>{t`You are about to delete a field which is used in the data storage`}</p>\n                <p>{t`All data in that field will be lost and there is no going back!`}</p>\n                <p>&nbsp;</p>\n                <p>{t`Are you sure you want to continue?`}</p>\n            </>\n        )\n    });\n    const lockedFields = data ? data.lockedFields || [] : [];\n    const isLocked = lockedFields.some(lockedField => lockedField.fieldId === field.storageId);\n\n    const onDelete = useCallback(() => {\n        if (!isLocked) {\n            props.onDelete(field);\n            return;\n        }\n        showConfirmation(() => {\n            props.onDelete(field);\n        });\n    }, [field.fieldId, lockedFields]);\n\n    const setAsTitle = useCallback(async (): Promise<void> => {\n        const response = await setData(data => {\n            return { ...data, titleFieldId: field.fieldId };\n        });\n\n        if (response && response.error) {\n            return showSnackbar(response.error.message);\n        }\n\n        showSnackbar(t`Title field set successfully.`);\n    }, [field.fieldId, setData]);\n\n    const fieldPlugin = getFieldPlugin(field.type);\n    const editorFieldOptionPlugins =\n        plugins.byType<CmsEditorFieldOptionPlugin>(\"cms-editor-field-option\");\n\n    if (!fieldPlugin) {\n        return null;\n    }\n\n    const rendererPlugin = getFieldRendererPlugin(field.renderer.name);\n    const canEdit = fieldPlugin.field.canEditSettings !== false;\n    const isTitleField = data && field.fieldId === data.titleFieldId && !parent;\n\n    const info = [\n        rendererPlugin?.renderer.name,\n        field.multipleValues ? \"multiple values\" : null,\n        isTitleField ? \"entry title\" : null\n    ]\n        .filter(Boolean)\n        .join(\", \");\n\n    return (\n        <Fragment>\n            <FieldContainer>\n                <Info>\n                    <Typography use={\"subtitle1\"}>{field.label}</Typography>\n                    <Typography use={\"caption\"}>\n                        {fieldPlugin.field.label} {field.multipleValues && <></>}\n                        <LowerCase>({info})</LowerCase>\n                    </Typography>\n                </Info>\n                <Actions>\n                    {canEdit ? (\n                        <IconButton\n                            data-testid={\"cms.editor.edit-field\"}\n                            icon={<EditIcon />}\n                            onClick={() => onEdit(field)}\n                        />\n                    ) : null}\n                    <Menu\n                        className={menuStyles}\n                        handle={<IconButton icon={<MoreVerticalIcon />} />}\n                    >\n                        {editorFieldOptionPlugins.map(pl =>\n                            React.cloneElement(pl.render(), { key: pl.name })\n                        )}\n                        {/* We only allow this action for top-level fields. */}\n                        <MenuItem\n                            disabled={!isFieldAllowedToBeTitle(field, parent)}\n                            onClick={setAsTitle}\n                        >\n                            <ListItemGraphic>\n                                <Icon icon={<TitleIcon />} />\n                            </ListItemGraphic>\n                            {t`Use as title`}\n                        </MenuItem>\n                        <MenuItem onClick={onDelete}>\n                            <ListItemGraphic>\n                                <Icon icon={<DeleteIcon />} />\n                            </ListItemGraphic>\n                            {t`Delete`}\n                        </MenuItem>\n                    </Menu>\n                </Actions>\n            </FieldContainer>\n            <FieldExtra>\n                {fieldPlugin.field.render && fieldPlugin.field.render({ field, data, setData })}\n            </FieldExtra>\n        </Fragment>\n    );\n};\n\nexport default React.memo(Field);\n"],"mappings":"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"}

package/admin/components/FieldEditor/FieldEditor.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { CmsModelField, CmsEditorFieldsLayout } from "../../../types";
+export interface FieldEditorProps {
+    parent?: CmsModelField;
+    layout: CmsEditorFieldsLayout;
+    fields: CmsModelField[];
+    onChange: (params: {
+        fields: CmsModelField[];
+        layout: CmsEditorFieldsLayout;
+    }) => void;
+}
+export declare const FieldEditor: React.FC<FieldEditorProps>;