@webiny/app-headless-cms 0.0.0-unstable.eb196ccd2f → 0.0.0-unstable.eb81deee7e

package/admin/components/ContentModelEditor/ContentModelEditor.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","useEffect","makeDecoratable","Prompt","i18n","LeftPanel","RightPanel","SplitView","Heading","OverlayLoader","Separator","Tabs","Text","TimeAgo","ReactComponent","EditIcon","PreviewIcon","FieldsSidebar","FieldEditor","PreviewTab","Header","DragPreview","useModelEditor","ContentEntryEditorWithConfig","ContentEntryProvider","ContentEntriesProvider","ModelIsBeingDeletedError","t","ns","prompt","ContentModelEditor","data","setData","isPristine","contentModel","document","body","classList","add","remove","activeTab","setActiveTab","onChange","fields","layout","createElement","text","isBeingDeleted","model","className","when","message","span","as","onFieldDragStart","level","name","size","createdBy","displayName","datetime","savedOn","spacing","separator","value","String","onValueChange","tabs","Tab","key","trigger","icon","content","readonly"],"sources":["ContentModelEditor.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { Prompt } from \"@webiny/react-router\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Heading, OverlayLoader, Separator, Tabs, Text, TimeAgo } from \"@webiny/admin-ui\";\nimport { ReactComponent as EditIcon } from \"@webiny/icons/edit.svg\";\nimport { ReactComponent as PreviewIcon } from \"@webiny/icons/fullscreen.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar\";\nimport { FieldEditor } from \"../FieldEditor\";\nimport { PreviewTab } from \"./PreviewTab\";\nimport Header from \"./Header\";\nimport DragPreview from \"../DragPreview\";\nimport { useModelEditor } from \"./useModelEditor\";\nimport type { CmsEditorFieldsLayout, CmsModelField } from \"~/types\";\nimport { ContentEntryEditorWithConfig } from \"~/admin/config/contentEntries\";\nimport { ContentEntryProvider } from \"~/admin/views/contentEntries/ContentEntry/ContentEntryContext\";\nimport { ContentEntriesProvider } from \"~/admin/views/contentEntries/ContentEntriesContext\";\nimport { ModelIsBeingDeletedError } from \"~/admin/components/ContentModelEditor/ModelIsBeingDeletedError\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\ninterface OnChangeParams {\n    fields: CmsModelField[];\n    layout: CmsEditorFieldsLayout;\n}\n\nexport const ContentModelEditor = makeDecoratable(\"ContentModelEditor\", () => {\n    const { data, setData, isPristine, contentModel } = useModelEditor();\n\n    // Add a class to <body> to trigger global styles while this component is active\n    useEffect(() => {\n        document.body.classList.add(\"wby-overflow-hidden\");\n\n        return () => {\n            document.body.classList.remove(\"wby-overflow-hidden\");\n        };\n    }, []);\n\n    const [activeTab, setActiveTab] = useState<string>(\"edit\");\n\n    const onChange = ({ fields, layout }: OnChangeParams) => {\n        setData(data => ({ ...data, fields, layout }));\n    };\n\n    if (!data) {\n        return <OverlayLoader text={\"Loading content model...\"} />;\n    } else if (data.isBeingDeleted) {\n        return <ModelIsBeingDeletedError model={data} />;\n    }\n\n    return (\n        <div className={\"content-model-editor wby-flex-1\"}>\n            <Prompt when={!isPristine} message={prompt} />\n            <Header />\n            <div className={\"wby-w-full wby-overflow-y-auto wby-h-main-content\"}>\n                <SplitView>\n                    <LeftPanel span={4} className={\"wby-bg-neutral-light\"}>\n                        <div className={\"wby-px-lg wby-py-md\"}>\n                            <Text\n                                as={\"div\"}\n                                className={\n                                    \"wby-uppercase wby-font-semibold wby-text-neutral-xstrong\"\n                                }\n                            >\n                                {\"Fields\"}\n                            </Text>\n                        </div>\n                        <Separator />\n                        <div\n                            className={\n                                \"wby-px-lg wby-py-md wby-h-[calc(100vh-98px)] wby-overflow-y-scroll\"\n                            }\n                        >\n                            <FieldsSidebar\n                                onFieldDragStart={() => {\n                                    setActiveTab(\"edit\");\n                                }}\n                            />\n                        </div>\n                    </LeftPanel>\n                    <RightPanel span={8} className={\"wby-bg-neutral-base\"}>\n                        <div className={\"wby-h-full wby-overflow-y-scroll\"}>\n                            {contentModel && (\n                                <div className={\"wby-px-xl wby-pt-lg wby-pb-md-extra\"}>\n                                    <Heading level={4}>{contentModel.name}</Heading>\n                                    <Text size={\"sm\"} className={\"wby-text-neutral-muted\"}>\n                                        {`Created by ${contentModel.createdBy.displayName}. Last modified: `}\n                                        <TimeAgo datetime={contentModel.savedOn} />.\n                                    </Text>\n                                </div>\n                            )}\n                            <Tabs\n                                size={\"md\"}\n                                spacing={\"xl\"}\n                                separator={true}\n                                value={String(activeTab)}\n                                onValueChange={setActiveTab}\n                                tabs={[\n                                    <Tabs.Tab\n                                        key={\"edit\"}\n                                        value={\"edit\"}\n                                        trigger={\"Edit\"}\n                                        icon={<EditIcon />}\n                                        data-testid={\"cms.editor.tab.edit\"}\n                                        content={\n                                            <div className={\"wby-relative wby-mb-lg\"}>\n                                                <FieldEditor\n                                                    fields={data.fields}\n                                                    layout={data.layout || []}\n                                                    onChange={onChange}\n                                                />\n                                            </div>\n                                        }\n                                    />,\n                                    <Tabs.Tab\n                                        key={\"preview\"}\n                                        value={\"preview\"}\n                                        trigger={\"Preview\"}\n                                        icon={<PreviewIcon />}\n                                        data-testid={\"cms.editor.tab.preview\"}\n                                        content={\n                                            <ContentEntryEditorWithConfig>\n                                                <ContentEntriesProvider contentModel={data}>\n                                                    <ContentEntryProvider readonly={true}>\n                                                        <PreviewTab\n                                                            activeTab={activeTab === \"preview\"}\n                                                        />\n                                                    </ContentEntryProvider>\n                                                </ContentEntriesProvider>\n                                            </ContentEntryEditorWithConfig>\n                                        }\n                                    />\n                                ]}\n                            />\n                        </div>\n                    </RightPanel>\n                </SplitView>\n                <DragPreview />\n            </div>\n        </div>\n    );\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"admin/components/ContentModelEditor/ContentModelEditor.js","sources":["../../../../src/admin/components/ContentModelEditor/ContentModelEditor.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport { makeDecoratable, useDialogs } from \"@webiny/app-admin\";\nimport { useRouter } from \"@webiny/app\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { IconButton, OverlayLoader, SegmentedControlPrimitive, Tag, Text } from \"@webiny/admin-ui\";\nimport { ReactComponent as ExpandSidebarIcon } from \"@webiny/icons/left_panel_open.svg\";\nimport { ReactComponent as ViewCompactAltIcon } from \"@webiny/icons/view_compact_alt.svg\";\nimport { ReactComponent as ViewDayIcon } from \"@webiny/icons/view_day.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar.js\";\n\nconst VIEW_ITEMS = [\n    { id: \"compact\", value: \"compact\", label: \"\", icon: <ViewCompactAltIcon /> },\n    { id: \"full\", value: \"full\", label: \"\", icon: <ViewDayIcon /> }\n];\nimport { FieldEditor } from \"../FieldEditor/index.js\";\nimport { PreviewTab } from \"./PreviewTab.js\";\nimport Header from \"./Header.js\";\nimport DragPreview from \"../DragPreview.js\";\nimport { useModelEditor } from \"./useModelEditor.js\";\nimport type { CmsEditorFieldsLayout, CmsModelField } from \"~/types.js\";\nimport { ContentEntryEditorWithConfig } from \"~/admin/config/contentEntries/index.js\";\nimport { ModelIsBeingDeletedError } from \"~/admin/components/ContentModelEditor/ModelIsBeingDeletedError/index.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\ninterface OnChangeParams {\n    fields: CmsModelField[];\n    layout: CmsEditorFieldsLayout;\n}\n\nexport const ContentModelEditor = makeDecoratable(\"ContentModelEditor\", () => {\n    const { data, setData, isPristine } = useModelEditor();\n    const router = useRouter();\n    const dialogs = useDialogs();\n\n    // Add a class to <body> to trigger global styles while this component is active\n    useEffect(() => {\n        document.body.classList.add(\"overflow-hidden\");\n\n        return () => {\n            document.body.classList.remove(\"overflow-hidden\");\n        };\n    }, []);\n\n    const isPristineRef = React.useRef(isPristine);\n    isPristineRef.current = isPristine;\n\n    useEffect(() => {\n        return router.addTransitionGuard({\n            guard: () => !isPristineRef.current,\n            onBlocked: () => {\n                dialogs.showDialog({\n                    title: \"Confirm Navigation\",\n                    content: prompt,\n                    acceptLabel: \"Yes!\",\n                    cancelLabel: \"No, stay here.\",\n                    onAccept: () => router.confirmTransition(),\n                    onClose: () => router.cancelTransition()\n                });\n            }\n        });\n    }, []);\n\n    const [activeTab, setActiveTab] = useState<string>(\"edit\");\n    const [isSidebarOpen, setIsSidebarOpen] = useState(true);\n    const [activeView, setActiveView] = useState(\"compact\");\n\n    const onChange = ({ fields, layout }: OnChangeParams) => {\n        setData(data => ({ ...data, fields, layout }));\n    };\n\n    if (!data) {\n        return <OverlayLoader text={\"Loading content model...\"} />;\n    } else if (data.isBeingDeleted) {\n        return <ModelIsBeingDeletedError model={data} />;\n    }\n\n    return (\n        <div className={\"content-model-editor flex-1\"}>\n            <Header activeTab={activeTab} onTabChange={setActiveTab} />\n            <div className={\"w-full overflow-y-auto h-main-content\"}>\n                <div className={\"flex h-full\"}>\n                    <div\n                        className={\n                            \"shrink-0 bg-neutral-base border-r border-neutral-dimmed overflow-hidden h-main-content relative transition-[width] duration-200 ease-in-out\"\n                        }\n                        style={{ width: isSidebarOpen ? 200 : 45 }}\n                    >\n                        {/* Expanded content */}\n                        <div\n                            className={\n                                \"transition-opacity duration-150 \" +\n                                (isSidebarOpen\n                                    ? \"opacity-100 delay-75\"\n                                    : \"opacity-0 pointer-events-none\")\n                            }\n                        >\n                            <FieldsSidebar\n                                onFieldDragStart={() => setActiveTab(\"edit\")}\n                                onCollapse={() => setIsSidebarOpen(false)}\n                            />\n                        </div>\n                        {/* Collapsed strip */}\n                        <div\n                            className={\n                                \"absolute inset-0 flex flex-col items-center pt-md gap-md transition-opacity duration-150 \" +\n                                (!isSidebarOpen\n                                    ? \"opacity-100 delay-75\"\n                                    : \"opacity-0 pointer-events-none\")\n                            }\n                        >\n                            <IconButton\n                                variant={\"ghost\"}\n                                size={\"xs\"}\n                                icon={<ExpandSidebarIcon />}\n                                onClick={() => setIsSidebarOpen(true)}\n                            />\n                            <span\n                                className={\n                                    \"text-sm font-semibold text-neutral-strong [writing-mode:vertical-rl]\"\n                                }\n                            >\n                                Fields\n                            </span>\n                        </div>\n                    </div>\n                    <div\n                        className={\n                            \"flex-1 overflow-y-scroll h-main-content \" +\n                            (activeTab === \"edit\" ? \"fill-grid\" : \"bg-neutral-subtle\")\n                        }\n                    >\n                        <div\n                            className={\n                                \"sticky top-0 left-0 z-10 p-md flex items-center justify-between\"\n                            }\n                        >\n                            <div>\n                                {activeTab === \"edit\" && (\n                                    <Text\n                                        as=\"div\"\n                                        size={\"sm\"}\n                                        className={\"font-semibold text-neutral-primary\"}\n                                    >\n                                        Model editor\n                                    </Text>\n                                )}\n                                {activeTab === \"preview\" && (\n                                    <Tag content={\"Preview\"} variant={\"warning\"} />\n                                )}\n                            </div>\n                            <SegmentedControlPrimitive\n                                variant={\"light\"}\n                                value={activeView}\n                                onChange={setActiveView}\n                                items={VIEW_ITEMS}\n                            />\n                        </div>\n                        <div className={\"pb-lg\"}>\n                            <div\n                                className={\" transition-[width] duration-200 ease-in-out\"}\n                                style={{\n                                    width: activeView === \"compact\" ? \"704px\" : \"90%\",\n                                    marginLeft: \"auto\",\n                                    marginRight: \"auto\"\n                                }}\n                            >\n                                {activeTab === \"edit\" && (\n                                    <div className={\"relative\"} data-testid={\"cms.editor.tab.edit\"}>\n                                        <FieldEditor\n                                            fields={data.fields}\n                                            layout={data.layout || []}\n                                            onChange={onChange}\n                                        />\n                                    </div>\n                                )}\n                                {activeTab === \"preview\" && (\n                                    <div\n                                        className={\"px-xxl py-lg\"}\n                                        data-testid={\"cms.editor.tab.preview\"}\n                                    >\n                                        <ContentEntryEditorWithConfig>\n                                            <PreviewTab\n                                                activeTab={true}\n                                                onSwitchToEdit={() => setActiveTab(\"edit\")}\n                                            />\n                                        </ContentEntryEditorWithConfig>\n                                    </div>\n                                )}\n                            </div>\n                        </div>\n                    </div>\n                </div>\n                <DragPreview />\n            </div>\n        </div>\n    );\n});\n"],"names":["VIEW_ITEMS","ViewCompactAltIcon","ViewDayIcon","t","i18n","prompt","ContentModelEditor","makeDecoratable","data","setData","isPristine","useModelEditor","router","useRouter","dialogs","useDialogs","useEffect","document","isPristineRef","React","activeTab","setActiveTab","useState","isSidebarOpen","setIsSidebarOpen","activeView","setActiveView","onChange","fields","layout","OverlayLoader","ModelIsBeingDeletedError","Header","FieldsSidebar","IconButton","ExpandSidebarIcon","Text","Tag","SegmentedControlPrimitive","FieldEditor","ContentEntryEditorWithConfig","PreviewTab","DragPreview"],"mappings":"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"}

package/admin/components/ContentModelEditor/ContentModelEditorProvider.d.ts

@@ -1,18 +1,19 @@
 import React from "react";
-import type { ApolloClient } from "apollo-client";
-import type { GetCmsModelQueryResponse, UpdateCmsModelMutationResponse } from "../../graphql/contentModels";
-import type { CmsModel } from "../../../types";
-import type { FetchResult } from "apollo-link";
+import type { CmsModel } from "../../../types.js";
+import type { FieldOption } from "./fieldOptions.js";
 export interface ContentModelEditorProviderContext {
-    apolloClient: ApolloClient<any>;
     data: CmsModel;
     contentModel: CmsModel;
     isPristine: boolean;
-    getContentModel: (modelId: string) => Promise<FetchResult<GetCmsModelQueryResponse>>;
-    saveContentModel: (data?: CmsModel) => Promise<UpdateCmsModelMutationResponse["updateContentModel"]>;
+    getContentModel: (modelId: string) => Promise<void>;
+    saveContentModel: (data?: CmsModel) => Promise<{
+        data: CmsModel | null;
+        error: any | null;
+    }>;
     setData: (setter: (model: CmsModel) => void, saveContentModel?: boolean) => Promise<any>;
     activeTabIndex: number;
     setActiveTabIndex: (index: number) => void;
+    fieldOptions: FieldOption[];
 }
 export declare const contentModelEditorContext: React.Context<ContentModelEditorProviderContext | undefined>;
 interface State {
@@ -30,9 +31,8 @@ interface Reducer {
 }
 export declare const contentModelEditorReducer: Reducer;
 interface ContentModelEditorProviderProps {
-    apolloClient: ApolloClient<any>;
     modelId?: string;
     children: React.ReactElement;
 }
-export declare const ContentModelEditorProvider: ({ children, apolloClient, modelId }: ContentModelEditorProviderProps) => React.JSX.Element;
+export declare const ContentModelEditorProvider: ({ children, modelId }: ContentModelEditorProviderProps) => React.JSX.Element;
 export {};

package/admin/components/ContentModelEditor/ContentModelEditorProvider.js

@@ -1,200 +1,178 @@
-import React, { useCallback, useEffect, useMemo, useReducer } from "react";
-import get from "lodash/get";
-import pick from "lodash/pick";
-import { useRouter } from "@webiny/react-router";
-import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
-import { GET_CONTENT_MODEL, UPDATE_CONTENT_MODEL } from "../../graphql/contentModels";
-import { LIST_MENU_CONTENT_GROUPS_MODELS } from "../../viewsGraphql";
-import { ModelProvider } from "../ModelProvider";
-import { createHashing } from "@webiny/app/utils";
-export const contentModelEditorContext = /*#__PURE__*/React.createContext(undefined);
-export const contentModelEditorReducer = (prev, action) => {
-  const {
-    data,
-    type
-  } = action;
-  switch (type) {
-    case "state":
-      return {
-        ...prev,
-        ...data
-      };
-    case "data":
-      return {
-        ...prev,
-        data: data
-      };
-    default:
-      return prev;
-  }
+import react, { useCallback, useEffect, useMemo, useReducer } from "react";
+import pick from "lodash/pick.js";
+import { useRouter, useSnackbar } from "@webiny/app-admin";
+import { useContainer, useFeature } from "@webiny/app";
+import { ModelProvider } from "../ModelProvider/index.js";
+import { createHashing } from "@webiny/app/utils/index.js";
+import { Routes } from "../../../routes.js";
+import { buildFieldLabelPrefixes, buildFieldOptions } from "./fieldOptions.js";
+import { CmsLayoutFieldType } from "../../../presentation/fieldTypes/abstractions.js";
+import { GetModelFeature } from "../../../features/model/getModel/feature.js";
+import { UpdateModelFeature } from "../../../features/model/updateModel/feature.js";
+const contentModelEditorContext = /*#__PURE__*/ react.createContext(void 0);
+const contentModelEditorReducer = (prev, action)=>{
+    const { data, type } = action;
+    switch(type){
+        case "state":
+            return {
+                ...prev,
+                ...data
+            };
+        case "data":
+            return {
+                ...prev,
+                data: data
+            };
+        default:
+            return prev;
+    }
 };
 const hashModel = createHashing("SHA-256");
-
-/**
- * Cleanup is required because backend always expects string value in predefined values entries
- */
-const cleanupModelDataFields = fields => {
-  return fields.map(field => {
-    const {
-      predefinedValues
-    } = field;
-    const {
-      enabled = false,
-      values = []
-    } = predefinedValues || {};
-    return {
-      ...field,
-      predefinedValues: {
-        enabled,
-        values: values.map(({
-          label,
-          value,
-          selected
-        }) => {
-          return {
-            label,
-            selected: selected || false,
-            value: String(value)
-          };
-        })
-      }
-    };
-  });
-};
-const cleanupModelData = data => {
-  return {
-    ...data,
-    fields: cleanupModelDataFields(data.fields)
-  };
-};
-export const ContentModelEditorProvider = ({
-  children,
-  apolloClient,
-  modelId
-}) => {
-  const [state, dispatch] = useReducer(contentModelEditorReducer, {
-    modelId: modelId || null,
-    isPristine: true,
-    data: null,
-    activeTabIndex: 0
-  });
-  const {
-    history
-  } = useRouter();
-  const {
-    showSnackbar
-  } = useSnackbar();
-  const setPristine = flag => {
-    dispatch({
-      type: "state",
-      data: {
-        isPristine: flag
-      }
+const cleanupModelDataFields = (fields)=>fields.map((field)=>{
+        const { predefinedValues } = field;
+        const { enabled = false, values = [] } = predefinedValues || {};
+        return {
+            ...field,
+            predefinedValues: {
+                enabled,
+                values: values.map(({ label, value, selected })=>({
+                        label,
+                        selected: selected || false,
+                        value: String(value)
+                    }))
+            }
+        };
     });
-  };
-  const saveContentModel = async data => {
-    if (!data) {
-      data = state.data;
-    }
-    const modelData = pick(data, ["group", "layout", "fields", "tags", "name", "settings", "description", "titleFieldId", "descriptionFieldId", "imageFieldId", "icon"]);
-    const response = await apolloClient.mutate({
-      mutation: UPDATE_CONTENT_MODEL,
-      variables: {
-        modelId: data.modelId,
-        data: cleanupModelData(modelData)
-      },
-      refetchQueries: [{
-        query: LIST_MENU_CONTENT_GROUPS_MODELS
-      }]
+const cleanupModelData = (data)=>({
+        ...data,
+        fields: cleanupModelDataFields(data.fields)
     });
-    setPristine(true);
-    if (!response.data || !response.data.updateContentModel) {
-      return {
+const createDefaultState = (modelId)=>({
+        modelId: modelId || null,
+        isPristine: true,
         data: null,
-        error: null
-      };
-    }
-    return response.data.updateContentModel;
-  };
-  const setActiveTabIndex = useCallback(activeTabIndex => {
-    dispatch({
-      type: "state",
-      data: {
-        activeTabIndex
-      }
-    });
-  }, []);
-
-  /**
-   * Set form data by providing a callback, which receives a fresh copy of data on which you can work on.
-   * Return new data once finished.
-   */
-  const setData = async (setter, saveModel = false) => {
-    const data = setter(state.data);
-    const existingHash = await hashModel(state.data);
-    const newHash = await hashModel(data);
-    if (existingHash === newHash) {
-      return;
-    }
-    setPristine(false);
-    dispatch({
-      type: "data",
-      data
+        activeTabIndex: 0
     });
-    if (!saveModel) {
-      return;
-    }
-    await saveContentModel(data);
-  };
-  const getContentModel = async modelId => {
-    const response = await apolloClient.query({
-      query: GET_CONTENT_MODEL,
-      variables: {
+const ContentModelEditorProvider = ({ children, modelId })=>{
+    const { useCase: getModelUseCase } = useFeature(GetModelFeature);
+    const { useCase: updateModelUseCase } = useFeature(UpdateModelFeature);
+    const [state, dispatch] = useReducer(contentModelEditorReducer, createDefaultState(modelId));
+    const { goToRoute } = useRouter();
+    const { showSnackbar } = useSnackbar();
+    const setPristine = (flag)=>{
+        dispatch({
+            type: "state",
+            data: {
+                isPristine: flag
+            }
+        });
+    };
+    const saveContentModel = async (data)=>{
+        if (!data) data = state.data;
+        const modelData = pick(data, [
+            "group",
+            "layout",
+            "fields",
+            "tags",
+            "name",
+            "settings",
+            "description",
+            "titleFieldId",
+            "descriptionFieldId",
+            "imageFieldId",
+            "icon"
+        ]);
+        try {
+            const result = await updateModelUseCase.execute({
+                modelId: data.modelId,
+                data: cleanupModelData(modelData)
+            });
+            setPristine(true);
+            return {
+                data: result,
+                error: null
+            };
+        } catch (ex) {
+            return {
+                data: null,
+                error: {
+                    message: ex.message
+                }
+            };
+        }
+    };
+    const setActiveTabIndex = useCallback((activeTabIndex)=>{
+        dispatch({
+            type: "state",
+            data: {
+                activeTabIndex
+            }
+        });
+    }, []);
+    const setData = async (setter, saveModel = false)=>{
+        const data = setter(state.data);
+        const existingHash = await hashModel(state.data);
+        const newHash = await hashModel(data);
+        if (existingHash === newHash) return;
+        setPristine(false);
+        dispatch({
+            type: "data",
+            data
+        });
+        if (!saveModel) return;
+        await saveContentModel(data);
+    };
+    const getContentModel = async (id)=>{
+        const data = await getModelUseCase.execute({
+            modelId: id
+        });
+        data.settings = data.settings || {};
+        await setData(()=>data, false);
+        setPristine(true);
+    };
+    useEffect(()=>{
+        if (!modelId) return;
+        getContentModel(modelId).catch(()=>{
+            goToRoute(Routes.ContentModels.List);
+            showSnackbar("Could not load content model with given ID.");
+        });
+    }, [
         modelId
-      }
-    });
-    const {
-      data,
-      error
-    } = get(response, "data.getContentModel");
-    if (error) {
-      throw new Error(error.message);
-    }
-    await setData(() => data, false);
-    setPristine(true);
-    return response;
-  };
-  useEffect(() => {
-    if (!modelId) {
-      return;
-    }
-    getContentModel(modelId).catch(() => {
-      history.push(`/cms/content-models`);
-      showSnackbar(`Could not load content model with given ID.`);
-    });
-  }, [modelId]);
-  const value = useMemo(() => ({
-    // Keeping `data` for compatibility
-    data: state.data,
-    contentModel: state.data,
-    modelId,
-    apolloClient,
-    dispatch,
-    isPristine: state.isPristine,
-    getContentModel,
-    saveContentModel,
-    setData,
-    activeTabIndex: state.activeTabIndex,
-    setActiveTabIndex
-  }), [state, apolloClient]);
-  const {
-    Provider
-  } = contentModelEditorContext;
-  return /*#__PURE__*/React.createElement(Provider, {
-    value: value
-  }, /*#__PURE__*/React.createElement(ModelProvider, {
-    model: value.contentModel
-  }, children));
+    ]);
+    const container = useContainer();
+    const layoutFieldTypes = useMemo(()=>container.resolveAll(CmsLayoutFieldType), [
+        container
+    ]);
+    const fieldOptions = useMemo(()=>{
+        const model = state.data;
+        if (!model) return [];
+        const prefixes = model.layout ? buildFieldLabelPrefixes(model.layout, layoutFieldTypes) : void 0;
+        return buildFieldOptions(model.fields ?? [], "", "", prefixes, layoutFieldTypes);
+    }, [
+        state.data?.fields,
+        state.data?.layout
+    ]);
+    const value = useMemo(()=>({
+            data: state.data,
+            contentModel: state.data,
+            isPristine: state.isPristine,
+            getContentModel,
+            saveContentModel,
+            setData,
+            activeTabIndex: state.activeTabIndex,
+            setActiveTabIndex,
+            fieldOptions
+        }), [
+        state,
+        fieldOptions
+    ]);
+    const { Provider } = contentModelEditorContext;
+    return /*#__PURE__*/ react.createElement(Provider, {
+        value: value
+    }, /*#__PURE__*/ react.createElement(ModelProvider, {
+        model: value.contentModel
+    }, children));
 };
+export { ContentModelEditorProvider, contentModelEditorContext, contentModelEditorReducer };
 
 //# sourceMappingURL=ContentModelEditorProvider.js.map

package/admin/components/ContentModelEditor/ContentModelEditorProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useMemo","useReducer","get","pick","useRouter","useSnackbar","GET_CONTENT_MODEL","UPDATE_CONTENT_MODEL","LIST_MENU_CONTENT_GROUPS_MODELS","ModelProvider","createHashing","contentModelEditorContext","createContext","undefined","contentModelEditorReducer","prev","action","data","type","hashModel","cleanupModelDataFields","fields","map","field","predefinedValues","enabled","values","label","value","selected","String","cleanupModelData","ContentModelEditorProvider","children","apolloClient","modelId","state","dispatch","isPristine","activeTabIndex","history","showSnackbar","setPristine","flag","saveContentModel","modelData","response","mutate","mutation","variables","refetchQueries","query","updateContentModel","error","setActiveTabIndex","setData","setter","saveModel","existingHash","newHash","getContentModel","Error","message","catch","push","contentModel","Provider","createElement","model"],"sources":["ContentModelEditorProvider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useReducer } from \"react\";\nimport get from \"lodash/get\";\nimport pick from \"lodash/pick\";\nimport type { ApolloClient } from \"apollo-client\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport type {\n    GetCmsModelQueryResponse,\n    GetCmsModelQueryVariables,\n    UpdateCmsModelMutationResponse,\n    UpdateCmsModelMutationVariables\n} from \"~/admin/graphql/contentModels\";\nimport { GET_CONTENT_MODEL, UPDATE_CONTENT_MODEL } from \"~/admin/graphql/contentModels\";\nimport { LIST_MENU_CONTENT_GROUPS_MODELS } from \"~/admin/viewsGraphql\";\nimport type { CmsModel, CmsModelField } from \"~/types\";\nimport type { FetchResult } from \"apollo-link\";\nimport { ModelProvider } from \"~/admin/components/ModelProvider\";\nimport { createHashing } from \"@webiny/app/utils\";\n\nexport interface ContentModelEditorProviderContext {\n    apolloClient: ApolloClient<any>;\n    data: CmsModel;\n    contentModel: CmsModel;\n    isPristine: boolean;\n    getContentModel: (modelId: string) => Promise<FetchResult<GetCmsModelQueryResponse>>;\n    saveContentModel: (\n        data?: CmsModel\n    ) => Promise<UpdateCmsModelMutationResponse[\"updateContentModel\"]>;\n    setData: (setter: (model: CmsModel) => void, saveContentModel?: boolean) => Promise<any>;\n    activeTabIndex: number;\n    setActiveTabIndex: (index: number) => void;\n}\n\nexport const contentModelEditorContext = React.createContext<\n    ContentModelEditorProviderContext | undefined\n>(undefined);\n\ntype PickedCmsModel = Pick<\n    CmsModel,\n    \"layout\" | \"fields\" | \"name\" | \"settings\" | \"description\" | \"titleFieldId\" | \"group\"\n>;\ninterface State {\n    modelId: string | null;\n    isPristine: boolean;\n    data: CmsModel;\n    activeTabIndex: number;\n}\ninterface Action {\n    data: Partial<State> | Partial<CmsModel>;\n    type: \"state\" | \"data\";\n}\ninterface Reducer {\n    (prev: State, action: Action): State;\n}\nexport const contentModelEditorReducer: Reducer = (prev: State, action: Action): State => {\n    const { data, type } = action;\n    switch (type) {\n        case \"state\":\n            return { ...prev, ...data };\n\n        case \"data\":\n            return { ...prev, data: data as CmsModel };\n        default:\n            return prev;\n    }\n};\n\nconst hashModel = createHashing(\"SHA-256\");\n\n/**\n * Cleanup is required because backend always expects string value in predefined values entries\n */\nconst cleanupModelDataFields = (fields: CmsModelField[]): CmsModelField[] => {\n    return fields.map(field => {\n        const { predefinedValues } = field;\n        const { enabled = false, values = [] } = predefinedValues || {};\n        return {\n            ...field,\n            predefinedValues: {\n                enabled,\n                values: values.map(({ label, value, selected }) => {\n                    return {\n                        label,\n                        selected: selected || false,\n                        value: String(value)\n                    };\n                })\n            }\n        };\n    });\n};\n\nconst cleanupModelData = (data: PickedCmsModel): PickedCmsModel => {\n    return {\n        ...data,\n        fields: cleanupModelDataFields(data.fields)\n    };\n};\n\ninterface ContentModelEditorProviderProps {\n    apolloClient: ApolloClient<any>;\n    modelId?: string;\n    children: React.ReactElement;\n}\n\nexport const ContentModelEditorProvider = ({\n    children,\n    apolloClient,\n    modelId\n}: ContentModelEditorProviderProps) => {\n    const [state, dispatch] = useReducer<Reducer>(contentModelEditorReducer, {\n        modelId: modelId || null,\n        isPristine: true,\n        data: null as unknown as CmsModel,\n        activeTabIndex: 0\n    });\n\n    const { history } = useRouter();\n    const { showSnackbar } = useSnackbar();\n\n    const setPristine = (flag: boolean): void => {\n        dispatch({ type: \"state\", data: { isPristine: flag } });\n    };\n\n    const saveContentModel = async (\n        data?: CmsModel\n    ): Promise<UpdateCmsModelMutationResponse[\"updateContentModel\"]> => {\n        if (!data) {\n            data = state.data;\n        }\n        const modelData: PickedCmsModel = pick(data, [\n            \"group\",\n            \"layout\",\n            \"fields\",\n            \"tags\",\n            \"name\",\n            \"settings\",\n            \"description\",\n            \"titleFieldId\",\n            \"descriptionFieldId\",\n            \"imageFieldId\",\n            \"icon\"\n        ]);\n        const response = await apolloClient.mutate<\n            UpdateCmsModelMutationResponse,\n            UpdateCmsModelMutationVariables\n        >({\n            mutation: UPDATE_CONTENT_MODEL,\n            variables: {\n                modelId: data.modelId,\n                data: cleanupModelData(modelData)\n            },\n            refetchQueries: [\n                {\n                    query: LIST_MENU_CONTENT_GROUPS_MODELS\n                }\n            ]\n        });\n\n        setPristine(true);\n\n        if (!response.data || !response.data.updateContentModel) {\n            return {\n                data: null,\n                error: null\n            };\n        }\n\n        return response.data.updateContentModel;\n    };\n\n    const setActiveTabIndex = useCallback((activeTabIndex: number) => {\n        dispatch({ type: \"state\", data: { activeTabIndex } });\n    }, []);\n\n    /**\n     * Set form data by providing a callback, which receives a fresh copy of data on which you can work on.\n     * Return new data once finished.\n     */\n    const setData = async (setter: (value: any) => any, saveModel = false): Promise<void> => {\n        const data = setter(state.data);\n        const existingHash = await hashModel(state.data);\n        const newHash = await hashModel(data);\n        if (existingHash === newHash) {\n            return;\n        }\n        setPristine(false);\n        dispatch({ type: \"data\", data });\n        if (!saveModel) {\n            return;\n        }\n        await saveContentModel(data);\n    };\n\n    const getContentModel = async (\n        modelId: string\n    ): Promise<FetchResult<GetCmsModelQueryResponse>> => {\n        const response = await apolloClient.query<\n            GetCmsModelQueryResponse,\n            GetCmsModelQueryVariables\n        >({\n            query: GET_CONTENT_MODEL,\n            variables: {\n                modelId\n            }\n        });\n\n        const { data, error } = get(response, \"data.getContentModel\");\n        if (error) {\n            throw new Error(error.message);\n        }\n\n        await setData(() => data, false);\n\n        setPristine(true);\n        return response;\n    };\n\n    useEffect(() => {\n        if (!modelId) {\n            return;\n        }\n        getContentModel(modelId).catch(() => {\n            history.push(`/cms/content-models`);\n            showSnackbar(`Could not load content model with given ID.`);\n        });\n    }, [modelId]);\n\n    const value = useMemo<ContentModelEditorProviderContext>(\n        () => ({\n            // Keeping `data` for compatibility\n            data: state.data,\n            contentModel: state.data,\n            modelId,\n            apolloClient,\n            dispatch,\n            isPristine: state.isPristine,\n            getContentModel,\n            saveContentModel,\n            setData,\n            activeTabIndex: state.activeTabIndex,\n            setActiveTabIndex\n        }),\n        [state, apolloClient]\n    );\n\n    const { Provider } = contentModelEditorContext;\n\n    return (\n        <Provider value={value}>\n            <ModelProvider model={value.contentModel}>{children}</ModelProvider>\n        </Provider>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"admin/components/ContentModelEditor/ContentModelEditorProvider.js","sources":["../../../../src/admin/components/ContentModelEditor/ContentModelEditorProvider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useReducer } from \"react\";\nimport pick from \"lodash/pick.js\";\nimport { useSnackbar, useRouter } from \"@webiny/app-admin\";\nimport { useFeature } from \"@webiny/app\";\nimport type { CmsModel, CmsModelField } from \"~/types.js\";\nimport { useContainer } from \"@webiny/app\";\nimport { ModelProvider } from \"~/admin/components/ModelProvider/index.js\";\nimport { createHashing } from \"@webiny/app/utils/index.js\";\nimport { Routes } from \"~/routes.js\";\nimport type { FieldOption } from \"./fieldOptions.js\";\nimport { buildFieldOptions, buildFieldLabelPrefixes } from \"./fieldOptions.js\";\nimport { CmsLayoutFieldType } from \"~/presentation/fieldTypes/abstractions.js\";\nimport { GetModelFeature } from \"~/features/model/getModel/feature.js\";\nimport { UpdateModelFeature } from \"~/features/model/updateModel/feature.js\";\n\ntype PickedCmsModel = Pick<\n    CmsModel,\n    | \"layout\"\n    | \"fields\"\n    | \"name\"\n    | \"settings\"\n    | \"description\"\n    | \"titleFieldId\"\n    | \"descriptionFieldId\"\n    | \"imageFieldId\"\n    | \"group\"\n    | \"tags\"\n    | \"icon\"\n>;\n\nexport interface ContentModelEditorProviderContext {\n    data: CmsModel;\n    contentModel: CmsModel;\n    isPristine: boolean;\n    getContentModel: (modelId: string) => Promise<void>;\n    saveContentModel: (data?: CmsModel) => Promise<{ data: CmsModel | null; error: any | null }>;\n    setData: (setter: (model: CmsModel) => void, saveContentModel?: boolean) => Promise<any>;\n    activeTabIndex: number;\n    setActiveTabIndex: (index: number) => void;\n    fieldOptions: FieldOption[];\n}\n\nexport const contentModelEditorContext = React.createContext<\n    ContentModelEditorProviderContext | undefined\n>(undefined);\n\ninterface State {\n    modelId: string | null;\n    isPristine: boolean;\n    data: CmsModel;\n    activeTabIndex: number;\n}\ninterface Action {\n    data: Partial<State> | Partial<CmsModel>;\n    type: \"state\" | \"data\";\n}\ninterface Reducer {\n    (prev: State, action: Action): State;\n}\nexport const contentModelEditorReducer: Reducer = (prev: State, action: Action): State => {\n    const { data, type } = action;\n    switch (type) {\n        case \"state\":\n            return { ...prev, ...data };\n\n        case \"data\":\n            return { ...prev, data: data as CmsModel };\n        default:\n            return prev;\n    }\n};\n\nconst hashModel = createHashing(\"SHA-256\");\n\nconst cleanupModelDataFields = (fields: CmsModelField[]): CmsModelField[] => {\n    return fields.map(field => {\n        const { predefinedValues } = field;\n        const { enabled = false, values = [] } = predefinedValues || {};\n        return {\n            ...field,\n            predefinedValues: {\n                enabled,\n                values: values.map(({ label, value, selected }) => {\n                    return {\n                        label,\n                        selected: selected || false,\n                        value: String(value)\n                    };\n                })\n            }\n        };\n    });\n};\n\nconst cleanupModelData = (data: PickedCmsModel): PickedCmsModel => {\n    return {\n        ...data,\n        fields: cleanupModelDataFields(data.fields)\n    };\n};\n\ninterface ContentModelEditorProviderProps {\n    modelId?: string;\n    children: React.ReactElement;\n}\n\nconst createDefaultState = (modelId?: string): State => {\n    return {\n        modelId: modelId || null,\n        isPristine: true,\n        data: null as unknown as CmsModel,\n        activeTabIndex: 0\n    };\n};\n\nexport const ContentModelEditorProvider = ({\n    children,\n    modelId\n}: ContentModelEditorProviderProps) => {\n    const { useCase: getModelUseCase } = useFeature(GetModelFeature);\n    const { useCase: updateModelUseCase } = useFeature(UpdateModelFeature);\n\n    const [state, dispatch] = useReducer(contentModelEditorReducer, createDefaultState(modelId));\n\n    const { goToRoute } = useRouter();\n    const { showSnackbar } = useSnackbar();\n\n    const setPristine = (flag: boolean): void => {\n        dispatch({ type: \"state\", data: { isPristine: flag } });\n    };\n\n    const saveContentModel = async (\n        data?: CmsModel\n    ): Promise<{ data: CmsModel | null; error: any | null }> => {\n        if (!data) {\n            data = state.data;\n        }\n        const modelData: PickedCmsModel = pick(data, [\n            \"group\",\n            \"layout\",\n            \"fields\",\n            \"tags\",\n            \"name\",\n            \"settings\",\n            \"description\",\n            \"titleFieldId\",\n            \"descriptionFieldId\",\n            \"imageFieldId\",\n            \"icon\"\n        ]);\n\n        try {\n            const result = await updateModelUseCase.execute({\n                modelId: data.modelId,\n                data: cleanupModelData(modelData)\n            });\n\n            setPristine(true);\n\n            return {\n                data: result,\n                error: null\n            };\n        } catch (ex: any) {\n            return {\n                data: null,\n                error: { message: ex.message }\n            };\n        }\n    };\n\n    const setActiveTabIndex = useCallback((activeTabIndex: number) => {\n        dispatch({ type: \"state\", data: { activeTabIndex } });\n    }, []);\n\n    const setData = async (setter: (value: any) => any, saveModel = false): Promise<void> => {\n        const data = setter(state.data);\n        const existingHash = await hashModel(state.data);\n        const newHash = await hashModel(data);\n        if (existingHash === newHash) {\n            return;\n        }\n        setPristine(false);\n        dispatch({ type: \"data\", data });\n        if (!saveModel) {\n            return;\n        }\n        await saveContentModel(data);\n    };\n\n    const getContentModel = async (id: string): Promise<void> => {\n        const data = await getModelUseCase.execute({ modelId: id });\n        data.settings = data.settings || {};\n        await setData(() => data, false);\n        setPristine(true);\n    };\n\n    useEffect(() => {\n        if (!modelId) {\n            return;\n        }\n        getContentModel(modelId).catch(() => {\n            goToRoute(Routes.ContentModels.List);\n            showSnackbar(`Could not load content model with given ID.`);\n        });\n    }, [modelId]);\n\n    const container = useContainer();\n    const layoutFieldTypes = useMemo(() => {\n        return container.resolveAll(CmsLayoutFieldType);\n    }, [container]);\n\n    const fieldOptions = useMemo(() => {\n        const model = state.data;\n        if (!model) {\n            return [];\n        }\n        const prefixes = model.layout\n            ? buildFieldLabelPrefixes(model.layout, layoutFieldTypes)\n            : undefined;\n        return buildFieldOptions(model.fields ?? [], \"\", \"\", prefixes, layoutFieldTypes);\n    }, [state.data?.fields, state.data?.layout]);\n\n    const value = useMemo<ContentModelEditorProviderContext>(\n        () => ({\n            data: state.data,\n            contentModel: state.data,\n            isPristine: state.isPristine,\n            getContentModel,\n            saveContentModel,\n            setData,\n            activeTabIndex: state.activeTabIndex,\n            setActiveTabIndex,\n            fieldOptions\n        }),\n        [state, fieldOptions]\n    );\n\n    const { Provider } = contentModelEditorContext;\n\n    return (\n        <Provider value={value}>\n            <ModelProvider model={value.contentModel}>{children}</ModelProvider>\n        </Provider>\n    );\n};\n"],"names":["contentModelEditorContext","React","undefined","contentModelEditorReducer","prev","action","data","type","hashModel","createHashing","cleanupModelDataFields","fields","field","predefinedValues","enabled","values","label","value","selected","String","cleanupModelData","createDefaultState","modelId","ContentModelEditorProvider","children","getModelUseCase","useFeature","GetModelFeature","updateModelUseCase","UpdateModelFeature","state","dispatch","useReducer","goToRoute","useRouter","showSnackbar","useSnackbar","setPristine","flag","saveContentModel","modelData","pick","result","ex","setActiveTabIndex","useCallback","activeTabIndex","setData","setter","saveModel","existingHash","newHash","getContentModel","id","useEffect","Routes","container","useContainer","layoutFieldTypes","useMemo","CmsLayoutFieldType","fieldOptions","model","prefixes","buildFieldLabelPrefixes","buildFieldOptions","Provider","ModelProvider"],"mappings":"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"}

package/admin/components/ContentModelEditor/FieldsGrid.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface FieldsGridProps {
+    children: React.ReactNode;
+}
+declare const FieldsGrid: ({ children }: FieldsGridProps) => React.JSX.Element;
+export { FieldsGrid, type FieldsGridProps };

package/admin/components/ContentModelEditor/FieldsGrid.js

@@ -0,0 +1,7 @@
+import react from "react";
+const FieldsGrid = ({ children })=>/*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-xs-plus py-sm px-md"
+    }, children);
+export { FieldsGrid };
+
+//# sourceMappingURL=FieldsGrid.js.map

package/admin/components/ContentModelEditor/FieldsGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/components/ContentModelEditor/FieldsGrid.js","sources":["../../../../src/admin/components/ContentModelEditor/FieldsGrid.tsx"],"sourcesContent":["import React from \"react\";\n\ninterface FieldsGridProps {\n    children: React.ReactNode;\n}\n\nconst FieldsGrid = ({ children }: FieldsGridProps) => (\n    <div className={\"flex flex-wrap gap-xs-plus py-sm px-md\"}>{children}</div>\n);\n\nexport { FieldsGrid, type FieldsGridProps };\n"],"names":["FieldsGrid","children"],"mappings":";AAMA,MAAMA,aAAa,CAAC,EAAEC,QAAQ,EAAmB,iBAC7C,oBAAC;QAAI,WAAW;OAA2CA"}

package/admin/components/ContentModelEditor/FieldsSidebar.d.ts

@@ -2,6 +2,7 @@ import type { DragEventHandler } from "react";
 import React from "react";
 interface FieldsSidebarProps {
     onFieldDragStart: DragEventHandler;
+    onCollapse?: () => void;
 }
-export declare const FieldsSidebar: ({ onFieldDragStart }: FieldsSidebarProps) => React.JSX.Element;
+export declare const FieldsSidebar: ({ onFieldDragStart, onCollapse }: FieldsSidebarProps) => React.JSX.Element;
 export {};