wip: replace lodash with dot-prop

Author: brunozoric

packages/app-headless-cms-common/src/Fields/FieldElement.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import get from "lodash/get.js";
 import { makeDecoratable } from "@webiny/app-admin";
 import { i18n } from "@webiny/app/i18n/index.js";
 import Label from "./Label.js";
@@ -36,7 +35,7 @@ const RenderField = (props: RenderFieldProps) => {
         return <>{field.renderer({ field, getBind, Label, contentModel })}</>;
     }
 
-    const fieldRendererName = get(field, "renderer.name");
+    const fieldRendererName = field.renderer.name;
     if (!fieldRendererName) {
         return t`Cannot render "{fieldName}" field - field renderer not defined.`({
             fieldName: <strong>{field.fieldId}</strong>

packages/app-headless-cms/src/admin/components/ContentEntryForm/Header/RevisionSelector/RevisionSelector.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import get from "lodash/get.js";
 import { useRoute, useRouter } from "@webiny/app-admin";
 import { Button, DropdownMenu, Text } from "@webiny/admin-ui";
 import { ReactComponent as DownButton } from "@webiny/icons/keyboard_arrow_down.svg";
@@ -29,8 +28,8 @@ export const RevisionSelector = () => {
     const { entry, revisions, loading } = useContentEntry();
 
     const currentRevision = {
-        version: get(entry, "meta.version", 1) as number,
-        status: get(entry, "meta.status", "draft") as CmsContentEntryRevision["meta"]["status"]
+        version: entry?.meta?.version || 1,
+        status: entry?.meta?.status || "draft"
     };
 
     const allRevisions = revisions.length ? revisions : defaultRevisions;

packages/app-headless-cms/src/admin/components/ContentEntryForm/ParentValue.tsx

@@ -1,5 +1,5 @@
 import React, { createContext, useCallback, useContext, useEffect, useRef } from "react";
-import get from "lodash/get.js";
+import { immutableGet } from "@webiny/app/utils";
 import type { CmsModelField } from "@webiny/app-headless-cms-common/types/index.js";
 import { useModelField } from "~/admin/components/ModelFieldProvider/index.js";
 import type { FormAPI } from "@webiny/form";
@@ -66,7 +66,7 @@ export const ParentFieldProvider = ({ path, value, children }: ParentFieldProvid
             return;
         }
 
-        formRef.current.setValue(fieldPath, cb(get(formRef.current.data, fieldPath)));
+        formRef.current.setValue(fieldPath, cb(immutableGet(formRef.current.data, fieldPath)));
     }, []);
 
     const context: ParentField | undefined = field

packages/app-headless-cms/src/admin/components/ContentModelEditor/ContentModelEditorProvider.tsx

@@ -1,5 +1,4 @@
 import React, { useCallback, useEffect, useMemo, useReducer } from "react";
-import get from "lodash/get.js";
 import pick from "lodash/pick.js";
 import type { ApolloClient } from "apollo-client";
 import { useSnackbar, useRouter } from "@webiny/app-admin";
@@ -217,7 +216,7 @@ export const ContentModelEditorProvider = ({
             }
         });
 
-        const { data, error } = get(response, "data.getContentModel");
+        const { data, error } = response.data.getContentModel;
         if (error) {
             throw new Error(error.message);
         }

packages/app-headless-cms/src/admin/components/FieldEditor/EditFieldDialog/functions/getValue.ts

@@ -1,4 +1,4 @@
-import get from "lodash/get.js";
+import { immutableGet } from "@webiny/app/utils";
 import type { BindComponentRenderProp } from "@webiny/form";
 
 interface Params {
@@ -12,7 +12,7 @@ export const getValue = (params: Params): string[] | undefined => {
     const value = bind.value || [];
 
     if (index >= 0) {
-        return get(value, `${index}.${name}`);
+        return immutableGet(value, `${index}.${name}`);
     }
 
     return value;

packages/app-headless-cms/src/admin/components/FieldEditor/FieldEditor.tsx

@@ -1,5 +1,4 @@
 import React, { Fragment } from "react";
-import get from "lodash/get.js";
 import { i18n } from "@webiny/app/i18n/index.js";
 import { ReactComponent as DragIcon } from "@webiny/icons/drag_indicator.svg";
 import { Center, Horizontal, Vertical } from "../DropZone/index.js";
@@ -267,10 +266,8 @@ const Editor = () => {
                                                                                 item.type
                                                                             ) &&
                                                                             (row.length < 4 ||
-                                                                                get(
-                                                                                    item,
-                                                                                    "pos.row"
-                                                                                ) === index)
+                                                                                item.pos?.row ===
+                                                                                    index)
                                                                     )
                                                                 )}
                                                             />
@@ -300,10 +297,9 @@ const Editor = () => {
                                                                                     item.type
                                                                                 ) &&
                                                                                 (row.length < 4 ||
-                                                                                    get(
-                                                                                        item,
-                                                                                        "pos.row"
-                                                                                    ) === index)
+                                                                                    item.pos
+                                                                                        ?.row ===
+                                                                                        index)
                                                                             );
                                                                         })
                                                                     )}

packages/app-headless-cms/src/admin/menus/ContentGroupsMenuItems.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import get from "lodash/get.js";
 import type { ListMenuCmsGroupsQueryResponse } from "~/admin/viewsGraphql.js";
 import { LIST_MENU_CONTENT_GROUPS_MODELS } from "~/admin/viewsGraphql.js";
 import useQuery from "~/admin/hooks/useQuery.js";
@@ -10,7 +9,7 @@ import { GroupContentModels } from "./GroupContentModels.js";
 
 export const ContentGroupsMenuItems = () => {
     const response = useQuery<ListMenuCmsGroupsQueryResponse>(LIST_MENU_CONTENT_GROUPS_MODELS);
-    const groups: CmsGroup[] = get(response, "data.listContentModelGroups.data") || [];
+    const groups = response.data?.listContentModelGroups?.data || [];
 
     if (!groups || groups.length === 0) {
         return null;

packages/app-headless-cms/src/admin/plugins/editor/defaultBar/CreateContentButton.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import get from "lodash/get.js";
 import { useRouter } from "@webiny/app-admin";
 import { i18n } from "@webiny/app/i18n/index.js";
 import { ReactComponent as ListViewIcon } from "@webiny/icons/list.svg";
@@ -24,7 +23,7 @@ const CreateContentButton = () => {
             modelId: data.modelId
         }
     });
-    const fields = get(getQuery, "getContentModel.data.fields", []);
+    const fields = getQuery?.getContentModel?.data?.fields ?? [];
     const disableViewContent = fields.length === 0;
     const message = disableViewContent
         ? "To view the entries, you first need to add a field and save the form"

packages/app-headless-cms/src/admin/plugins/fieldRenderers/boolean/booleanSwitch.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import get from "lodash/get.js";
 import type { CmsModelFieldRendererPlugin } from "~/types.js";
 import { i18n } from "@webiny/app/i18n/index.js";
 import { Switch } from "@webiny/admin-ui";
@@ -15,9 +14,15 @@ const plugin: CmsModelFieldRendererPlugin = {
         name: t`Boolean Input`,
         description: t`Renders a simple switch button.`,
         canUse({ field }) {
-            return (
-                field.type === "boolean" && !field.list && !get(field, "predefinedValues.enabled")
-            );
+            if (field.type !== "boolean") {
+                return false;
+            } else if (!field.list) {
+                return false;
+            }
+            if (field.predefinedValues?.enabled) {
+                return false;
+            }
+            return true;
         },
         render({ getBind }) {
             const { field } = useModelField();

packages/app-headless-cms/src/admin/plugins/fieldRenderers/checkboxes.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import get from "lodash/get.js";
 import type { CmsModelField, CmsModelFieldRendererPlugin } from "~/types.js";
 import { i18n } from "@webiny/app/i18n/index.js";
 import { CheckboxGroup } from "@webiny/admin-ui";
@@ -19,7 +18,7 @@ const plugin: CmsModelFieldRendererPlugin = {
         name: t`Checkboxes`,
         description: t`Renders checkboxes, allowing selection of multiple values.`,
         canUse({ field }) {
-            return !!field.list && !!get(field, "predefinedValues.enabled");
+            return !!field.list && !!field.predefinedValues?.enabled;
         },
         render({ getBind }) {
             const { field } = useModelField();