slice-machine-ui 1.26.1-beta.11 → 1.26.1-beta.13

package/src/domain/__tests__/customType.test.ts

@@ -1,7 +1,6 @@
 import {
   CustomType,
   DynamicSection,
-  Group,
 } from "@prismicio/types-internal/lib/customtypes";
 import { describe, expect } from "vitest";
 
@@ -506,153 +505,6 @@ describe("CustomTypeModel test suite", () => {
     );
   });
 
-  it("addGroupField should return the given custom type with the group field added", () => {
-    expect(
-      CustomTypeModel.addGroupField({
-        customType: mockCustomType,
-        sectionId: "mainSection",
-        groupFieldId: "groupField",
-        newFieldId: "newFieldId",
-        newField: {
-          config: {
-            label: "NewField",
-          },
-          type: "Boolean",
-        },
-      }),
-    ).toEqual({
-      ...mockCustomType,
-      json: {
-        ...mockCustomType.json,
-        mainSection: {
-          ...mainSection,
-          groupField: {
-            ...mainSection.groupField,
-            config: {
-              ...mainSection.groupField.config,
-              fields: {
-                ...(mainSection.groupField as Group).config?.fields,
-                newFieldId: {
-                  config: {
-                    label: "NewField",
-                  },
-                  type: "Boolean",
-                },
-              },
-            },
-          },
-        },
-      },
-    });
-  });
-
-  it("deleteGroupField should return the given custom type without the group field", () => {
-    expect(
-      CustomTypeModel.deleteGroupField({
-        customType: mockCustomType,
-        sectionId: "mainSection",
-        groupFieldId: "groupField",
-        fieldId: "groupFieldBooleanField",
-      }),
-    ).toEqual({
-      ...mockCustomType,
-      json: {
-        ...mockCustomType.json,
-        mainSection: {
-          ...mainSection,
-          groupField: {
-            ...mainSection.groupField,
-            config: {
-              ...mainSection.groupField.config,
-              fields: {
-                groupFieldTextField: (mainSection.groupField as Group).config
-                  ?.fields?.groupFieldTextField,
-              },
-            },
-          },
-        },
-      },
-    });
-  });
-
-  it("updateGroupField should return the given custom type with the group field updated", () => {
-    expect(
-      CustomTypeModel.updateGroupField({
-        customType: mockCustomType,
-        sectionId: "mainSection",
-        groupFieldId: "groupField",
-        previousFieldId: "groupFieldBooleanField",
-        newFieldId: "newId",
-        newField: {
-          config: {
-            label: "newLabel",
-          },
-          type: "Boolean",
-        },
-      }),
-    ).toEqual({
-      ...mockCustomType,
-      json: {
-        ...mockCustomType.json,
-        mainSection: {
-          ...mainSection,
-          groupField: {
-            ...mainSection.groupField,
-            config: {
-              ...mainSection.groupField.config,
-              fields: {
-                newId: {
-                  config: {
-                    label: "newLabel",
-                  },
-                  type: "Boolean",
-                },
-                groupFieldTextField: (mainSection.groupField as Group).config
-                  ?.fields?.groupFieldTextField,
-              },
-            },
-          },
-        },
-      },
-    });
-  });
-
-  it("reorderGroupField should return the given custom type with the group field reordered", () => {
-    expect(
-      JSON.stringify(
-        CustomTypeModel.reorderGroupField({
-          customType: mockCustomType,
-          sectionId: "mainSection",
-          groupFieldId: "groupField",
-          sourceIndex: 0,
-          destinationIndex: 1,
-        }),
-      ),
-    ).toEqual(
-      JSON.stringify({
-        ...mockCustomType,
-        json: {
-          ...mockCustomType.json,
-          mainSection: {
-            ...mainSection,
-            groupField: {
-              ...mainSection.groupField,
-              config: {
-                ...mainSection.groupField.config,
-                fields: {
-                  groupFieldTextField: (mainSection.groupField as Group).config
-                    ?.fields?.groupFieldTextField,
-                  groupFieldBooleanField: (mainSection.groupField as Group)
-                    .config?.fields?.groupFieldBooleanField,
-                },
-              },
-            },
-          },
-        },
-      }),
-    );
-  });
-
   it("updateSection should return the given custom type with the section updated", () => {
     expect(
       CustomTypeModel.updateSection({
@@ -753,42 +605,6 @@ describe("CustomTypeModel test suite", () => {
     );
   });
 
-  it("getGroupField should return the group field matching the key", () => {
-    expect(
-      CustomTypeModel.getGroupField({
-        customType: mockCustomType,
-        sectionId: "mainSection",
-        groupFieldId: "groupField",
-      }),
-    ).toEqual(mainSection.groupField);
-  });
-
-  it("updateGroupFields should return the updated group fields", () => {
-    expect(
-      CustomTypeModel.updateGroupFields(mainSection.groupField as Group, {
-        groupFieldBooleanField: {
-          config: {
-            label: "GroupFieldBooleanField",
-          },
-          type: "Boolean",
-        },
-      }),
-    ).toEqual({
-      ...mainSection.groupField,
-      config: {
-        ...mainSection.groupField.config,
-        fields: {
-          groupFieldBooleanField: {
-            config: {
-              label: "GroupFieldBooleanField",
-            },
-            type: "Boolean",
-          },
-        },
-      },
-    });
-  });
-
   it("should create a custom type with repeatable true", () => {
     expect(
       CustomTypeModel.create({

package/src/domain/__tests__/group.test.ts

@@ -0,0 +1,161 @@
+import { describe, expect, it } from "vitest";
+
+import {
+  addFieldToGroup,
+  deleteFieldFromGroup,
+  reorderFieldInGroup,
+  updateFieldInGroup,
+} from "../group";
+
+describe("addFieldToGroup", () => {
+  it("adds a field to a group field", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group();
+    const res = addFieldToGroup({ group, field, fieldId: "field" });
+
+    expect(res.config?.fields?.field).toStrictEqual(field);
+  });
+
+  it("does not mutate the provided group field", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group();
+    const res = addFieldToGroup({ group, field, fieldId: "field" });
+
+    expect(res).not.toBe(group);
+  });
+});
+
+describe("updateFieldInGroup", () => {
+  it("updates an existing field in a group", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field } });
+
+    expect(group.config?.fields?.field).toStrictEqual(field);
+
+    const newField = structuredClone(field);
+    newField.config ??= {};
+    newField.config.placeholder_true = "Placeholder";
+
+    const res = updateFieldInGroup({
+      group,
+      field: newField,
+      previousFieldId: "field",
+      newFieldId: "field",
+    });
+
+    expect(res.config?.fields?.field).toStrictEqual(newField);
+  });
+
+  it("can rename an existing field in a group", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field } });
+
+    expect(group.config?.fields).toStrictEqual({ field });
+
+    const res = updateFieldInGroup({
+      group,
+      field,
+      previousFieldId: "field",
+      newFieldId: "newField",
+    });
+
+    expect(res.config?.fields).toStrictEqual({ newField: field });
+  });
+
+  it("does not make any changes if the field does not exist", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field } });
+
+    expect(group.config?.fields).toStrictEqual({ field });
+
+    const res = updateFieldInGroup({
+      group,
+      field: ctx.createMock.model.boolean(),
+      previousFieldId: "non-existent",
+      newFieldId: "non-existent",
+    });
+
+    expect(res).toStrictEqual(group);
+  });
+
+  it("does not mutate the provided group field", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field } });
+    const res = updateFieldInGroup({
+      group,
+      field,
+      previousFieldId: "field",
+      newFieldId: "field",
+    });
+
+    expect(res).not.toBe(group);
+  });
+});
+
+describe("reorderFieldInGroup", () => {
+  it("reorders a field in a group", (ctx) => {
+    const field1 = ctx.createMock.model.boolean();
+    const field2 = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field1, field2 } });
+
+    expect(Object.keys(group.config?.fields ?? {})).toStrictEqual([
+      "field1",
+      "field2",
+    ]);
+
+    const res = reorderFieldInGroup({
+      group,
+      sourceIndex: 1,
+      destinationIndex: 0,
+    });
+
+    expect(Object.keys(res.config?.fields ?? {})).toStrictEqual([
+      "field2",
+      "field1",
+    ]);
+  });
+
+  it("does not mutate the provided group field", (ctx) => {
+    const field1 = ctx.createMock.model.boolean();
+    const field2 = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field1, field2 } });
+    const res = reorderFieldInGroup({
+      group,
+      sourceIndex: 1,
+      destinationIndex: 0,
+    });
+
+    expect(res).not.toBe(group);
+  });
+});
+
+describe("deleteFieldFromGroup", () => {
+  it("deletes a field from a group", (ctx) => {
+    const field1 = ctx.createMock.model.boolean();
+    const field2 = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field1, field2 } });
+
+    const res = deleteFieldFromGroup({ group, fieldId: "field2" });
+
+    expect(res.config?.fields).toStrictEqual({ field1 });
+  });
+
+  it("does not make any changes if the field does not exist", (ctx) => {
+    const field = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field } });
+
+    const res = deleteFieldFromGroup({ group, fieldId: "non-existent" });
+
+    expect(res).toStrictEqual(group);
+  });
+
+  it("does not mutate the provided group field", (ctx) => {
+    const field1 = ctx.createMock.model.boolean();
+    const field2 = ctx.createMock.model.boolean();
+    const group = ctx.createMock.model.group({ fields: { field1, field2 } });
+
+    const res = deleteFieldFromGroup({ group, fieldId: "field2" });
+
+    expect(res).not.toBe(group);
+  });
+});

package/src/domain/__tests__/slice.test.ts

@@ -1,8 +1,9 @@
-import { ComponentUI } from "@lib/models/common/ComponentUI";
-import { Slices } from "@lib/models/common/Slice";
 import { SharedSlice } from "@prismicio/types-internal/lib/customtypes";
 import { describe, expect, it } from "vitest";
 
+import { ComponentUI } from "@/legacy/lib/models/common/ComponentUI";
+import { Slices } from "@/legacy/lib/models/common/Slice";
+
 import { deleteRepeatableZone } from "../slice";
 
 describe("deleteRepeatableZone", () => {

package/src/domain/customType.ts

@@ -5,7 +5,6 @@ import {
   DynamicSlices,
   DynamicSlicesConfig,
   Group,
-  GroupFieldType,
   NestableWidget,
   SlicesFieldType,
   UID,
@@ -46,38 +45,6 @@ type ReorderFieldArgs = {
   destinationIndex: number;
 };
 
-type AddGroupField = {
-  customType: CustomType;
-  sectionId: string;
-  groupFieldId: string;
-  newField: NestableWidget;
-  newFieldId: string;
-};
-
-type DeleteGroupField = {
-  customType: CustomType;
-  sectionId: string;
-  groupFieldId: string;
-  fieldId: string;
-};
-
-type UpdateGroupFieldArgs = {
-  customType: CustomType;
-  sectionId: string;
-  groupFieldId: string;
-  previousFieldId: string;
-  newFieldId: string;
-  newField: NestableWidget;
-};
-
-type ReorderGroupFieldArgs = {
-  customType: CustomType;
-  sectionId: string;
-  groupFieldId: string;
-  sourceIndex: number;
-  destinationIndex: number;
-};
-
 type UpdateSectionArgs = {
   customType: CustomType;
   sectionId: string;
@@ -97,12 +64,6 @@ type ReorderFieldsArgs<T> = {
   destinationIndex: number;
 };
 
-type GetGroupFieldArgs = {
-  customType: CustomType;
-  sectionId: string;
-  groupFieldId: string;
-};
-
 type CreateArgs = {
   format: CustomTypeFormat;
   id: string;
@@ -464,134 +425,6 @@ export function reorderField(args: ReorderFieldArgs): CustomType {
   return newCustomType;
 }
 
-export function addGroupField(args: AddGroupField): CustomType {
-  const { customType, sectionId, groupFieldId, newField, newFieldId } = args;
-  const groupField = getGroupField({
-    customType,
-    sectionId,
-    groupFieldId,
-  });
-  const groupFields = groupField?.config?.fields;
-
-  if (!groupField) {
-    return customType;
-  }
-
-  const newGroupField = updateGroupFields(groupField, {
-    ...groupFields,
-    // Add the new field to the group fields
-    [newFieldId]: newField,
-  });
-  const newCustomType = updateSection({
-    customType,
-    sectionId,
-    updatedSection: {
-      ...customType.json[sectionId],
-      [groupFieldId]: newGroupField,
-    },
-  });
-
-  return newCustomType;
-}
-
-export function deleteGroupField(args: DeleteGroupField): CustomType {
-  const { customType, sectionId, groupFieldId, fieldId } = args;
-  const groupField = getGroupField({
-    customType,
-    sectionId,
-    groupFieldId,
-  });
-  const groupFields = groupField?.config?.fields;
-
-  if (!groupField || !groupFields) {
-    return customType;
-  }
-
-  const updatedFields = removeKey(groupFields, fieldId);
-  const newGroupField = updateGroupFields(groupField, updatedFields);
-  const newCustomType = updateSection({
-    customType,
-    sectionId,
-    updatedSection: {
-      ...customType.json[sectionId],
-      [groupFieldId]: newGroupField,
-    },
-  });
-
-  return newCustomType;
-}
-
-export function updateGroupField(args: UpdateGroupFieldArgs): CustomType {
-  const {
-    customType,
-    sectionId,
-    groupFieldId,
-    previousFieldId,
-    newFieldId,
-    newField,
-  } = args;
-  const groupField = getGroupField({
-    customType,
-    sectionId,
-    groupFieldId,
-  });
-  const groupFields = groupField?.config?.fields;
-
-  if (!groupField || !groupFields) {
-    return customType;
-  }
-
-  const updatedGroupFields = updateFields({
-    fields: groupFields,
-    previousFieldId,
-    newFieldId,
-    newField,
-  });
-  const newGroupField = updateGroupFields(groupField, updatedGroupFields);
-  const newCustomType = updateSection({
-    customType,
-    sectionId,
-    updatedSection: {
-      ...customType.json[sectionId],
-      [groupFieldId]: newGroupField,
-    },
-  });
-
-  return newCustomType;
-}
-
-export function reorderGroupField(args: ReorderGroupFieldArgs): CustomType {
-  const { customType, sectionId, groupFieldId, sourceIndex, destinationIndex } =
-    args;
-  const groupField = getGroupField({
-    customType,
-    sectionId,
-    groupFieldId,
-  });
-  const groupFields = groupField?.config?.fields;
-
-  if (!groupField || !groupFields) {
-    return customType;
-  }
-
-  const updatedGroupFields = reorderFields({
-    fields: groupFields,
-    sourceIndex,
-    destinationIndex,
-  });
-  const newGroupField = updateGroupFields(groupField, updatedGroupFields);
-  const newCustomType = updateSection({
-    customType,
-    sectionId,
-    updatedSection: {
-      ...customType.json[sectionId],
-      [groupFieldId]: newGroupField,
-    },
-  });
-
-  return newCustomType;
-}
-
 export function updateSection(args: UpdateSectionArgs): CustomType {
   const { customType, sectionId, updatedSection } = args;
 
@@ -633,30 +466,6 @@ export function reorderFields<T>(args: ReorderFieldsArgs<T>) {
   return reorderedFields;
 }
 
-export function getGroupField(args: GetGroupFieldArgs): Group | undefined {
-  const { customType, sectionId, groupFieldId } = args;
-  const field = customType.json[sectionId][groupFieldId];
-
-  if (field.type === GroupFieldType) {
-    return field;
-  }
-
-  return undefined;
-}
-
-export function updateGroupFields(
-  field: Group,
-  updatedGroupFields: Record<string, NestableWidget>,
-): Group {
-  return {
-    ...field,
-    config: {
-      ...field.config,
-      fields: updatedGroupFields,
-    },
-  };
-}
-
 export function create(args: CreateArgs) {
   const { id, label, repeatable, format } = args;
   const mainTab = makeMainTab(repeatable, format);

package/src/domain/group.ts

@@ -0,0 +1,89 @@
+import {
+  Group,
+  NestableWidget,
+} from "@prismicio/types-internal/lib/customtypes";
+
+/**
+ * Adds a field to a group field.
+ *
+ * @returns A copy of `args.group` with the appended field.
+ */
+export function addFieldToGroup(args: {
+  group: Group;
+  fieldId: string;
+  field: NestableWidget;
+}): Group {
+  const newGroup = structuredClone(args.group);
+  newGroup.config ??= {};
+  newGroup.config.fields ??= {};
+  newGroup.config.fields[args.fieldId] = args.field;
+
+  return newGroup;
+}
+
+/**
+ * Updates a field in a group field.
+ *
+ * @returns A copy of `args.group` with the updated field.
+ */
+export function updateFieldInGroup(args: {
+  group: Group;
+  previousFieldId: string;
+  newFieldId: string;
+  field: NestableWidget;
+}): Group {
+  const newGroup = structuredClone(args.group);
+  if (!newGroup.config?.fields || !args.group.config?.fields) {
+    return newGroup;
+  }
+
+  newGroup.config.fields = {};
+  for (const fieldId in args.group.config.fields) {
+    if (fieldId === args.previousFieldId) {
+      newGroup.config.fields[args.newFieldId] = args.field;
+    } else {
+      newGroup.config.fields[fieldId] = args.group.config.fields[fieldId];
+    }
+  }
+
+  return newGroup;
+}
+
+/**
+ * Moves a field in a group field to a new position.
+ *
+ * @returns A copy of `args.group` with reordered fields.
+ */
+export function reorderFieldInGroup(args: {
+  group: Group;
+  sourceIndex: number;
+  destinationIndex: number;
+}): Group {
+  const newGroup = structuredClone(args.group);
+  if (!newGroup.config?.fields) {
+    return newGroup;
+  }
+
+  const entries = Object.entries(newGroup.config.fields);
+  const [removedEntry] = entries.splice(args.sourceIndex, 1);
+  entries.splice(args.destinationIndex, 0, removedEntry);
+
+  newGroup.config.fields = Object.fromEntries(entries);
+
+  return newGroup;
+}
+
+/**
+ * Deletes a field from a group field.
+ *
+ * @returns A copy of `args.group` without the field.
+ */
+export function deleteFieldFromGroup(args: {
+  group: Group;
+  fieldId: string;
+}): Group {
+  const newGroup = structuredClone(args.group);
+  delete newGroup.config?.fields?.[args.fieldId];
+
+  return newGroup;
+}