Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Stage Release #2679

Merged
merged 9 commits into from
Apr 17, 2024
Merged

Stage Release #2679

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
6bf6497
Date field revamp vqa updates (#2672)
finnar-bin Apr 12, 2024
6b42a1c
Change internal link none value from "0" to null (#2677)
finnar-bin Apr 15, 2024
c566998
Date & Time Field revamp (#2664)
finnar-bin Apr 16, 2024
465efe0
Date and datetime field timezone fixes (#2680)
finnar-bin Apr 16, 2024
f34693f
Update new date field value format and added value preview (#2682)
finnar-bin Apr 17, 2024
e2b25d9
Feature/Schema default values (#2681)
agalin920 Apr 17, 2024
4aecab3
Fix/Conditionally call function that is an optional prop (#2668)
agalin920 Apr 17, 2024
68dfb31
Resolve conflict (#2683)
agalin920 Apr 17, 2024
ab74308
Merge branch 'stage' into dev
shrunyan Apr 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 15 additions & 0 deletions cypress/e2e/content/actions.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,21 @@ describe("Actions in content editor", () => {
cy.get("#SchedulePublishClose").click();
});

it("Fills in default values for a new item", () => {
cy.waitOn("/v1/content/models*", () => {
cy.visit("/content/6-a1a600-k0b6f0/new");
});

cy.get("#12-0c3934-8dz720 input").should(
"have.value",
"default single line text field"
);
cy.get("#12-d39a38-85sqdt").contains("zesty-io-logo-horizontal-dark.png");
cy.get("#12-bcd1dcc5f4-2rpm9p").contains(
"5 Tricks to Teach Your Pitbull: Fun & Easy Tips for You & Your Dog!"
);
});

it("Creates a new item", () => {
cy.waitOn("/v1/content/models*", () => {
cy.visit("/content/6-a1a600-k0b6f0/new");
Expand Down
127 changes: 104 additions & 23 deletions cypress/e2e/content/content.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import moment from "moment";

describe("Content Specs", () => {
const TIMESTAMP = Date.now();

Expand All @@ -6,6 +8,7 @@ describe("Content Specs", () => {
cy.waitOn("/v1/content/models*", () => {
cy.visit("/content/6-556370-8sh47g/7-b939a4-457q19");
});
cy.getBySelector("DuoModeToggle").click();
});

it("Text Field", () => {
Expand Down Expand Up @@ -42,28 +45,6 @@ describe("Content Specs", () => {
.should("have.value", `${TIMESTAMP}`);
});

it("Date Field", () => {
cy.get("#12-63ab04-0nkwcc")
.find('[data-cy="datePickerInputField"]')
.click();

// Timestamp for March 04, 2019
cy.get('[data-timestamp="1551628800000"]').click();

cy.get("#12-63ab04-0nkwcc input").should("have.value", "Mar 04, 2019");
});

it("Date & Time Field", () => {
cy.get("#12-f3db44-c8kt0q button").click();

// cy.get("[role=dialog]").find('[aria-label="Mar 5, 2019"]').click();

cy.get("#12-f3db44-c8kt0q input").should(
"have.value",
"2019-03-21 14:30:00.000000"
);
});

it("WYSIWYG Advanced Field", () => {
cy.get("#12-be261c-4q7s81").should("exist");

Expand Down Expand Up @@ -290,7 +271,7 @@ describe("Content Specs", () => {
});
});

it.only("renders an image with a url from a template", () => {
it("renders an image with a url from a template", () => {
cy.get("#12-1c94d4-pg8dvx")
.find('[data-cy="file-preview"]')
.eq(3)
Expand Down Expand Up @@ -330,4 +311,104 @@ describe("Content Specs", () => {
.should("exist");
});
});

describe("Date Field", () => {
before(() => {
cy.waitOn("/v1/content/models*", () => {
cy.visit("/content/6-556370-8sh47g/7-b939a4-457q19");
});
});

it("should be able to clear date entries", () => {
cy.get("#12-63ab04-0nkwcc")
.find("[data-cy='dateFieldClearButton']")
.click();
cy.get("#12-63ab04-0nkwcc")
.find("[data-cy='datePickerInputField']")
.find("input")
.should("have.value", "");
});

it("should be able to auto-fill empty date fields on click", () => {
cy.get("#12-63ab04-0nkwcc")
.find('[data-cy="datePickerInputField"]')
.click();

cy.get("#12-63ab04-0nkwcc input").should(
"have.value",
moment(TIMESTAMP).format("MMM DD, YYYY")
);
});
});

describe("Date & Time Field", () => {
before(() => {
cy.waitOn("/v1/content/models*", () => {
cy.visit("/content/6-556370-8sh47g/7-b939a4-457q19");
});
});

it("should be able to clear date and time entries", () => {
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateFieldClearButton']")
.click();
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='datePickerInputField']")
.find("input")
.should("have.value", "");
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.should("have.value", "");
});

it("should be able to auto-fill the date and time when field is empty", () => {
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.click();
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='datePickerInputField']")
.find("input")
.should("have.value", moment(TIMESTAMP).format("MMM DD, YYYY"));
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.should("have.value", "12:00 am");
});

it("should allow a user to select a time from the dropdown", () => {
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.click();
cy.get(".MuiAutocomplete-listbox>.MuiAutocomplete-option").eq(1).click();
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.should("have.value", "12:15 am");
});

it("should allow a user to manually type in a time", () => {
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.type("{selectAll}{del}11:00 pm")
.blur();
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.should("have.value", "11:00 pm");
});

it("should reset to last saved valid time when user types in an invalid time", () => {
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.type("{selectAll}{del}asdasdasdasdas")
.blur();
cy.get("#12-f3db44-c8kt0q")
.find("[data-cy='dateTimeInputField']")
.find("input")
.should("have.value", "11:00 pm");
});
});
});
56 changes: 55 additions & 1 deletion cypress/e2e/schema/field.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,8 @@ const SELECTORS = {
ADD_FIELD_MODAL_DEACTIVATE_REACTIVATE: "DeactivateReactivateFieldUpdateModal",
SHOW_SYSTEM_FIELDS_BTN: "ShowSystemFieldsBtn",
SYSTEM_FIELDS: "SystemFields",
DEFAULT_VALUE_CHECKBOX: "DefaultValueCheckbox",
DEFAULT_VALUE_INPUT: "DefaultValueInput",
};

/**
Expand Down Expand Up @@ -97,6 +99,17 @@ describe("Schema: Fields", () => {
.should("exist")
.should("have.value", fieldName);

// Navigate to rules tab and add default value
cy.getBySelector(SELECTORS.RULES_TAB_BTN).click();
// click on the default value checkbox
cy.getBySelector(SELECTORS.DEFAULT_VALUE_CHECKBOX).click();
// enter a default value
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT).type("default value");
// verify that the default value is set
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT)
.find("input")
.should("have.value", "default value");

// Click done
cy.getBySelector(SELECTORS.SAVE_FIELD_BUTTON).should("exist").click();
cy.getBySelector(SELECTORS.ADD_FIELD_MODAL).should("not.exist");
Expand Down Expand Up @@ -141,6 +154,19 @@ describe("Schema: Fields", () => {
.should("exist")
.click();

// Navigate to rules tab and add default value
cy.getBySelector(SELECTORS.RULES_TAB_BTN).click();
// click on the default value checkbox
cy.getBySelector(SELECTORS.DEFAULT_VALUE_CHECKBOX).click();
// Open select menu
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT).click();
// Select the option
cy.get("[role=listbox] [role=option]").last().click();
// verify that the default value is set
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT)
.find("input")
.should("have.value", "test");

// Click done
cy.getBySelector(SELECTORS.SAVE_FIELD_BUTTON).should("exist").click();
cy.getBySelector(SELECTORS.ADD_FIELD_MODAL).should("not.exist");
Expand Down Expand Up @@ -210,6 +236,21 @@ describe("Schema: Fields", () => {
"not.exist"
);

// Navigate to rules tab and add default value
cy.getBySelector(SELECTORS.RULES_TAB_BTN).click();
// click on the default value checkbox
cy.getBySelector(SELECTORS.DEFAULT_VALUE_CHECKBOX).click();
// enter a default value
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT)
.find("button")
.first()
.click();
// verify that the default value is set by aria-pressed attribute
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT)
.find("button")
.first()
.should("have.attr", "aria-pressed", "true");

// Click done
cy.getBySelector(SELECTORS.SAVE_FIELD_BUTTON).should("exist").click();
cy.getBySelector(SELECTORS.ADD_FIELD_MODAL).should("not.exist");
Expand Down Expand Up @@ -250,6 +291,20 @@ describe("Schema: Fields", () => {
.type("title");
cy.get("[role=listbox] [role=option]").first().click();

// Navigate to rules tab and add default value
cy.getBySelector(SELECTORS.RULES_TAB_BTN).click();
// click on the default value checkbox
cy.getBySelector(SELECTORS.DEFAULT_VALUE_CHECKBOX).click();
// enter a default value
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT).click();
// Select the option
cy.get("[role=listbox] [role=option]").first().click();
// verify that the default value is set
cy.getBySelector(SELECTORS.DEFAULT_VALUE_INPUT)
.find("input")
.should("have.value", "- None -");
cy.getBySelector(SELECTORS.DEFAULT_VALUE_CHECKBOX).click();

// Click done
cy.getBySelector(SELECTORS.SAVE_FIELD_BUTTON).should("exist").click();
cy.getBySelector(SELECTORS.ADD_FIELD_MODAL).should("not.exist");
Expand Down Expand Up @@ -376,7 +431,6 @@ describe("Schema: Fields", () => {

// Click Rules tab
cy.getBySelector(SELECTORS.RULES_TAB_BTN).should("exist").click();
cy.getBySelector(SELECTORS.RULES_TAB).should("exist");

// Close the modal
cy.getBySelector(SELECTORS.ADD_FIELD_MODAL_CLOSE).should("exist").click();
Expand Down
22 changes: 20 additions & 2 deletions src/apps/content-editor/src/app/components/Editor/Editor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,9 @@ export const MaxLengths = {
textarea: 16000,
wysiwyg_basic: 0,
wysiwyg_advanced: 0,
fontawesome: 150,
markdown: 0,
article_writer: 0,
};

export default memo(function Editor({
Expand All @@ -43,6 +46,7 @@ export default memo(function Editor({
const dispatch = useDispatch();
const isNewItem = itemZUID.slice(0, 3) === "new";
const { data: fields } = useGetContentModelFieldsQuery(modelZUID);
const [isLoaded, setIsLoaded] = useState(false);

const activeFields = useMemo(() => {
if (fields?.length) {
Expand Down Expand Up @@ -181,7 +185,6 @@ export default memo(function Editor({
[fieldErrors]
);

// This function will be built upon when default values are added to the schema builder
const applyDefaultValuesToItemData = useCallback(() => {
activeFields.forEach((field) => {
if (field.datatype === "sort") {
Expand All @@ -192,14 +195,29 @@ export default memo(function Editor({
value: 0,
});
}

if (field?.settings?.defaultValue !== null) {
dispatch({
type: "SET_ITEM_DATA",
itemZUID: itemZUID,
key: field.name,
value: field.settings.defaultValue,
});
}

setIsLoaded(true);
});
}, [activeFields, itemZUID]);

useEffect(() => {
if (isNewItem) {
applyDefaultValuesToItemData();
} else {
setIsLoaded(true);
}
}, [isNewItem]);
}, [isNewItem, setIsLoaded, applyDefaultValuesToItemData]);

if (!isLoaded) return null;

return (
<ThemeProvider theme={theme}>
Expand Down
Loading
Loading