@griddo/ax 1.66.13 → 1.67.0

package/src/components/SearchField/style.tsx

@@ -5,15 +5,9 @@ const Wrapper = styled.div`
   width: 100%;
 `;
 
-const FieldWrapper = styled.div``;
-
-const Input = styled.input<{ closeOnInactive: boolean; disabled: boolean }>`
-  ${(p) => p.theme.textStyle.fieldContent};
-  color: ${(p) => p.theme.color.textHighEmphasis};
-  background-color: ${(p) => p.theme.color.interactiveBackground};
-  width: 100%;
-  height: ${(p) => p.theme.spacing.l};
-  padding-left: ${(p) => p.theme.spacing.xs};
+const FieldWrapper = styled.div<{ closeOnInactive: boolean; disabled: boolean }>`
+  display: flex;
+  align-items: center;
   border-color: ${(p) =>
     p.disabled
       ? p.theme.color.interactiveDisabled
@@ -23,6 +17,16 @@ const Input = styled.input<{ closeOnInactive: boolean; disabled: boolean }>`
   border-width: ${(p) => (p.closeOnInactive ? "0 0 1px" : "1px")};
   border-style: solid;
   border-radius: ${(p) => (p.closeOnInactive ? 0 : p.theme.radii.s)};
+`;
+
+const Input = styled.input<{ closeOnInactive: boolean; disabled: boolean }>`
+  ${(p) => p.theme.textStyle.fieldContent};
+  color: ${(p) => p.theme.color.textHighEmphasis};
+  background-color: ${(p) => p.theme.color.interactiveBackground};
+  flex: 1 1 auto;
+  height: ${(p) => p.theme.spacing.l};
+  padding-left: ${(p) => p.theme.spacing.xs};
+  border: none;
 
   &:active,
   &:focus {
@@ -66,4 +70,13 @@ const IconCloseWrapper = styled.div`
   transform: translateY(-50%);
 `;
 
-export { Wrapper, IconSearchWrapper, FieldWrapper, Input, HelpText, IconCloseWrapper };
+const FilterWrapper = styled.div``;
+
+const Separator = styled.div`
+  border-right: 1px solid ${(p) => p.theme.color.uiLine};
+  height: ${(p) => p.theme.spacing.m};
+  margin-right: ${(p) => p.theme.spacing.xs};
+  margin-left: ${(p) => p.theme.spacing.s};
+`;
+
+export { Wrapper, IconSearchWrapper, FieldWrapper, Input, HelpText, IconCloseWrapper, FilterWrapper, Separator };

package/src/components/index.tsx

@@ -13,6 +13,7 @@ import {
   HeadingField,
   HiddenField,
   ImageField,
+  LinkField,
   NoteField,
   NumberField,
   RadioField,
@@ -105,6 +106,7 @@ export {
   HeadingField,
   HiddenField,
   ImageField,
+  LinkField,
   NoteField,
   NumberField,
   RadioField,

package/src/containers/Navigation/Defaults/actions.tsx

@@ -275,6 +275,8 @@ function updateNavigation(
       const successAction = async (response: any) => {
         if (fromEditor) {
           generateContent(response, dispatch, getState);
+        } else {
+          getNavigationByType(data.type)(dispatch, getState);
         }
       };
       const responseActions = {

package/src/containers/PageEditor/actions.tsx

@@ -26,10 +26,13 @@ import {
   replaceElements,
   findFieldsErrors,
   getParentKey,
+  checkH1content,
+  parseValidationErrors,
 } from "@ax/forms";
 import { appActions } from "@ax/containers/App";
 import { navigationActions } from "@ax/containers/Navigation";
-import { pages, structuredData } from "@ax/api";
+import { setCurrentSiteErrorPages } from "@ax/containers/Sites/actions";
+import { pages, sites, structuredData } from "@ax/api";
 import { getPageData, getPageNavigation, getStateValues } from "./utils";
 import {
   SET_BREADCRUMB,
@@ -514,8 +517,30 @@ function updatePageStatus(
         pageEditor: {
           editorContent: { header, footer },
         },
+        sites: { currentSiteInfo },
       } = getState();
-      const response = await pages.setPageStatus(status, ids);
+
+      const pagesWithErrors: number[] = [];
+      if (status === pageStatus.UPLOAD_PENDING && updatedFromList) {
+        const getPagesParams = {
+          siteID: currentSiteInfo?.id,
+          filterPages: ids,
+          deleted: false,
+        };
+        const { data } = await sites.getSitePages(getPagesParams);
+
+        data.items.forEach((page: any) => {
+          const errors = findFieldsErrors(page);
+          if (errors.length) pagesWithErrors.push(page.id);
+        });
+
+        dispatch(setCurrentSiteErrorPages(pagesWithErrors));
+      }
+
+      const validIds = ids.filter((id) => !pagesWithErrors.includes(id));
+      if (!validIds.length) return false;
+
+      const response = await pages.setPageStatus(status, validIds);
       const isUpdatingFromPageEditor = isReqOk(response.status) && !updatedFromList;
       if (isUpdatingFromPageEditor) {
         const currentPageID = ids[0];
@@ -551,18 +576,30 @@ function getPageLanguages(pageID: number, siteID: number | null, entity?: string
   };
 }
 
-function duplicatePage(pageID: number, data: any): (dispatch: any) => Promise<void> {
+
+function duplicatePage(pageID: number, data: any, siteID?: number): (dispatch: Dispatch) => Promise<boolean> {
   return async (dispatch) => {
     try {
-      const response: { status: number; data: IPage } = await pages.duplicatePage(pageID, data);
-      if (isReqOk(response.status)) {
-        dispatch(setCurrentPageID(response.data.id));
-        dispatch(setCurrentPageStatus("offline"));
-      } else {
-        console.log("Error en duplicate Page"); // FIXME: capturar errores mejor
-      }
+      const responseActions = {
+        handleSuccess: (data: any) => {
+          if (!siteID) {
+            dispatch(setCurrentPageID(data.id));
+            dispatch(setCurrentPageStatus("offline"));
+          }
+          return true;
+        },
+        handleError: (response: any) => {
+          appActions.handleError(response)(dispatch);
+          return false;
+        },
+      };
+
+      const callback = async () => pages.duplicatePage(pageID, data, siteID);
+
+      return await handleRequest(callback, responseActions, [])(dispatch);
     } catch (e) {
-      console.log(e); // FIXME: capturar errores mejor
+      console.log(e);
+      return false;
     }
   };
 }
@@ -656,8 +693,11 @@ function addModule(
 function replaceModule(module: any, parent: any, objKey: string): (dispatch: Dispatch, getState: any) => void {
   return async (dispatch, getState) => {
     const { editorContent } = getStateValues(getState);
+
+    const [parentKey, childKey] = objKey.split(".");
+    const value = childKey ? parent[parentKey][childKey] : parent[parentKey];
     const updatedVal = {
-      ...getNullValue(parent[objKey], true),
+      ...getNullValue(value, true),
     };
 
     Object.keys(updatedVal).forEach((key: string) => {
@@ -691,7 +731,7 @@ function replaceElementsInCollection(newValue: string, reference: string): (disp
 
 function deleteModule(editorID: number, key?: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
-    const { sections, editorContent } = getStateValues(getState);
+    const { sections, editorContent, errors } = getStateValues(getState);
 
     const updatedSections: any = [...sections];
     const { parent, grandParent } = findByEditorID(updatedSections, editorID);
@@ -707,6 +747,10 @@ function deleteModule(editorID: number, key?: string): (dispatch: Dispatch, getS
       ...editorContent,
     };
 
+    if (errors.length) {
+      validatePage()(dispatch, getState);
+    }
+
     generatePageContent(updatedPageContent, dispatch, getState);
 
     dispatch(setLastElementAddedId(null));
@@ -1025,16 +1069,47 @@ function getTemplateConfig(template: string): (dispatch: Dispatch, getState: any
   };
 }
 
-function validatePage(publish: boolean): (dispatch: Dispatch, getState: any) => Promise<boolean> {
+function validatePage(publish?: boolean, browserRef?: any): (dispatch: Dispatch, getState: any) => Promise<boolean> {
   return async (dispatch, getState) => {
     try {
       const { editorContent } = getStateValues(getState);
+      const page = getPageData(getState, false);
+      const { values } = parseData(page, false);
+
+      const content = deepClone(editorContent);
+
+      let errors: IErrorItem[] = [];
 
-      const errors = findFieldsErrors(editorContent);
-      dispatch(setErrors(errors));
-      if (errors.length === 0) {
+      const responseActions = {
+        handleSuccess: (data: any) => {
+          const apiErrors = parseValidationErrors(data, content);
+          errors = [...errors, ...apiErrors];
+        },
+        handleError: () => console.log("Error en page check"),
+      };
+
+      const callback = async () => pages.pageCheck(values);
+
+      await handleRequest(callback, responseActions, [])(dispatch);
+
+      const fieldErrors = findFieldsErrors(content);
+
+      errors = [...errors, ...fieldErrors];
+
+      let warnings: IErrorItem[] = [];
+      if (browserRef && browserRef.current) {
+        const h1Warning = checkH1content(browserRef.current);
+        warnings = h1Warning ? [...warnings, h1Warning] : warnings;
+      }
+
+      const allErrors = [...errors, ...warnings];
+
+      dispatch(setErrors(allErrors));
+      if (!allErrors.length) {
         !publish && dispatch(setValidated(true));
         return true;
+      } else if (publish && !errors.length) {
+        return true;
       } else {
         dispatch(setValidated(false));
         return false;

package/src/containers/PageEditor/utils.tsx

@@ -38,7 +38,7 @@ const getTemplateValues = (template: any) => {
 
 export const getStateValues = (getState: any) => {
   const {
-    pageEditor: { editorContent: pageContent, selectedEditorID, selectedContent, template },
+    pageEditor: { editorContent: pageContent, selectedEditorID, selectedContent, template, errors },
   } = getState();
   const { editorContent, header, footer } = pageContent;
 
@@ -53,6 +53,7 @@ export const getStateValues = (getState: any) => {
     editorID,
     template,
     selectedContent,
+    errors,
   };
 };
 

package/src/containers/Sites/actions.tsx

@@ -1,6 +1,7 @@
 import { Dispatch } from "redux";
 import {
   SET_SITES,
+  SET_SITES_BY_LANG,
   SET_CURRENT_SITE_INFO,
   SET_CURRENT_SITE_PAGES,
   SET_FILTER,
@@ -8,15 +9,18 @@ import {
   SET_CURRENT_SITE_LANGUAGES,
   SET_SAVED_SITE_INFO,
   DEFAULT_PARAMS,
+  SET_CURRENT_SITE_ERROR_PAGES,
 } from "./constants";
 import {
   ISetSitesAction,
+  ISetSitesByLangAction,
   ISetCurrentSiteInfoAction,
   ISetCurrentSitePagesAction,
   ISetFilter,
   ISetTotalItems,
   ISetCurrentSiteLanguagesAction,
   ISetSavedSiteInfoAction,
+  ISetCurrentSiteErrorPages,
 } from "./interfaces";
 
 import { ISite, IGetSitePagesParams, ISettingsForm, IGetGlobalPagesParams, IPage } from "@ax/types";
@@ -24,7 +28,7 @@ import { sites, languages, dataPack, social, structuredData, analytics } from "@
 import { appActions } from "@ax/containers/App";
 import { structuredDataActions } from "@ax/containers/StructuredData";
 import { navigationActions, menuActions } from "@ax/containers/Navigation";
-import { pageEditorActions } from "@ax/containers/PageEditor";
+import { resetPageEditor } from "@ax/containers/PageEditor/actions";
 import { analyticsActions } from "@ax/containers/Analytics";
 import { dataPacksActions } from "@ax/containers/Settings/DataPacks";
 import { socialActions } from "@ax/containers/Settings/Social";
@@ -33,7 +37,6 @@ import { usersActions } from "@ax/containers/Users";
 
 const { setIsLoading, setIsSaving, setLanguage } = appActions;
 const { resetDefaultsValues } = navigationActions;
-const { resetPageEditor } = pageEditorActions;
 const { resetMenuValues } = menuActions;
 const { getAnalytics } = analyticsActions;
 const { getUsers } = usersActions;
@@ -42,6 +45,10 @@ function setSites(sitesList: ISite[]): ISetSitesAction {
   return { type: SET_SITES, payload: { sites: sitesList } };
 }
 
+function setSitesByLang(sitesList: ISite[]): ISetSitesByLangAction {
+  return { type: SET_SITES_BY_LANG, payload: { sitesByLang: sitesList } };
+}
+
 function setCurrentSiteInfo(currentSiteInfo: ISite): ISetCurrentSiteInfoAction {
   return { type: SET_CURRENT_SITE_INFO, payload: { currentSiteInfo } };
 }
@@ -66,25 +73,43 @@ function setSavedSiteInfo(savedSiteInfo: ISite): ISetSavedSiteInfoAction {
   return { type: SET_SAVED_SITE_INFO, payload: { savedSiteInfo } };
 }
 
+function setCurrentSiteErrorPages(currentSiteErrorPages: number[]): ISetCurrentSiteErrorPages {
+  return { type: SET_CURRENT_SITE_ERROR_PAGES, payload: { currentSiteErrorPages } };
+}
+
 // TODO: hay que controlar que cuando da error la API borrar los sites ya guardados y sacar el error (ver los siguientes FIXME)
-function getSites(token: string): (dispatch: Dispatch) => Promise<void> {
+function getSites(): (dispatch: Dispatch) => Promise<void> {
   return async (dispatch) => {
     try {
-      dispatch(setIsLoading(true));
-      const sitesResponse: { status: number; data: ISite[] } = await sites.getAllSites(token); // FIXME: establecer type
-      if (isReqOk(sitesResponse.status)) {
-        dispatch(setSites(sitesResponse.data));
-      } else {
-        console.log("Error en getSites"); // TODO: capturar errores mejor
-      }
-      dispatch(setIsLoading(false));
+      const responseActions = {
+        handleSuccess: (data: any) => dispatch(setSites(data)),
+        handleError: (response: any) => appActions.handleError(response)(dispatch),
+      };
+      const callback = async () => sites.getAllSites();
+
+      await handleRequest(callback, responseActions, [])(dispatch);
     } catch (e) {
-      dispatch(setIsLoading(false));
       console.log(e); // TODO: capturar errores mejor
     }
   };
 }
 
+function getSitesByLang(language: number): (dispatch: Dispatch) => Promise<void> {
+  return async (dispatch) => {
+    try {
+      const responseActions = {
+        handleSuccess: (data: any) => dispatch(setSitesByLang(data)),
+        handleError: (response: any) => appActions.handleError(response)(dispatch),
+      };
+      const callback = async () => sites.getAllSites(language);
+
+      await handleRequest(callback, responseActions, [])(dispatch);
+    } catch (e) {
+      console.log(e);
+    }
+  };
+}
+
 function saveSettings(form: ISettingsForm): (dispatch: Dispatch, getState: any) => Promise<boolean> {
   return async (dispatch, getState) => {
     try {
@@ -306,10 +331,7 @@ function deleteSite(siteID: number): (dispatch: Dispatch, getState: any) => Prom
     try {
       const response = await sites.deleteSite(siteID);
       if (isReqOk(response.status)) {
-        const {
-          app: { token },
-        } = getState();
-        getSites(token)(dispatch);
+        getSites()(dispatch);
       }
     } catch (e) {
       console.log(e); // TODO: capturar error bien
@@ -322,10 +344,7 @@ function publishSite(siteID: number): (dispatch: Dispatch, getState: any) => Pro
     try {
       const response = await sites.publishSite(siteID);
       if (isReqOk(response.status)) {
-        const {
-          app: { token },
-        } = getState();
-        getSites(token)(dispatch);
+        getSites()(dispatch);
       }
     } catch (e) {
       console.log(e); // TODO: capturar error bien
@@ -338,10 +357,7 @@ function unpublishSite(siteID: number): (dispatch: Dispatch, getState: any) => P
     try {
       const response = await sites.unpublishSite(siteID);
       if (isReqOk(response.status)) {
-        const {
-          app: { token },
-        } = getState();
-        getSites(token)(dispatch);
+        getSites()(dispatch);
       }
     } catch (e) {
       console.log(e); // TODO: capturar error bien
@@ -457,6 +473,16 @@ function removePageFromSite(
   };
 }
 
+function resetCurrentSiteErrorPages(): (dispatch: Dispatch) => Promise<void> {
+  return async (dispatch) => {
+    try {
+      dispatch(setCurrentSiteErrorPages([]));
+    } catch (e) {
+      console.log(e);
+    }
+  };
+}
+
 export {
   setCurrentSiteInfo,
   setCurrentSitePages,
@@ -464,6 +490,7 @@ export {
   setTotalItems,
   setCurrentSiteLanguages,
   getSites,
+  getSitesByLang,
   setSiteInfo,
   getFilteredContent,
   getSitePages,
@@ -478,4 +505,6 @@ export {
   importPageFromGlobal,
   removePageFromSite,
   removeUsersBulk,
+  setCurrentSiteErrorPages,
+  resetCurrentSiteErrorPages,
 };

package/src/containers/Sites/constants.tsx

@@ -1,6 +1,7 @@
 export const NAME = "sites";
 
 export const SET_SITES = `${NAME}/SET_SITES`;
+export const SET_SITES_BY_LANG = `${NAME}/SET_SITES_BY_LANG`;
 export const SET_CURRENT_SITE_INFO = `${NAME}/SET_CURRENT_SITE_INFO`;
 export const SET_CURRENT_SITE_PAGES = `${NAME}/SET_CURRENT_SITE_PAGES`;
 export const SET_FILTER: string | null = `${NAME}/SET_FILTER`;
@@ -8,6 +9,7 @@ export const SET_TOTAL_ITEMS: string | null = `${NAME}/SET_TOTAL_ITEMS`;
 export const SET_CURRENT_SITE_LANGUAGES: string | null = `${NAME}/SET_CURRENT_SITE_LANGUAGES`;
 export const SET_INITIAL_VALUES = `${NAME}/SET_INITIAL_VALUES`;
 export const SET_SAVED_SITE_INFO = `${NAME}/SET_SAVED_SITE_INFO`;
+export const SET_CURRENT_SITE_ERROR_PAGES = `${NAME}/SET_CURRENT_SITE_ERROR_PAGES`;
 
 export const ITEMS_PER_PAGE = 50;
 

package/src/containers/Sites/interfaces.tsx

@@ -1,5 +1,6 @@
 import {
   SET_SITES,
+  SET_SITES_BY_LANG,
   SET_CURRENT_SITE_INFO,
   SET_CURRENT_SITE_PAGES,
   SET_FILTER,
@@ -7,6 +8,7 @@ import {
   SET_CURRENT_SITE_LANGUAGES,
   SET_INITIAL_VALUES,
   SET_SAVED_SITE_INFO,
+  SET_CURRENT_SITE_ERROR_PAGES,
 } from "./constants";
 import { ISite } from "@ax/types";
 
@@ -20,6 +22,11 @@ export interface ISetSitesAction {
   payload: { sites: ISite[] };
 }
 
+export interface ISetSitesByLangAction {
+  type: typeof SET_SITES_BY_LANG;
+  payload: { sitesByLang: ISite[] };
+}
+
 export interface ISetCurrentSiteInfoAction {
   type: typeof SET_CURRENT_SITE_INFO;
   payload: { currentSiteInfo: ISite };
@@ -40,11 +47,6 @@ export interface ISetCurrentSiteLanguagesAction {
   payload: { currentSiteLanguages: any[] }; // FIXME: establecer type
 }
 
-export interface ISetCurrentSiteLanguagesAction {
-  type: typeof SET_CURRENT_SITE_LANGUAGES;
-  payload: { currentSiteLanguages: any[] }; // FIXME: establecer type
-}
-
 export interface ISetInitialValuesAction {
   type: typeof SET_INITIAL_VALUES;
   payload: { initialValues: any };
@@ -55,4 +57,9 @@ export interface ISetSavedSiteInfoAction {
   payload: { savedSiteInfo: ISite };
 }
 
+export interface ISetCurrentSiteErrorPages {
+  type: typeof SET_CURRENT_SITE_ERROR_PAGES;
+  payload: { currentSiteErrorPages: number[] };
+}
+
 export type SitesActionsCreators = ISetSitesAction & ISetCurrentSiteInfoAction;

package/src/containers/Sites/reducer.tsx

@@ -1,5 +1,6 @@
 import {
   SET_SITES,
+  SET_SITES_BY_LANG,
   SET_CURRENT_SITE_INFO,
   SET_CURRENT_SITE_PAGES,
   SET_FILTER,
@@ -7,6 +8,7 @@ import {
   SET_CURRENT_SITE_LANGUAGES,
   SET_INITIAL_VALUES,
   SET_SAVED_SITE_INFO,
+  SET_CURRENT_SITE_ERROR_PAGES,
 } from "./constants";
 
 import { ISite, IPage, ILanguage } from "@ax/types";
@@ -17,34 +19,40 @@ export interface ISitesState {
   currentSiteName: string | null;
   currentSitePages: IPage[];
   sites: ISite[];
+  sitesByLang: ISite[];
   currentSiteInfo: any;
   currentFilter: string | null;
   totalItems: number;
   currentSiteLanguages: ILanguage[];
   savedSiteInfo: any;
+  currentSiteErrorPages: number[];
 }
 
 export const initialState = {
   currentSiteName: null,
   currentSitePages: [],
   sites: [],
+  sitesByLang: [],
   currentSiteInfo: null,
   currentFilter: "unique-pages",
   totalItems: 0,
   currentSiteLanguages: [],
   savedSiteInfo: null,
+  currentSiteErrorPages: [],
 };
 
 export function reducer(state = initialState, action: SitesActionsCreators): ISitesState {
   switch (action.type) {
     case SET_FILTER:
     case SET_SITES:
+    case SET_SITES_BY_LANG:
     case SET_CURRENT_SITE_INFO:
     case SET_CURRENT_SITE_PAGES:
     case SET_TOTAL_ITEMS:
     case SET_CURRENT_SITE_LANGUAGES:
     case SET_INITIAL_VALUES:
     case SET_SAVED_SITE_INFO:
+    case SET_CURRENT_SITE_ERROR_PAGES:
       return { ...state, ...action.payload };
     default:
       return state;

package/src/containers/StructuredData/actions.tsx

@@ -36,7 +36,7 @@ import { IStructuredData, IStructuredDataContent, ICategory, IGetStructuredDataP
 import { structuredData } from "@ax/api";
 import { setTotalItems } from "@ax/containers/Sites/actions";
 import { appActions } from "@ax/containers/App";
-import { handleRequest, isEmptyArray } from "@ax/helpers";
+import { deepClone, handleRequest, isEmptyArray } from "@ax/helpers";
 import { findMandatoryStructuredDataErrors } from "@ax/forms";
 
 const { setIsLoading, setIsSaving } = appActions;
@@ -116,16 +116,12 @@ function resetForm(): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const {
       structuredData: {
-        form,
         currentStructuredData: { defaultValues },
       },
     } = getState();
 
-    form.content &&
-      Object.keys(form.content).forEach((key: string) => {
-        defaultValues && defaultValues[key] ? (form.content[key] = defaultValues[key]) : (form.content[key] = "");
-      });
-    const updatedForm = { content: form.content };
+    const updatedForm = { content: defaultValues };
+
     dispatch(setEntity(null));
     dispatch(updateForm(updatedForm));
     dispatch(setErrors([]));
@@ -499,7 +495,8 @@ function validateForm(publish?: boolean): (dispatch: Dispatch, getState: any) =>
         },
       } = getState();
 
-      const errors = findMandatoryStructuredDataErrors(content, schema);
+      const formContent = deepClone(content);
+      const errors = findMandatoryStructuredDataErrors(formContent, schema);
       dispatch(setErrors(errors));
       if (errors.length === 0) {
         !publish && dispatch(setValidated(true));

package/src/forms/index.tsx

@@ -23,7 +23,13 @@ import {
   replaceElements,
 } from "./elements";
 import { getInnerFields, getStructuredDataInnerFields } from "./fields";
-import { getValidity, findFieldsErrors, findMandatoryStructuredDataErrors } from "./validators";
+import {
+  getValidity,
+  findFieldsErrors,
+  findMandatoryStructuredDataErrors,
+  checkH1content,
+  parseValidationErrors,
+} from "./validators";
 
 export {
   parseData,
@@ -51,4 +57,6 @@ export {
   getValidity,
   findFieldsErrors,
   findMandatoryStructuredDataErrors,
+  checkH1content,
+  parseValidationErrors,
 };