Skip to content

Commit d6b9d01

Browse files
authored
Merge pull request #494 from contentstack/VE-7062-disable-entry-edit-workflow-stage
feat(VB-132 | VE-7062): disable editing when workflow stage rules restrict the same
2 parents 92d2bcc + 729ac76 commit d6b9d01

21 files changed

Lines changed: 965 additions & 328 deletions

src/visualBuilder/__test__/click/fields/multi-line.test.tsx

Lines changed: 49 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ import { VisualBuilderPostMessageEvents } from "../../../utils/types/postMessage
1111
import { VisualBuilder } from "../../../index";
1212
import { triggerAndWaitForClickAction } from "../../../../__test__/utils";
1313

14+
const EXAMPLE_STAGE_NAME = "Example Stage";
15+
1416
vi.mock("../../../components/FieldToolbar", () => {
1517
return {
1618
default: () => {
@@ -94,23 +96,28 @@ describe("When an element is clicked in visual builder mode", () => {
9496
beforeAll(async () => {
9597
(visualBuilderPostMessage?.send as Mock).mockImplementation(
9698
(eventName: string, args) => {
97-
if (
98-
eventName ===
99-
VisualBuilderPostMessageEvents.GET_FIELD_DATA
100-
) {
101-
return Promise.resolve({
102-
fieldData: "Hello world",
103-
});
104-
} else if (
105-
eventName ===
106-
VisualBuilderPostMessageEvents.GET_FIELD_DISPLAY_NAMES
107-
) {
108-
return Promise.resolve({
109-
"all_fields.bltapikey.en-us.single_line":
110-
"Single Line",
111-
});
99+
switch (eventName) {
100+
case VisualBuilderPostMessageEvents.GET_FIELD_DATA:
101+
return Promise.resolve({
102+
fieldData: "Hello world",
103+
});
104+
case VisualBuilderPostMessageEvents.GET_FIELD_DISPLAY_NAMES:
105+
return Promise.resolve({
106+
"all_fields.bltapikey.en-us.single_line":
107+
"Single Line",
108+
});
109+
case VisualBuilderPostMessageEvents.GET_WORKFLOW_STAGE_DETAILS:
110+
return Promise.resolve({
111+
stage: { name: EXAMPLE_STAGE_NAME },
112+
permissions: {
113+
entry: {
114+
update: true,
115+
},
116+
},
117+
});
118+
default:
119+
return Promise.resolve({});
112120
}
113-
return Promise.resolve({});
114121
}
115122
);
116123

@@ -185,20 +192,33 @@ describe("When an element is clicked in visual builder mode", () => {
185192
beforeAll(async () => {
186193
(visualBuilderPostMessage?.send as Mock).mockImplementation(
187194
(eventName: string, args) => {
188-
if (
189-
eventName ===
190-
VisualBuilderPostMessageEvents.GET_FIELD_DATA
191-
) {
192-
const values: Record<string, any> = {
193-
multi_line_textbox_multiple_: ["Hello", "world"],
194-
"multi_line_textbox_multiple_.0": "Hello",
195-
"multi_line_textbox_multiple_.1": "world",
196-
};
197-
return Promise.resolve({
198-
fieldData: values[args.entryPath],
199-
});
195+
switch (eventName) {
196+
case VisualBuilderPostMessageEvents.GET_FIELD_DATA: {
197+
const values: Record<string, any> = {
198+
multi_line_textbox_multiple_: [
199+
"Hello",
200+
"world",
201+
],
202+
"multi_line_textbox_multiple_.0": "Hello",
203+
"multi_line_textbox_multiple_.1": "world",
204+
};
205+
return Promise.resolve({
206+
fieldData: values[args.entryPath],
207+
});
208+
}
209+
case VisualBuilderPostMessageEvents.GET_WORKFLOW_STAGE_DETAILS: {
210+
return Promise.resolve({
211+
stage: { name: EXAMPLE_STAGE_NAME },
212+
permissions: {
213+
entry: {
214+
update: true,
215+
},
216+
},
217+
});
218+
}
219+
default:
220+
return Promise.resolve({});
200221
}
201-
return Promise.resolve({});
202222
}
203223
);
204224

src/visualBuilder/__test__/click/fields/number.test.tsx

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ import { VisualBuilderPostMessageEvents } from "../../../utils/types/postMessage
1111
import { VisualBuilder } from "../../../index";
1212
import { triggerAndWaitForClickAction } from "../../../../__test__/utils";
1313

14+
const EXAMPLE_STAGE_NAME = "Example Stage";
15+
1416
const VALUES = {
1517
number: "10.5",
1618
};
@@ -112,6 +114,18 @@ describe("When an element is clicked in visual builder mode", () => {
112114
return Promise.resolve({
113115
"all_fields.bltapikey.en-us.number": "Number",
114116
});
117+
} else if (
118+
eventName ===
119+
VisualBuilderPostMessageEvents.GET_WORKFLOW_STAGE_DETAILS
120+
) {
121+
return Promise.resolve({
122+
stage: { name: EXAMPLE_STAGE_NAME },
123+
permissions: {
124+
entry: {
125+
update: true,
126+
},
127+
},
128+
});
115129
}
116130
return Promise.resolve({});
117131
}
@@ -196,6 +210,18 @@ describe("When an element is clicked in visual builder mode", () => {
196210
return Promise.resolve({
197211
fieldData: values[args.entryPath],
198212
});
213+
} else if (
214+
eventName ===
215+
VisualBuilderPostMessageEvents.GET_WORKFLOW_STAGE_DETAILS
216+
) {
217+
return Promise.resolve({
218+
stage: { name: EXAMPLE_STAGE_NAME },
219+
permissions: {
220+
entry: {
221+
update: true,
222+
},
223+
},
224+
});
199225
}
200226
return Promise.resolve({});
201227
}

src/visualBuilder/__test__/click/fields/single-line.test.tsx

Lines changed: 48 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@ import { Mock, vi } from "vitest";
1010
import { VisualBuilderPostMessageEvents } from "../../../utils/types/postMessage.types";
1111
import { VisualBuilder } from "../../../index";
1212
import { triggerAndWaitForClickAction } from "../../../../__test__/utils";
13-
import { act } from "preact/test-utils";
13+
14+
const EXAMPLE_STAGE_NAME = "Example Stage";
1415

1516
const VALUES = {
1617
singleLine: "Single line",
@@ -99,23 +100,28 @@ describe("When an element is clicked in visual builder mode", () => {
99100
beforeAll(async () => {
100101
(visualBuilderPostMessage?.send as Mock).mockImplementation(
101102
(eventName: string) => {
102-
if (
103-
eventName ===
104-
VisualBuilderPostMessageEvents.GET_FIELD_DATA
105-
) {
106-
return Promise.resolve({
107-
fieldData: VALUES.singleLine,
108-
});
109-
} else if (
110-
eventName ===
111-
VisualBuilderPostMessageEvents.GET_FIELD_DISPLAY_NAMES
112-
) {
113-
return Promise.resolve({
114-
"all_fields.bltapikey.en-us.single_line":
115-
"Single Line",
116-
});
103+
switch (eventName) {
104+
case VisualBuilderPostMessageEvents.GET_FIELD_DATA:
105+
return Promise.resolve({
106+
fieldData: VALUES.singleLine,
107+
});
108+
case VisualBuilderPostMessageEvents.GET_FIELD_DISPLAY_NAMES:
109+
return Promise.resolve({
110+
"all_fields.bltapikey.en-us.single_line":
111+
"Single Line",
112+
});
113+
case VisualBuilderPostMessageEvents.GET_WORKFLOW_STAGE_DETAILS:
114+
return Promise.resolve({
115+
stage: { name: EXAMPLE_STAGE_NAME },
116+
permissions: {
117+
entry: {
118+
update: true,
119+
},
120+
},
121+
});
122+
default:
123+
return Promise.resolve({});
117124
}
118-
return Promise.resolve({});
119125
}
120126
);
121127

@@ -205,20 +211,32 @@ describe("When an element is clicked in visual builder mode", () => {
205211
beforeAll(async () => {
206212
(visualBuilderPostMessage?.send as Mock).mockImplementation(
207213
(eventName: string, args) => {
208-
if (
209-
eventName ===
210-
VisualBuilderPostMessageEvents.GET_FIELD_DATA
211-
) {
212-
const values: Record<string, any> = {
213-
single_line_textbox_multiple_: ["Hello", "world"],
214-
"single_line_textbox_multiple_.0": "Hello",
215-
"single_line_textbox_multiple_.1": "world",
216-
};
217-
return Promise.resolve({
218-
fieldData: values[args.entryPath],
219-
});
214+
switch (eventName) {
215+
case VisualBuilderPostMessageEvents.GET_FIELD_DATA: {
216+
const values: Record<string, any> = {
217+
single_line_textbox_multiple_: [
218+
"Hello",
219+
"world",
220+
],
221+
"single_line_textbox_multiple_.0": "Hello",
222+
"single_line_textbox_multiple_.1": "world",
223+
};
224+
return Promise.resolve({
225+
fieldData: values[args.entryPath],
226+
});
227+
}
228+
case VisualBuilderPostMessageEvents.GET_WORKFLOW_STAGE_DETAILS:
229+
return Promise.resolve({
230+
stage: { name: EXAMPLE_STAGE_NAME },
231+
permissions: {
232+
entry: {
233+
update: true,
234+
},
235+
},
236+
});
237+
default:
238+
return Promise.resolve({});
220239
}
221-
return Promise.resolve({});
222240
}
223241
);
224242

src/visualBuilder/components/FieldToolbar.tsx

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import getChildrenDirection from "../utils/getChildrenDirection";
44
import {
55
ALLOWED_MODAL_EDITABLE_FIELD,
66
ALLOWED_REPLACE_FIELDS,
7-
DEFAULT_MULTIPLE_FIELDS,
87
} from "../utils/constants";
98
import { getFieldType } from "../utils/getFieldType";
109
import {
@@ -20,7 +19,6 @@ import {
2019
MoveLeftIcon,
2120
MoveRightIcon,
2221
ReplaceAssetIcon,
23-
MoreIcon,
2422
} from "./icons";
2523
import { fieldIcons } from "./icons/fields";
2624
import classNames from "classnames";
@@ -42,10 +40,9 @@ import {
4240
} from "./FieldRevert/FieldRevertComponent";
4341
import { LoadingIcon } from "./icons/loading";
4442
import { EntryPermissions } from "../utils/getEntryPermissions";
45-
import { EmptyAppIcon } from "./icons/EmptyAppIcon";
4643
import { FieldLocationAppList } from "./FieldLocationAppList";
4744
import { FieldLocationIcon } from "./FieldLocationIcon";
48-
45+
import { WorkflowStageDetails } from "../utils/getWorkflowStageDetails";
4946

5047
export type FieldDetails = Pick<
5148
VisualBuilderCslpEventDetails,
@@ -58,7 +55,8 @@ interface MultipleFieldToolbarProps {
5855
eventDetails: VisualBuilderCslpEventDetails;
5956
hideOverlay: () => void;
6057
isVariant?: boolean;
61-
entryPermissions?: EntryPermissions;
58+
entryPermissions?: EntryPermissions | undefined;
59+
entryWorkflowStageDetails?: WorkflowStageDetails | undefined;
6260
}
6361

6462
function handleReplaceAsset(fieldMetadata: CslpData) {
@@ -118,6 +116,7 @@ function FieldToolbarComponent(
118116
eventDetails,
119117
isVariant: isVariantOrParentOfVariant,
120118
entryPermissions,
119+
entryWorkflowStageDetails,
121120
} = props;
122121
const { fieldMetadata, editableElement: targetElement } = eventDetails;
123122
const [isFormLoading, setIsFormLoading] = useState(false);
@@ -158,12 +157,12 @@ function FieldToolbarComponent(
158157
editableElement: targetElement,
159158
fieldMetadata,
160159
},
161-
entryPermissions
160+
entryPermissions,
161+
entryWorkflowStageDetails
162162
);
163163
disableFieldActions = isDisabled;
164164

165165
fieldType = getFieldType(fieldSchema);
166-
167166

168167
Icon = fieldIcons[fieldType];
169168

@@ -394,8 +393,6 @@ function FieldToolbarComponent(
394393
};
395394
}, []);
396395

397-
398-
399396
useEffect(() => {
400397
const fetchFieldLocationData = async () => {
401398
try {

0 commit comments

Comments
 (0)