@webiny/app-headless-cms 0.0.0-unstable.78f581c1d2 → 0.0.0-unstable.7be00a75a9

package/admin/views/contentModelGroups/ContentModelGroupsForm.js

@@ -1,302 +1,206 @@
-"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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-
-var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
-
-var _get = _interopRequireDefault(require("lodash/get"));
-
-var _form = require("@webiny/form");
-
-var _Grid = require("@webiny/ui/Grid");
-
-var _Input = require("@webiny/ui/Input");
-
-var _Button = require("@webiny/ui/Button");
-
-var _Progress = require("@webiny/ui/Progress");
-
-var _i18n = require("@webiny/app/i18n");
-
-var _validation = require("@webiny/validation");
-
-var _SimpleForm = require("@webiny/app-admin/components/SimpleForm");
-
-var _IconPicker = _interopRequireDefault(require("./IconPicker"));
-
-var _reactRouter = require("@webiny/react-router");
-
-var _useSnackbar2 = require("@webiny/app-admin/hooks/useSnackbar");
-
-var _EmptyView = _interopRequireDefault(require("@webiny/app-admin/components/EmptyView"));
-
-var _add18px = require("@webiny/app-admin/assets/icons/add-18px.svg");
-
-var _hooks = require("../../hooks");
-
-var GQL = _interopRequireWildcard(require("./graphql"));
-
-var _usePermission2 = _interopRequireDefault(require("../../hooks/usePermission"));
-
-var _Tooltip = require("@webiny/ui/Tooltip");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-
-var t = _i18n.i18n.ns("app-headless-cms/admin/content-model-groups/form");
-
-var ButtonWrapper = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e7xbi20",
-  label: "ButtonWrapper"
-})({
-  display: "flex",
-  justifyContent: "space-between"
-});
-
-var ContentModelGroupsForm = function ContentModelGroupsForm(_ref) {
-  var canCreate = _ref.canCreate;
-
-  var _useRouter = (0, _reactRouter.useRouter)(),
-      location = _useRouter.location,
-      history = _useRouter.history;
-
-  var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
-      showSnackbar = _useSnackbar.showSnackbar;
-
-  var _usePermission = (0, _usePermission2.default)(),
-      canEdit = _usePermission.canEdit;
-
-  var newEntry = new URLSearchParams(location.search).get("new") === "true";
-  var id = new URLSearchParams(location.search).get("id");
-  var getQuery = (0, _hooks.useQuery)(GQL.GET_CONTENT_MODEL_GROUP, {
-    variables: {
-      id: id
-    },
-    skip: !id,
-    onCompleted: function onCompleted(data) {
-      if (!data) {
-        return;
-      }
-
-      var error = data.contentModelGroup.error;
-
-      if (error) {
-        history.push("/cms/content-model-group");
-        showSnackbar(error.message);
-      }
-    }
-  }); // Create a new group and update list cache
-
-  var _useMutation = (0, _hooks.useMutation)(GQL.CREATE_CONTENT_MODEL_GROUP, {
-    update: function update(cache, _ref2) {
-      var data = _ref2.data;
-
-      if (!data || data.contentModelGroup.error) {
-        return;
-      }
-
-      var gqlParams = {
-        query: GQL.LIST_CONTENT_MODEL_GROUPS
-      };
-      var result = cache.readQuery(gqlParams);
-
-      if (!result || !result.listContentModelGroups) {
-        return;
-      }
-
-      var listContentModelGroups = result.listContentModelGroups;
-      cache.writeQuery((0, _objectSpread2.default)((0, _objectSpread2.default)({}, gqlParams), {}, {
-        data: {
-          listContentModelGroups: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, listContentModelGroups), {}, {
-            data: [data.contentModelGroup.data].concat((0, _toConsumableArray2.default)(listContentModelGroups.data))
-          })
-        }
-      }));
-    }
-  }),
-      _useMutation2 = (0, _slicedToArray2.default)(_useMutation, 2),
-      create = _useMutation2[0],
-      createMutation = _useMutation2[1];
-
-  var _useMutation3 = (0, _hooks.useMutation)(GQL.UPDATE_CONTENT_MODEL_GROUP),
-      _useMutation4 = (0, _slicedToArray2.default)(_useMutation3, 2),
-      update = _useMutation4[0],
-      updateMutation = _useMutation4[1];
-
-  var loading = [getQuery, createMutation, updateMutation].find(function (item) {
-    return item.loading;
-  });
-  var createOperation = (0, _react.useCallback)(function (group) {
-    if (!group.id) {
-      return create({
+import react, { useCallback } from "react";
+import isEmpty from "lodash/isEmpty.js";
+import get from "lodash/get.js";
+import { Bind, Form, useForm, useGenerateSlug } from "@webiny/form";
+import { ReactComponent } from "@webiny/icons/devices_other.svg";
+import { i18n } from "@webiny/app/i18n/index.js";
+import { validation } from "@webiny/validation";
+import { EmptyView, SimpleForm, SimpleFormContent, SimpleFormFooter, SimpleFormHeader, useRoute, useRouter, useSnackbar } from "@webiny/app-admin";
+import { IconPicker } from "../../components/IconPicker.js";
+import { ReactComponent as add_18px_svg_ReactComponent } from "@webiny/app-admin/assets/icons/add-18px.svg";
+import { useMutation, usePermission, useQuery } from "../../hooks/index.js";
+import { Button, Grid, Input, OverlayLoader, Textarea, Tooltip } from "@webiny/admin-ui";
+import { Routes } from "../../../routes.js";
+import * as __rspack_external__graphql_js_d64db012 from "./graphql.js";
+const t = i18n.ns("app-headless-cms/admin/content-model-groups/form");
+const ContentModelGroupsForm = ({ canCreate })=>{
+    const { goToRoute } = useRouter();
+    const { route } = useRoute(Routes.ContentModelGroups.List);
+    const { showSnackbar } = useSnackbar();
+    const { canEdit } = usePermission();
+    const newEntry = true === route.params.new;
+    const id = route.params.id;
+    const getQuery = useQuery(__rspack_external__graphql_js_d64db012.GET_CONTENT_MODEL_GROUP, {
         variables: {
-          data: {
-            name: group.name,
-            description: group.description,
-            icon: group.icon
-          }
-        }
-      });
-    }
-
-    return update({
-      variables: {
-        id: group.id,
-        data: {
-          name: group.name,
-          description: group.description,
-          icon: group.icon
+            id: id
+        },
+        skip: !id,
+        onCompleted: (data)=>{
+            if (!data) return;
+            const { error } = data.contentModelGroup;
+            if (error) {
+                goToRoute(Routes.ContentModelGroups.List);
+                showSnackbar(error.message);
+            }
         }
-      }
     });
-  }, [create, update]);
-  var onSubmit = (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(group) {
-      var response, _response$data$conten, data, error;
-
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return createOperation(group);
-
-            case 2:
-              response = _context.sent;
-
-              if (response.data) {
-                _context.next = 6;
-                break;
-              }
-
-              showSnackbar("Missing response data ain Content Model Group Mutation Response.");
-              return _context.abrupt("return");
-
-            case 6:
-              _response$data$conten = response.data.contentModelGroup, data = _response$data$conten.data, error = _response$data$conten.error;
-
-              if (!error) {
-                _context.next = 10;
-                break;
-              }
-
-              showSnackbar(error.message);
-              return _context.abrupt("return");
-
-            case 10:
-              /**
-               * Redirect to a new group
-               */
-              if (!group.id) {
-                history.push("/cms/content-model-groups?id=".concat(data.id));
-              }
-
-              showSnackbar(t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Content model group saved successfully!"]))));
-
-            case 12:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-
-    return function (_x) {
-      return _ref3.apply(this, arguments);
-    };
-  }(), [id]);
-  var data = getQuery.loading ? null : (0, _get.default)(getQuery, "data.contentModelGroup.data", null);
-  var showEmptyView = !newEntry && !loading && (0, _isEmpty.default)(data); // Render "No content selected" view.
-
-  if (showEmptyView) {
-    return /*#__PURE__*/_react.default.createElement(_EmptyView.default, {
-      title: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Click on the left side list to display group details {message}"])))({
-        message: canCreate ? "or create a..." : ""
-      }),
-      action: canCreate ? /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
-        "data-testid": "new-record-button",
-        onClick: function onClick() {
-          return history.push("/cms/content-model-groups?new=true");
+    const [create, createMutation] = useMutation(__rspack_external__graphql_js_d64db012.CREATE_CONTENT_MODEL_GROUP, {
+        update (cache, { data }) {
+            if (!data || data.contentModelGroup.error) return;
+            const gqlParams = {
+                query: __rspack_external__graphql_js_d64db012.LIST_CONTENT_MODEL_GROUPS
+            };
+            const result = cache.readQuery(gqlParams);
+            if (!result || !result.listContentModelGroups) return;
+            const { listContentModelGroups } = result;
+            cache.writeQuery({
+                ...gqlParams,
+                data: {
+                    listContentModelGroups: {
+                        ...listContentModelGroups,
+                        data: [
+                            data.contentModelGroup.data,
+                            ...listContentModelGroups.data
+                        ]
+                    }
+                }
+            });
         }
-      }, /*#__PURE__*/_react.default.createElement(_Button.ButtonIcon, {
-        icon: /*#__PURE__*/_react.default.createElement(_add18px.ReactComponent, null)
-      }), " ", t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["New Group"])))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)
     });
-  }
-
-  return /*#__PURE__*/_react.default.createElement(_form.Form, {
-    onSubmit: onSubmit,
-    data: data || {
-      icon: "fas/star"
-    }
-  }, function (_ref4) {
-    var data = _ref4.data,
-        form = _ref4.form,
-        Bind = _ref4.Bind;
-    return /*#__PURE__*/_react.default.createElement(_SimpleForm.SimpleForm, {
-      "data-testid": "pb-content-model-groups-form"
-    }, /*#__PURE__*/_react.default.createElement(_SimpleForm.SimpleFormHeader, {
-      title: data.name ? data.name : t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["New content model group"])))
-    }), loading && /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, null), /*#__PURE__*/_react.default.createElement(_SimpleForm.SimpleFormContent, 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")
-    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
-      label: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Name"])))
-    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
-      span: 12
-    }, /*#__PURE__*/_react.default.createElement(Bind, {
-      name: "icon",
-      validators: _validation.validation.create("required")
-    }, /*#__PURE__*/_react.default.createElement(_IconPicker.default, {
-      label: t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Group icon"]))),
-      description: t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["Icon that will be displayed in the main menu."])))
-    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
-      span: 12
-    }, /*#__PURE__*/_react.default.createElement(Bind, {
-      name: "description"
-    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
-      rows: 5,
-      label: t(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["Description"])))
-    }))))), /*#__PURE__*/_react.default.createElement(_SimpleForm.SimpleFormFooter, null, /*#__PURE__*/_react.default.createElement(ButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
-      onClick: function onClick() {
-        return history.push("/cms/content-model-groups");
-      }
-    }, t(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["Cancel"])))), canEdit(data, "cms.contentModelGroup") && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !data.plugin ? /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
-      onClick: function onClick(ev) {
-        form.submit(ev);
-      }
-    }, t(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["Save content model group"])))) : /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
-      content: "Content model group is registered via a plugin.",
-      placement: "bottom"
-    }, /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
-      disabled: true
-    }, t(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["Save content model group"])))))))));
-  });
+    const [update, updateMutation] = useMutation(__rspack_external__graphql_js_d64db012.UPDATE_CONTENT_MODEL_GROUP);
+    const loading = [
+        getQuery,
+        createMutation,
+        updateMutation
+    ].find((item)=>item.loading);
+    const createOperation = useCallback((group)=>{
+        if (!group.id) return create({
+            refetchQueries: [
+                "CmsListMenuContentGroupsModels"
+            ],
+            variables: {
+                data: {
+                    name: group.name,
+                    slug: group.slug,
+                    description: group.description,
+                    icon: group.icon
+                }
+            }
+        });
+        return update({
+            refetchQueries: [
+                "CmsListMenuContentGroupsModels"
+            ],
+            variables: {
+                id: group.id,
+                data: {
+                    name: group.name,
+                    description: group.description,
+                    icon: group.icon
+                }
+            }
+        });
+    }, [
+        create,
+        update
+    ]);
+    const onSubmit = useCallback(async (group)=>{
+        const response = await createOperation(group);
+        if (!response.data) return void showSnackbar("Missing response data ain Content Model Group Mutation Response.");
+        const { data, error } = response.data.contentModelGroup;
+        if (error) return void showSnackbar(error.message);
+        if (!group.id) goToRoute(Routes.ContentModelGroups.List, {
+            id: data.id
+        });
+        showSnackbar(t`Content model group saved successfully!`);
+    }, [
+        id
+    ]);
+    const data = getQuery.loading ? null : get(getQuery, "data.contentModelGroup.data", null);
+    const showEmptyView = !newEntry && !loading && isEmpty(data);
+    if (showEmptyView) return /*#__PURE__*/ react.createElement(EmptyView, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        title: t`Click on the left side list to display group details {message}`({
+            message: canCreate ? "or create a..." : ""
+        }),
+        action: canCreate ? /*#__PURE__*/ react.createElement(Button, {
+            text: t`New Group`,
+            icon: /*#__PURE__*/ react.createElement(add_18px_svg_ReactComponent, null),
+            "data-testid": "new-record-button",
+            onClick: ()=>{
+                goToRoute(Routes.ContentModelGroups.List, {
+                    new: true
+                });
+            }
+        }) : /*#__PURE__*/ react.createElement(react.Fragment, null)
+    });
+    return /*#__PURE__*/ react.createElement(Form, {
+        onSubmit: onSubmit,
+        data: data || {
+            icon: "fas/star"
+        }
+    }, ({ data, form })=>/*#__PURE__*/ react.createElement(SimpleForm, {
+            "data-testid": "pb-content-model-groups-form"
+        }, /*#__PURE__*/ react.createElement(SimpleFormHeader, {
+            title: data.name ? data.name : t`New content model group`
+        }), loading && /*#__PURE__*/ react.createElement(OverlayLoader, null), /*#__PURE__*/ react.createElement(SimpleFormContent, null, /*#__PURE__*/ react.createElement(FormContent, {
+            newEntry: newEntry
+        })), /*#__PURE__*/ react.createElement(SimpleFormFooter, null, /*#__PURE__*/ react.createElement(Button, {
+            variant: "secondary",
+            text: t`Cancel`,
+            onClick: ()=>{
+                goToRoute(Routes.ContentModelGroups.List);
+            }
+        }), canEdit(data, "cms.contentModelGroup") && /*#__PURE__*/ react.createElement(react.Fragment, null, data.plugin ? /*#__PURE__*/ react.createElement(Tooltip, {
+            content: "Content model group is registered via a plugin.",
+            side: "bottom",
+            trigger: /*#__PURE__*/ react.createElement(Button, {
+                disabled: true,
+                variant: "primary",
+                text: t`Save`,
+                "data-testid": "cms.form.group.submit"
+            })
+        }) : /*#__PURE__*/ react.createElement(Button, {
+            variant: "primary",
+            text: t`Save`,
+            onClick: form.submit,
+            "data-testid": "cms.form.group.submit"
+        })))));
+};
+const FormContent = ({ newEntry })=>{
+    const form = useForm();
+    const { generateSlug } = useGenerateSlug(form, "name", "slug");
+    return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "name",
+        validators: validation.create("required,maxLength:100")
+    }, /*#__PURE__*/ react.createElement(Input, {
+        "data-testid": "cms.form.group.name",
+        label: t`Name`,
+        onBlur: generateSlug,
+        required: true
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "slug",
+        validators: [
+            validation.create("required,slug")
+        ]
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Slug",
+        required: true,
+        disabled: !newEntry
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "icon",
+        validators: validation.create("required")
+    }, /*#__PURE__*/ react.createElement(IconPicker, {
+        label: t`Group icon`,
+        description: t`Icon that will be displayed in the main menu.`
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "description",
+        defaultValue: ""
+    }, /*#__PURE__*/ react.createElement(Textarea, {
+        "data-testid": "cms.form.group.description",
+        rows: 5,
+        label: t`Description`
+    }))));
 };
+const contentModelGroups_ContentModelGroupsForm = ContentModelGroupsForm;
+export default contentModelGroups_ContentModelGroupsForm;
 
-var _default = ContentModelGroupsForm;
-exports.default = _default;
+//# sourceMappingURL=ContentModelGroupsForm.js.map

package/admin/views/contentModelGroups/ContentModelGroupsForm.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","ButtonWrapper","styled","display","justifyContent","ContentModelGroupsForm","canCreate","useRouter","location","history","useSnackbar","showSnackbar","usePermission","canEdit","newEntry","URLSearchParams","search","get","id","getQuery","useQuery","GQL","GET_CONTENT_MODEL_GROUP","variables","skip","onCompleted","data","error","contentModelGroup","push","message","useMutation","CREATE_CONTENT_MODEL_GROUP","update","cache","gqlParams","query","LIST_CONTENT_MODEL_GROUPS","result","readQuery","listContentModelGroups","writeQuery","create","createMutation","UPDATE_CONTENT_MODEL_GROUP","updateMutation","loading","find","item","createOperation","useCallback","group","name","description","icon","onSubmit","response","showEmptyView","isEmpty","form","Bind","validation","plugin","ev","submit"],"sources":["ContentModelGroupsForm.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport styled from \"@emotion/styled\";\nimport isEmpty from \"lodash/isEmpty\";\nimport get from \"lodash/get\";\nimport { Form, FormRenderPropParams } from \"@webiny/form\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { ButtonDefault, ButtonIcon, ButtonPrimary } from \"@webiny/ui/Button\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { validation } from \"@webiny/validation\";\n\nimport {\n    SimpleFormHeader,\n    SimpleForm,\n    SimpleFormFooter,\n    SimpleFormContent\n} from \"@webiny/app-admin/components/SimpleForm\";\nimport IconPicker from \"./IconPicker\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport EmptyView from \"@webiny/app-admin/components/EmptyView\";\nimport { ReactComponent as AddIcon } from \"@webiny/app-admin/assets/icons/add-18px.svg\";\nimport { useMutation, useQuery } from \"../../hooks\";\nimport * as GQL from \"./graphql\";\nimport usePermission from \"../../hooks/usePermission\";\nimport { Tooltip } from \"@webiny/ui/Tooltip\";\nimport {\n    CmsGroup,\n    CreateCmsGroupMutationResponse,\n    CreateCmsGroupMutationVariables,\n    GetCmsGroupQueryResponse,\n    GetCmsGroupQueryVariables,\n    ListCmsGroupsQueryResponse,\n    UpdateCmsGroupMutationResponse,\n    UpdateCmsGroupMutationVariables\n} from \"./graphql\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/content-model-groups/form\");\nconst ButtonWrapper = styled(\"div\")({\n    display: \"flex\",\n    justifyContent: \"space-between\"\n});\n\ninterface ContentModelGroupsFormProps {\n    canCreate: boolean;\n}\nconst ContentModelGroupsForm: React.FC<ContentModelGroupsFormProps> = ({ canCreate }) => {\n    const { location, history } = useRouter();\n    const { showSnackbar } = useSnackbar();\n    const { canEdit } = usePermission();\n\n    const newEntry = new URLSearchParams(location.search).get(\"new\") === \"true\";\n    const id = new URLSearchParams(location.search).get(\"id\");\n\n    const getQuery = useQuery<GetCmsGroupQueryResponse, GetCmsGroupQueryVariables>(\n        GQL.GET_CONTENT_MODEL_GROUP,\n        {\n            variables: {\n                id: id as string\n            },\n            skip: !id,\n            onCompleted: data => {\n                if (!data) {\n                    return;\n                }\n\n                const { error } = data.contentModelGroup;\n                if (error) {\n                    history.push(\"/cms/content-model-group\");\n                    showSnackbar(error.message);\n                }\n            }\n        }\n    );\n\n    // Create a new group and update list cache\n    const [create, createMutation] = useMutation<\n        CreateCmsGroupMutationResponse,\n        CreateCmsGroupMutationVariables\n    >(GQL.CREATE_CONTENT_MODEL_GROUP, {\n        update(cache, { data }) {\n            if (!data || data.contentModelGroup.error) {\n                return;\n            }\n\n            const gqlParams = {\n                query: GQL.LIST_CONTENT_MODEL_GROUPS\n            };\n            const result = cache.readQuery<ListCmsGroupsQueryResponse>(gqlParams);\n            if (!result || !result.listContentModelGroups) {\n                return;\n            }\n            const { listContentModelGroups } = result;\n            cache.writeQuery({\n                ...gqlParams,\n                data: {\n                    listContentModelGroups: {\n                        ...listContentModelGroups,\n                        data: [data.contentModelGroup.data, ...listContentModelGroups.data]\n                    }\n                }\n            });\n        }\n    });\n    const [update, updateMutation] = useMutation<\n        UpdateCmsGroupMutationResponse,\n        UpdateCmsGroupMutationVariables\n    >(GQL.UPDATE_CONTENT_MODEL_GROUP);\n\n    const loading = [getQuery, createMutation, updateMutation].find(item => item.loading);\n\n    const createOperation = useCallback(\n        (group: Partial<CmsGroup>) => {\n            if (!group.id) {\n                return create({\n                    variables: {\n                        data: {\n                            name: group.name,\n                            description: group.description,\n                            icon: group.icon\n                        }\n                    }\n                });\n            }\n            return update({\n                variables: {\n                    id: group.id,\n                    data: {\n                        name: group.name,\n                        description: group.description,\n                        icon: group.icon\n                    }\n                }\n            });\n        },\n        [create, update]\n    );\n\n    const onSubmit = useCallback(\n        async (group: Partial<CmsGroup>): Promise<void> => {\n            /**\n             * Create or update, depends if group object has id property\n             */\n            const response = await createOperation(group);\n            if (!response.data) {\n                showSnackbar(`Missing response data ain Content Model Group Mutation Response.`);\n                return;\n            }\n\n            const { data, error } = response.data.contentModelGroup;\n            if (error) {\n                showSnackbar(error.message);\n                return;\n            }\n            /**\n             * Redirect to a new group\n             */\n            if (!group.id) {\n                history.push(`/cms/content-model-groups?id=${data.id}`);\n            }\n            showSnackbar(t`Content model group saved successfully!`);\n        },\n        [id]\n    );\n\n    const data: CmsGroup | null = getQuery.loading\n        ? null\n        : get(getQuery, \"data.contentModelGroup.data\", null);\n\n    const showEmptyView = !newEntry && !loading && isEmpty(data);\n    // Render \"No content selected\" view.\n    if (showEmptyView) {\n        return (\n            <EmptyView\n                title={t`Click on the left side list to display group details {message}`({\n                    message: canCreate ? \"or create a...\" : \"\"\n                })}\n                action={\n                    canCreate ? (\n                        <ButtonDefault\n                            data-testid=\"new-record-button\"\n                            onClick={() => history.push(\"/cms/content-model-groups?new=true\")}\n                        >\n                            <ButtonIcon icon={<AddIcon />} /> {t`New Group`}\n                        </ButtonDefault>\n                    ) : (\n                        <></>\n                    )\n                }\n            />\n        );\n    }\n\n    return (\n        <Form onSubmit={onSubmit} data={data || { icon: \"fas/star\" }}>\n            {({ data, form, Bind }: FormRenderPropParams<CmsGroup>) => (\n                <SimpleForm data-testid={\"pb-content-model-groups-form\"}>\n                    <SimpleFormHeader title={data.name ? data.name : t`New content model group`} />\n                    {loading && <CircularProgress />}\n                    <SimpleFormContent>\n                        <Grid>\n                            <Cell span={12}>\n                                <Bind\n                                    name=\"name\"\n                                    validators={validation.create(\"required,maxLength:100\")}\n                                >\n                                    <Input label={t`Name`} />\n                                </Bind>\n                            </Cell>\n\n                            <Cell span={12}>\n                                <Bind name=\"icon\" validators={validation.create(\"required\")}>\n                                    <IconPicker\n                                        label={t`Group icon`}\n                                        description={t`Icon that will be displayed in the main menu.`}\n                                    />\n                                </Bind>\n                            </Cell>\n                            <Cell span={12}>\n                                <Bind name=\"description\">\n                                    <Input rows={5} label={t`Description`} />\n                                </Bind>\n                            </Cell>\n                        </Grid>\n                    </SimpleFormContent>\n                    <SimpleFormFooter>\n                        <ButtonWrapper>\n                            <ButtonDefault\n                                onClick={() => history.push(\"/cms/content-model-groups\")}\n                            >{t`Cancel`}</ButtonDefault>\n\n                            {canEdit(data, \"cms.contentModelGroup\") && (\n                                <React.Fragment>\n                                    {!data.plugin ? (\n                                        <ButtonPrimary\n                                            onClick={ev => {\n                                                form.submit(ev);\n                                            }}\n                                        >{t`Save content model group`}</ButtonPrimary>\n                                    ) : (\n                                        <Tooltip\n                                            content={\n                                                \"Content model group is registered via a plugin.\"\n                                            }\n                                            placement={\"bottom\"}\n                                        >\n                                            <ButtonPrimary\n                                                disabled\n                                            >{t`Save content model group`}</ButtonPrimary>\n                                        </Tooltip>\n                                    )}\n                                </React.Fragment>\n                            )}\n                        </ButtonWrapper>\n                    </SimpleFormFooter>\n                </SimpleForm>\n            )}\n        </Form>\n    );\n};\n\nexport default ContentModelGroupsForm;\n"],"mappings":"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"}
+{"version":3,"file":"admin/views/contentModelGroups/ContentModelGroupsForm.js","sources":["../../../../src/admin/views/contentModelGroups/ContentModelGroupsForm.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport isEmpty from \"lodash/isEmpty.js\";\nimport get from \"lodash/get.js\";\nimport { Bind, type FormRenderPropParams, useForm, useGenerateSlug } from \"@webiny/form\";\nimport { ReactComponent as DevicesIcon } from \"@webiny/icons/devices_other.svg\";\nimport { Form } from \"@webiny/form\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { validation } from \"@webiny/validation\";\n\nimport {\n    useRoute,\n    useRouter,\n    useSnackbar,\n    EmptyView,\n    SimpleFormHeader,\n    SimpleForm,\n    SimpleFormFooter,\n    SimpleFormContent\n} from \"@webiny/app-admin\";\nimport { IconPicker } from \"~/admin/components/IconPicker.js\";\nimport { ReactComponent as AddIcon } from \"@webiny/app-admin/assets/icons/add-18px.svg\";\nimport { useMutation, useQuery } from \"../../hooks/index.js\";\nimport * as GQL from \"./graphql.js\";\nimport { usePermission } from \"~/admin/hooks/index.js\";\nimport { Tooltip } from \"@webiny/admin-ui\";\nimport type {\n    CmsGroup,\n    CreateCmsGroupMutationResponse,\n    CreateCmsGroupMutationVariables,\n    GetCmsGroupQueryResponse,\n    GetCmsGroupQueryVariables,\n    ListCmsGroupsQueryResponse,\n    UpdateCmsGroupMutationResponse,\n    UpdateCmsGroupMutationVariables\n} from \"./graphql.js\";\nimport { Button, Grid, Input, OverlayLoader, Textarea } from \"@webiny/admin-ui\";\nimport { Routes } from \"~/routes.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/content-model-groups/form\");\n\ninterface ContentModelGroupsFormProps {\n    canCreate: boolean;\n}\nconst ContentModelGroupsForm = ({ canCreate }: ContentModelGroupsFormProps) => {\n    const { goToRoute } = useRouter();\n    const { route } = useRoute(Routes.ContentModelGroups.List);\n    const { showSnackbar } = useSnackbar();\n    const { canEdit } = usePermission();\n\n    const newEntry = route.params.new === true;\n    const id = route.params.id;\n\n    const getQuery = useQuery<GetCmsGroupQueryResponse, GetCmsGroupQueryVariables>(\n        GQL.GET_CONTENT_MODEL_GROUP,\n        {\n            variables: {\n                id: id as string\n            },\n            skip: !id,\n            onCompleted: data => {\n                if (!data) {\n                    return;\n                }\n\n                const { error } = data.contentModelGroup;\n                if (error) {\n                    goToRoute(Routes.ContentModelGroups.List);\n                    showSnackbar(error.message);\n                }\n            }\n        }\n    );\n\n    // Create a new group and update list cache\n    const [create, createMutation] = useMutation<\n        CreateCmsGroupMutationResponse,\n        CreateCmsGroupMutationVariables\n    >(GQL.CREATE_CONTENT_MODEL_GROUP, {\n        update(cache, { data }) {\n            if (!data || data.contentModelGroup.error) {\n                return;\n            }\n\n            const gqlParams = {\n                query: GQL.LIST_CONTENT_MODEL_GROUPS\n            };\n            const result = cache.readQuery<ListCmsGroupsQueryResponse>(gqlParams);\n            if (!result || !result.listContentModelGroups) {\n                return;\n            }\n            const { listContentModelGroups } = result;\n            cache.writeQuery({\n                ...gqlParams,\n                data: {\n                    listContentModelGroups: {\n                        ...listContentModelGroups,\n                        data: [data.contentModelGroup.data, ...listContentModelGroups.data]\n                    }\n                }\n            });\n        }\n    });\n    const [update, updateMutation] = useMutation<\n        UpdateCmsGroupMutationResponse,\n        UpdateCmsGroupMutationVariables\n    >(GQL.UPDATE_CONTENT_MODEL_GROUP);\n\n    const loading = [getQuery, createMutation, updateMutation].find(item => item.loading);\n\n    const createOperation = useCallback(\n        (group: Partial<CmsGroup>) => {\n            if (!group.id) {\n                return create({\n                    refetchQueries: [\"CmsListMenuContentGroupsModels\"],\n                    variables: {\n                        data: {\n                            name: group.name,\n                            slug: group.slug,\n                            description: group.description,\n                            icon: group.icon\n                        }\n                    }\n                });\n            }\n            return update({\n                refetchQueries: [\"CmsListMenuContentGroupsModels\"],\n                variables: {\n                    id: group.id,\n                    data: {\n                        name: group.name,\n                        description: group.description,\n                        icon: group.icon\n                    }\n                }\n            });\n        },\n        [create, update]\n    );\n\n    const onSubmit = useCallback(\n        async (group: Partial<CmsGroup>): Promise<void> => {\n            /**\n             * Create or update, depends if group object has id property\n             */\n            const response = await createOperation(group);\n            if (!response.data) {\n                showSnackbar(`Missing response data ain Content Model Group Mutation Response.`);\n                return;\n            }\n\n            const { data, error } = response.data.contentModelGroup;\n            if (error) {\n                showSnackbar(error.message);\n                return;\n            }\n            /**\n             * Redirect to a new group\n             */\n            if (!group.id) {\n                goToRoute(Routes.ContentModelGroups.List, { id: data.id });\n            }\n            showSnackbar(t`Content model group saved successfully!`);\n        },\n        [id]\n    );\n\n    const data: CmsGroup | null = getQuery.loading\n        ? null\n        : get(getQuery, \"data.contentModelGroup.data\", null);\n\n    const showEmptyView = !newEntry && !loading && isEmpty(data);\n    // Render \"No content selected\" view.\n    if (showEmptyView) {\n        return (\n            <EmptyView\n                icon={<DevicesIcon />}\n                title={t`Click on the left side list to display group details {message}`({\n                    message: canCreate ? \"or create a...\" : \"\"\n                })}\n                action={\n                    canCreate ? (\n                        <Button\n                            text={t`New Group`}\n                            icon={<AddIcon />}\n                            data-testid=\"new-record-button\"\n                            onClick={() => {\n                                goToRoute(Routes.ContentModelGroups.List, { new: true });\n                            }}\n                        />\n                    ) : (\n                        <></>\n                    )\n                }\n            />\n        );\n    }\n\n    return (\n        <Form onSubmit={onSubmit} data={data || { icon: \"fas/star\" }}>\n            {({ data, form }: FormRenderPropParams<CmsGroup>) => (\n                <SimpleForm data-testid={\"pb-content-model-groups-form\"}>\n                    <SimpleFormHeader title={data.name ? data.name : t`New content model group`} />\n                    {loading && <OverlayLoader />}\n                    <SimpleFormContent>\n                        <FormContent newEntry={newEntry} />\n                    </SimpleFormContent>\n                    <SimpleFormFooter>\n                        <Button\n                            variant={\"secondary\"}\n                            text={t`Cancel`}\n                            onClick={() => {\n                                goToRoute(Routes.ContentModelGroups.List);\n                            }}\n                        />\n\n                        {canEdit(data, \"cms.contentModelGroup\") && (\n                            <React.Fragment>\n                                {!data.plugin ? (\n                                    <Button\n                                        variant={\"primary\"}\n                                        text={t`Save`}\n                                        onClick={form.submit}\n                                        data-testid={\"cms.form.group.submit\"}\n                                    />\n                                ) : (\n                                    <Tooltip\n                                        content={\"Content model group is registered via a plugin.\"}\n                                        side={\"bottom\"}\n                                        trigger={\n                                            <Button\n                                                disabled\n                                                variant={\"primary\"}\n                                                text={t`Save`}\n                                                data-testid={\"cms.form.group.submit\"}\n                                            />\n                                        }\n                                    />\n                                )}\n                            </React.Fragment>\n                        )}\n                    </SimpleFormFooter>\n                </SimpleForm>\n            )}\n        </Form>\n    );\n};\n\ninterface FormContentProps {\n    newEntry: boolean;\n}\n\nconst FormContent = ({ newEntry }: FormContentProps) => {\n    const form = useForm();\n    const { generateSlug } = useGenerateSlug(form, \"name\", \"slug\");\n\n    return (\n        <Grid>\n            <Grid.Column span={12}>\n                <Bind name=\"name\" validators={validation.create(\"required,maxLength:100\")}>\n                    <Input\n                        data-testid={\"cms.form.group.name\"}\n                        label={t`Name`}\n                        onBlur={generateSlug}\n                        required\n                    />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Bind name={\"slug\"} validators={[validation.create(\"required,slug\")]}>\n                    <Input label={\"Slug\"} required disabled={!newEntry} />\n                </Bind>\n            </Grid.Column>\n\n            <Grid.Column span={12}>\n                <Bind name=\"icon\" validators={validation.create(\"required\")}>\n                    <IconPicker\n                        label={t`Group icon`}\n                        description={t`Icon that will be displayed in the main menu.`}\n                    />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Bind name=\"description\" defaultValue={\"\"}>\n                    <Textarea\n                        data-testid={\"cms.form.group.description\"}\n                        rows={5}\n                        label={t`Description`}\n                    />\n                </Bind>\n            </Grid.Column>\n        </Grid>\n    );\n};\n\nexport default ContentModelGroupsForm;\n"],"names":["t","i18n","ContentModelGroupsForm","canCreate","goToRoute","useRouter","route","useRoute","Routes","showSnackbar","useSnackbar","canEdit","usePermission","newEntry","id","getQuery","useQuery","GQL","data","error","create","createMutation","useMutation","cache","gqlParams","result","listContentModelGroups","update","updateMutation","loading","item","createOperation","useCallback","group","onSubmit","response","get","showEmptyView","isEmpty","EmptyView","DevicesIcon","Button","AddIcon","Form","form","SimpleForm","SimpleFormHeader","OverlayLoader","SimpleFormContent","FormContent","SimpleFormFooter","React","Tooltip","useForm","generateSlug","useGenerateSlug","Grid","Bind","validation","Input","IconPicker","Textarea"],"mappings":";;;;;;;;;;;;;;AAsCA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAKlB,MAAMC,yBAAyB,CAAC,EAAEC,SAAS,EAA+B;IACtE,MAAM,EAAEC,SAAS,EAAE,GAAGC;IACtB,MAAM,EAAEC,KAAK,EAAE,GAAGC,SAASC,OAAO,kBAAkB,CAAC,IAAI;IACzD,MAAM,EAAEC,YAAY,EAAE,GAAGC;IACzB,MAAM,EAAEC,OAAO,EAAE,GAAGC;IAEpB,MAAMC,WAAWP,AAAqB,SAArBA,MAAM,MAAM,CAAC,GAAG;IACjC,MAAMQ,KAAKR,MAAM,MAAM,CAAC,EAAE;IAE1B,MAAMS,WAAWC,SACbC,uCAAAA,uBAA2B,EAC3B;QACI,WAAW;YACP,IAAIH;QACR;QACA,MAAM,CAACA;QACP,aAAaI,CAAAA;YACT,IAAI,CAACA,MACD;YAGJ,MAAM,EAAEC,KAAK,EAAE,GAAGD,KAAK,iBAAiB;YACxC,IAAIC,OAAO;gBACPf,UAAUI,OAAO,kBAAkB,CAAC,IAAI;gBACxCC,aAAaU,MAAM,OAAO;YAC9B;QACJ;IACJ;IAIJ,MAAM,CAACC,QAAQC,eAAe,GAAGC,YAG/BL,uCAAAA,0BAA8B,EAAE;QAC9B,QAAOM,KAAK,EAAE,EAAEL,IAAI,EAAE;YAClB,IAAI,CAACA,QAAQA,KAAK,iBAAiB,CAAC,KAAK,EACrC;YAGJ,MAAMM,YAAY;gBACd,OAAOP,uCAAAA,yBAA6B;YACxC;YACA,MAAMQ,SAASF,MAAM,SAAS,CAA6BC;YAC3D,IAAI,CAACC,UAAU,CAACA,OAAO,sBAAsB,EACzC;YAEJ,MAAM,EAAEC,sBAAsB,EAAE,GAAGD;YACnCF,MAAM,UAAU,CAAC;gBACb,GAAGC,SAAS;gBACZ,MAAM;oBACF,wBAAwB;wBACpB,GAAGE,sBAAsB;wBACzB,MAAM;4BAACR,KAAK,iBAAiB,CAAC,IAAI;+BAAKQ,uBAAuB,IAAI;yBAAC;oBACvE;gBACJ;YACJ;QACJ;IACJ;IACA,MAAM,CAACC,QAAQC,eAAe,GAAGN,YAG/BL,uCAAAA,0BAA8B;IAEhC,MAAMY,UAAU;QAACd;QAAUM;QAAgBO;KAAe,CAAC,IAAI,CAACE,CAAAA,OAAQA,KAAK,OAAO;IAEpF,MAAMC,kBAAkBC,YACpB,CAACC;QACG,IAAI,CAACA,MAAM,EAAE,EACT,OAAOb,OAAO;YACV,gBAAgB;gBAAC;aAAiC;YAClD,WAAW;gBACP,MAAM;oBACF,MAAMa,MAAM,IAAI;oBAChB,MAAMA,MAAM,IAAI;oBAChB,aAAaA,MAAM,WAAW;oBAC9B,MAAMA,MAAM,IAAI;gBACpB;YACJ;QACJ;QAEJ,OAAON,OAAO;YACV,gBAAgB;gBAAC;aAAiC;YAClD,WAAW;gBACP,IAAIM,MAAM,EAAE;gBACZ,MAAM;oBACF,MAAMA,MAAM,IAAI;oBAChB,aAAaA,MAAM,WAAW;oBAC9B,MAAMA,MAAM,IAAI;gBACpB;YACJ;QACJ;IACJ,GACA;QAACb;QAAQO;KAAO;IAGpB,MAAMO,WAAWF,YACb,OAAOC;QAIH,MAAME,WAAW,MAAMJ,gBAAgBE;QACvC,IAAI,CAACE,SAAS,IAAI,EAAE,YAChB1B,aAAa;QAIjB,MAAM,EAAES,IAAI,EAAEC,KAAK,EAAE,GAAGgB,SAAS,IAAI,CAAC,iBAAiB;QACvD,IAAIhB,OAAO,YACPV,aAAaU,MAAM,OAAO;QAM9B,IAAI,CAACc,MAAM,EAAE,EACT7B,UAAUI,OAAO,kBAAkB,CAAC,IAAI,EAAE;YAAE,IAAIU,KAAK,EAAE;QAAC;QAE5DT,aAAaT,CAAC,CAAC,uCAAuC,CAAC;IAC3D,GACA;QAACc;KAAG;IAGR,MAAMI,OAAwBH,SAAS,OAAO,GACxC,OACAqB,IAAIrB,UAAU,+BAA+B;IAEnD,MAAMsB,gBAAgB,CAACxB,YAAY,CAACgB,WAAWS,QAAQpB;IAEvD,IAAImB,eACA,OAAO,WAAP,GACI,oBAACE,WAASA;QACN,oBAAM,oBAACC,gBAAWA;QAClB,OAAOxC,CAAC,CAAC,8DAA8D,CAAC,CAAC;YACrE,SAASG,YAAY,mBAAmB;QAC5C;QACA,QACIA,YAAY,WAAZA,GACI,oBAACsC,QAAMA;YACH,MAAMzC,CAAC,CAAC,SAAS,CAAC;YAClB,oBAAM,oBAAC0C,6BAAOA;YACd,eAAY;YACZ,SAAS;gBACLtC,UAAUI,OAAO,kBAAkB,CAAC,IAAI,EAAE;oBAAE,KAAK;gBAAK;YAC1D;2BAGJ;;IAOpB,OAAO,WAAP,GACI,oBAACmC,MAAIA;QAAC,UAAUT;QAAU,MAAMhB,QAAQ;YAAE,MAAM;QAAW;OACtD,CAAC,EAAEA,IAAI,EAAE0B,IAAI,EAAkC,iBAC5C,oBAACC,YAAUA;YAAC,eAAa;yBACrB,oBAACC,kBAAgBA;YAAC,OAAO5B,KAAK,IAAI,GAAGA,KAAK,IAAI,GAAGlB,CAAC,CAAC,uBAAuB,CAAC;YAC1E6B,WAAW,WAAXA,GAAW,oBAACkB,eAAaA,OAAAA,WAAAA,GAC1B,oBAACC,mBAAiBA,MAAAA,WAAAA,GACd,oBAACC,aAAWA;YAAC,UAAUpC;2BAE3B,oBAACqC,kBAAgBA,MAAAA,WAAAA,GACb,oBAACT,QAAMA;YACH,SAAS;YACT,MAAMzC,CAAC,CAAC,MAAM,CAAC;YACf,SAAS;gBACLI,UAAUI,OAAO,kBAAkB,CAAC,IAAI;YAC5C;YAGHG,QAAQO,MAAM,4BAA4B,WAA5B,GACX,oBAACiC,MAAAA,QAAc,QACV,AAACjC,KAAK,MAAM,G,cAQT,oBAACkC,SAAOA;YACJ,SAAS;YACT,MAAM;YACN,uBACI,oBAACX,QAAMA;gBACH;gBACA,SAAS;gBACT,MAAMzC,CAAC,CAAC,IAAI,CAAC;gBACb,eAAa;;aAhBb,WAAH,GACT,oBAACyC,QAAMA;YACH,SAAS;YACT,MAAMzC,CAAC,CAAC,IAAI,CAAC;YACb,SAAS4C,KAAK,MAAM;YACpB,eAAa;;AAuBrD;AAMA,MAAMK,cAAc,CAAC,EAAEpC,QAAQ,EAAoB;IAC/C,MAAM+B,OAAOS;IACb,MAAM,EAAEC,YAAY,EAAE,GAAGC,gBAAgBX,MAAM,QAAQ;IAEvD,OAAO,WAAP,GACI,oBAACY,MAAIA,MAAAA,WAAAA,GACD,oBAACA,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAK;QAAO,YAAYC,WAAW,MAAM,CAAC;qBAC5C,oBAACC,OAAKA;QACF,eAAa;QACb,OAAO3D,CAAC,CAAC,IAAI,CAAC;QACd,QAAQsD;QACR;wBAIZ,oBAACE,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAM;QAAQ,YAAY;YAACC,WAAW,MAAM,CAAC;SAAiB;qBAChE,oBAACC,OAAKA;QAAC,OAAO;QAAQ;QAAS,UAAU,CAAC9C;wBAIlD,oBAAC2C,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAK;QAAO,YAAYC,WAAW,MAAM,CAAC;qBAC5C,oBAACE,YAAUA;QACP,OAAO5D,CAAC,CAAC,UAAU,CAAC;QACpB,aAAaA,CAAC,CAAC,6CAA6C,CAAC;wBAIzE,oBAACwD,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAK;QAAc,cAAc;qBACnC,oBAACI,UAAQA;QACL,eAAa;QACb,MAAM;QACN,OAAO7D,CAAC,CAAC,WAAW,CAAC;;AAM7C;AAEA,kDAAeE"}

package/admin/views/contentModelGroups/graphql.d.ts

@@ -1,5 +1,5 @@
-import { CmsErrorResponse, CmsGroup as BaseCmsGroup, CmsModel } from "../../../types";
-export declare type CmsGroup = Omit<BaseCmsGroup, "contentModels">;
+import type { CmsErrorResponse, CmsGroup as BaseCmsGroup, CmsModel } from "../../../types.js";
+export type CmsGroup = Omit<BaseCmsGroup, "contentModels">;
 export interface CmsGroupWithModels extends CmsGroup {
     contentModels: Pick<CmsModel, "modelId" | "name">[];
 }