@griddo/ax 1.58.6 → 1.59.2

package/src/{modules/Content/HeaderMenus/Status → components/TableFilters/StatusFilter}/index.tsx

@@ -4,9 +4,11 @@ import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
 
 import * as S from "./style";
 
-const Status = ({ sortItems, sortedState }: IStatusProps) => {
+const StatusFilter = (props: IStatusFilterProps) => {
+  const { sortItems, sortedState, isStructuredData } = props;
   const { isAscending, sortedByDate } = sortedState;
-  const sortByModifiedDate = (isAscending: boolean) => sortItems("modified", isAscending);
+  const value = isStructuredData ? "date" : "modified";
+  const sortByModifiedDate = (isAscending: boolean) => sortItems(value, isAscending);
 
   const sortOldestModifiedDate = () => sortByModifiedDate(true);
   const sortMostRecentModifiedDate = () => sortByModifiedDate(false);
@@ -39,9 +41,10 @@ const Status = ({ sortItems, sortedState }: IStatusProps) => {
   );
 };
 
-interface IStatusProps {
+interface IStatusFilterProps {
   sortedState: any;
   sortItems(orderPointer: string, isAscendent: boolean): any;
+  isStructuredData?: boolean;
 }
 
-export default Status;
+export default StatusFilter;

package/src/{modules/StructuredData/StructuredDataList/HeaderMenus/Translations → components/TableFilters/TranslationsFilter}/index.tsx

@@ -5,7 +5,7 @@ import { areEquals, isNumber } from "@ax/helpers";
 
 import * as S from "./style";
 
-const Translations = (props: ITranslationsProps): JSX.Element => {
+const TranslationsFilter = (props: ITranslationsFilterProps): JSX.Element => {
   const { filterItems, value } = props;
 
   const filters = [
@@ -52,15 +52,15 @@ const Translations = (props: ITranslationsProps): JSX.Element => {
     <FloatingMenu Button={Header} position="left" closeOnSelect={true} isCheckGroup={true}>
       <ListTitle>Filter by translations</ListTitle>
       <S.ChecksWrapper>
-        <CheckGroup options={filters} value={selectedValue} onChange={setQuery} selectAllOption={selectAllOption} />
+        <CheckGroup options={filters} value={selectedValue} onChange={setQuery} multipleSelection={false} />
       </S.ChecksWrapper>
     </FloatingMenu>
   );
 };
 
-interface ITranslationsProps {
+interface ITranslationsFilterProps {
   filterItems(pointer: string, filter: string): void;
   value: string;
 }
 
-export default Translations;
+export default TranslationsFilter;

package/src/{modules/StructuredData/StructuredDataList/HeaderMenus/Types → components/TableFilters/TypeFilter}/index.tsx

@@ -1,14 +1,11 @@
 import React, { useState } from "react";
 import { CheckGroup, FloatingMenu, Icon, ListTitle } from "@ax/components";
-import { areEquals, getGlobalPageTypes } from "@ax/helpers";
+import { areEquals } from "@ax/helpers";
 
 import * as S from "./style";
 
-const Types = ({ filterItems }: ITypesProps): JSX.Element => {
-  const globalPageTypes = getGlobalPageTypes();
-  const filters = globalPageTypes.map(({ type, title }) => ({ name: type, value: type, title }));
-  const allFilter = { name: "all", value: "all", title: "All types" };
-  filters.unshift(allFilter);
+const TypeFilter = (props: ITypeFilterProps): JSX.Element => {
+  const { filterItems, filters, pointer } = props;
 
   const initialState = ["all"];
   const selectAllOption = "all";
@@ -20,7 +17,6 @@ const Types = ({ filterItems }: ITypesProps): JSX.Element => {
     }
     setSelectedValue(selection);
     const queryFilters = selection.join("&");
-    const pointer = "types";
     filterItems(pointer, queryFilters);
   };
 
@@ -51,8 +47,16 @@ const Types = ({ filterItems }: ITypesProps): JSX.Element => {
   );
 };
 
-interface ITypesProps {
+interface IFilter {
+  name: string;
+  value: string;
+  title: string;
+}
+
+interface ITypeFilterProps {
   filterItems(pointer: string, filter: string): void;
+  filters: IFilter[];
+  pointer: string;
 }
 
-export default Types;
+export default TypeFilter;

package/src/{modules/StructuredData/StructuredDataList/HeaderMenus/Types → components/TableFilters/TypeFilter}/style.tsx

@@ -2,7 +2,7 @@ import styled from "styled-components";
 import { Header } from "@ax/components/TableList/style";
 
 const Types = styled(Header)<{ isActive: boolean }>`
-  width: 230px;
+  width: 170px;
   justify-content: center;
   &:hover {
     color: ${(p) => p.theme.color.interactive01};

package/src/components/TableFilters/index.tsx

@@ -0,0 +1,19 @@
+import CategoryFilter from "./CategoryFilter";
+import CustomizeFilters from "./CustomizeFilters";
+import LiveFilter from "./LiveFilter";
+import NameFilter from "./NameFilter";
+import SiteFilter from "./SiteFilter";
+import StatusFilter from "./StatusFilter";
+import TranslationsFilter from "./TranslationsFilter";
+import TypeFilter from "./TypeFilter";
+
+export {
+  CategoryFilter,
+  CustomizeFilters,
+  LiveFilter,
+  NameFilter,
+  SiteFilter,
+  StatusFilter,
+  TranslationsFilter,
+  TypeFilter,
+};

package/src/components/Tag/index.tsx

@@ -28,7 +28,7 @@ const Tag = (props: ITagProps): JSX.Element => {
       );
     default:
       return (
-        <S.TagFixed>
+        <S.TagFixed color={color}>
           <S.TagText>
             <S.Title>{text}</S.Title>
             {deleteIcon}

package/src/components/Tag/style.tsx

@@ -1,19 +1,19 @@
 import styled from "styled-components";
 
 export const TagStatus = styled.div`
-  ${p => p.theme.textStyle.uiXS};
+  ${(p) => p.theme.textStyle.uiXS};
   background-color: #ffffff;
-  border: 1px solid ${p => p.theme.color.uiLine};
+  border: 1px solid ${(p) => p.theme.color.uiLine};
   box-sizing: border-box;
   border-radius: ${(p) => p.theme.spacing.s};
-  color: ${p => p.theme.color.textMediumEmphasis};
+  color: ${(p) => p.theme.color.textMediumEmphasis};
   display: inline-block;
   padding: 3px 8px;
   text-transform: capitalize;
 `;
 
 export const Bullet = styled.span<{ color: string | undefined }>`
-  background-color: ${p => (p.color ? p.color : `#4096D6`)};
+  background-color: ${(p) => (p.color ? p.color : `#4096D6`)};
   display: inline-block;
   width: 8px;
   height: 8px;
@@ -21,20 +21,19 @@ export const Bullet = styled.span<{ color: string | undefined }>`
   margin-right: 4px;
 `;
 
-export const TagFixed = styled.div`
-  ${p => p.theme.textStyle.uiS};
-  background-color: ${p => p.theme.color.interactive02};
+export const TagFixed = styled.div<{ color: string | undefined }>`
+  ${(p) => p.theme.textStyle.uiS};
+  background-color: ${(p) => (p.color ? p.color : p.theme.color.interactive02)};
   border-radius: ${(p) => p.theme.spacing.s};
   box-sizing: border-box;
-  color: ${p => p.theme.color.textMediumEmphasis};
+  color: ${(p) => p.theme.color.textMediumEmphasis};
   display: inline-block;
   padding: 3px 8px;
   margin-right: ${(p) => p.theme.spacing.xxs};
   margin-bottom: ${(p) => p.theme.spacing.xxs};
 `;
 
-export const Title = styled.div`
-`;
+export const Title = styled.div``;
 
 export const IconWrapper = styled.div`
   height: 16px;
@@ -42,7 +41,7 @@ export const IconWrapper = styled.div`
   cursor: pointer;
   svg {
     path {
-      fill: ${p => p.theme.color.textMediumEmphasis};
+      fill: ${(p) => p.theme.color.textMediumEmphasis};
     }
   }
 `;

package/src/components/index.tsx

@@ -30,6 +30,16 @@ import {
   Wysiwyg,
 } from "./Fields";
 import { ListTitle, ListItem } from "./Lists";
+import {
+  CategoryFilter,
+  CustomizeFilters,
+  LiveFilter,
+  NameFilter,
+  SiteFilter,
+  StatusFilter,
+  TranslationsFilter,
+  TypeFilter,
+} from "./TableFilters";
 
 import ActionMenu from "./ActionMenu";
 import Avatar from "./Avatar";
@@ -110,6 +120,15 @@ export {
   //Lists
   ListTitle,
   ListItem,
+  //Filters
+  CategoryFilter,
+  CustomizeFilters,
+  LiveFilter,
+  NameFilter,
+  SiteFilter,
+  StatusFilter,
+  TranslationsFilter,
+  TypeFilter,
   // Components
   ActionMenu,
   Avatar,

package/src/containers/Domains/actions.tsx

@@ -0,0 +1,51 @@
+import { domains } from "@ax/api";
+import { appActions } from "@ax/containers/App";
+import { handleRequest } from "@ax/helpers";
+import { IDomainRobot } from "@ax/types";
+import { SET_DOMAINS_ROBOTS } from "./constants";
+import { ISetDomainsRobots } from "./interfaces";
+
+function setDomainsRobots(robots: IDomainRobot[]): ISetDomainsRobots {
+  return { type: SET_DOMAINS_ROBOTS, payload: { robots } };
+}
+
+function getDomainsRobots(): (dispatch: any) => Promise<void> {
+  return async (dispatch) => {
+    try {
+      const callback = async () => domains.getDomainsRobots();
+
+      const responseActions = {
+        handleSuccess: (response: any) => {
+          dispatch(setDomainsRobots(response));
+        },
+        handleError: (response: any) => appActions.handleError(response)(dispatch),
+      };
+
+      await handleRequest(callback, responseActions, [appActions.setIsLoading])(dispatch);
+    } catch (e) {
+      console.log(e);
+    }
+  };
+}
+
+function updateDomainsRobots(robots: IDomainRobot[]): (dispatch: any) => Promise<boolean> {
+  return async (dispatch) => {
+    try {
+      const callback = async () => domains.updateDomainsRobots(robots);
+
+      const responseActions = {
+        handleSuccess: () => {
+          dispatch(getDomainsRobots());
+        },
+        handleError: (response: any) => appActions.handleError(response)(dispatch),
+      };
+
+      return await handleRequest(callback, responseActions, [appActions.setIsSaving])(dispatch);
+    } catch (e) {
+      console.log(e);
+      return false;
+    }
+  };
+}
+
+export { getDomainsRobots, updateDomainsRobots };

package/src/containers/Domains/constants.tsx

@@ -0,0 +1,5 @@
+const NAME = "domains";
+
+const SET_DOMAINS_ROBOTS = `${NAME}/SET_DOMAINS_ROBOTS`;
+
+export { NAME, SET_DOMAINS_ROBOTS };

package/src/containers/Domains/index.tsx

@@ -0,0 +1,4 @@
+import * as domainsActions from "./actions";
+import { domainsReducer } from "./reducer";
+
+export { domainsActions, domainsReducer };

package/src/containers/Domains/interfaces.tsx

@@ -0,0 +1,9 @@
+import { IDomainRobot } from "@ax/types";
+import { SET_DOMAINS_ROBOTS } from "./constants";
+
+export interface ISetDomainsRobots {
+  type: typeof SET_DOMAINS_ROBOTS;
+  payload: { robots: IDomainRobot[] };
+}
+
+export type DomainsActionsCreators = ISetDomainsRobots;

package/src/containers/Domains/reducer.tsx

@@ -0,0 +1,22 @@
+import { IDomainRobot } from "@ax/types";
+import { SET_DOMAINS_ROBOTS } from "./constants";
+import { DomainsActionsCreators } from "./interfaces";
+
+export interface IDomainsState {
+  robots: IDomainRobot[];
+}
+
+export const initialState = {
+  robots: [],
+};
+
+export function reducer(state = initialState, action: DomainsActionsCreators): IDomainsState {
+  switch (action.type) {
+    case SET_DOMAINS_ROBOTS:
+      return { ...state, ...action.payload };
+    default:
+      return state;
+  }
+}
+
+export { initialState as domainsInitialState, reducer as domainsReducer };

package/src/containers/Gallery/actions.tsx

@@ -137,7 +137,6 @@ function updateImage(
     try {
       const result = await images.updateImage(imageID, imageData);
       if (isReqOk(result.status)) {
-        console.log(result.data, "data");
         dispatch(setData({ ...result.data, isImageSelected: false, imageSelected: null }));
       }
     } catch (e) {

package/src/containers/PageEditor/actions.tsx

@@ -779,6 +779,13 @@ function updateBreadcrumb(editorID: number): any {
     const isFiltered = true;
     const newBreadcrumb = getNewBreadcrumb(editorContent, editorID, isFiltered);
 
+    const { header, footer } = editorContent;
+    const navigationIds = [header?.editorID, footer?.editorID];
+    if (navigationIds.includes(editorID)) {
+      const rootBreadcrumb = { editorID: 0, displayName: 'Page', component: 'Page' };
+      newBreadcrumb.unshift(rootBreadcrumb);
+    }
+
     dispatch(setBreadcrumb(newBreadcrumb));
   };
 }

package/src/containers/PageEditor/utils.tsx

@@ -30,7 +30,7 @@ export const getPageData = (getState: any, deleted: boolean, params = getPagePar
 
 const getTemplateValues = (template: any) => {
   const sections = Object.keys(template)
-    .map((key: string) => template[key])
+    .map((key: string) => ({ ...template[key], key }))
     .filter((value: any) => typeof value === "object" && value !== null && value.component === "Section");
 
   return sections;

package/src/containers/Settings/Languages/constants.tsx

@@ -1,6 +1,6 @@
-const NAME: string = "languages";
+const NAME = "languages";
 
-const CREATE_FORM: string = `${NAME}/CREATE_FORM`;
-const UPDATE_FORM: string = `${NAME}/UPDATE_FORM`;
+const CREATE_FORM = `${NAME}/CREATE_FORM`;
+const UPDATE_FORM = `${NAME}/UPDATE_FORM`;
 
 export { NAME, CREATE_FORM, UPDATE_FORM };

package/src/containers/Settings/Languages/index.tsx

@@ -1,7 +1,4 @@
 import * as languagesActions from "./actions";
-import { languagesReducer } from "./reducer";
+import { languagesReducer } from "./reducer";
 
-export {
-  languagesActions,
-  languagesReducer
-};
+export { languagesActions, languagesReducer };

package/src/containers/Sites/actions.tsx

@@ -261,13 +261,14 @@ function getFilteredContent(filter: any): (dispatch: any, getState: any) => Prom
 
 function getSitePages(
   params: IGetSitePagesParams,
-  structuredData?: string | undefined
+  structuredData?: string,
+  filterQuery?: string
 ): (dispatch: any) => Promise<void> {
   return async (dispatch) => {
     try {
       dispatch(setIsLoading(true));
       const response: any = structuredData
-        ? await sites.getStructuredSitePages(params, structuredData)
+        ? await sites.getStructuredSitePages(params, structuredData, filterQuery)
         : await sites.getSitePages(params);
 
       if (isReqOk(response.status)) {

package/src/containers/StructuredData/actions.tsx

@@ -13,6 +13,8 @@ import {
   DEFAULT_PARAMS,
   SET_FILTER,
   SET_SCHEMA_VERSION,
+  SET_ERRORS,
+  SET_VALIDATED,
 } from "./constants";
 
 import {
@@ -24,13 +26,16 @@ import {
   ISetCategory,
   ISetFilter,
   ISetSchemaVersion,
+  ISetErrors,
+  ISetValidated,
 } from "./interfaces";
 import { prepareStructuredDataContent, getTaxonomies, filterStructuredDataByID, getTypes } from "./utils";
-import { IStructuredData, IStructuredDataContent, ICategory, IGetStructuredDataParams } from "@ax/types";
+import { IStructuredData, IStructuredDataContent, ICategory, IGetStructuredDataParams, IErrorItem } from "@ax/types";
 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 { findMandatoryStructuredDataErrors } from "@ax/forms";
 
 const { setIsLoading, setIsSaving } = appActions;
 
@@ -83,6 +88,14 @@ function setSchemaVersion(schemaVersion: string): ISetSchemaVersion {
   return { type: SET_SCHEMA_VERSION, payload: { schemaVersion } };
 }
 
+function setErrors(errors: IErrorItem[]): ISetErrors {
+  return { type: SET_ERRORS, payload: { errors } };
+}
+
+function setValidated(validated: boolean): ISetValidated {
+  return { type: SET_VALIDATED, payload: { validated } };
+}
+
 function updateFormValue(valueObj: any): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const {
@@ -109,6 +122,8 @@ function resetForm(): (dispatch: Dispatch, getState: any) => void {
     const updatedForm = { content: form.content };
     dispatch(setEntity(null));
     dispatch(updateForm(updatedForm));
+    dispatch(setErrors([]));
+    dispatch(setValidated(false));
   };
 }
 
@@ -320,7 +335,7 @@ function createStructuredDataContent(
 
 function updateStructuredDataContent(
   structuredDataContent: IStructuredDataContent
-): (dispatch: Dispatch) => Promise<void> {
+): (dispatch: Dispatch) => Promise<boolean> {
   return async (dispatch) => {
     try {
       const dataContent = prepareStructuredDataContent(structuredDataContent);
@@ -332,9 +347,10 @@ function updateStructuredDataContent(
 
       const callback = async () => structuredData.updateDataContent(structuredDataContent.id, dataContent);
 
-      await handleRequest(callback, responseActions, [appActions.setIsSaving])(dispatch);
+      return await handleRequest(callback, responseActions, [appActions.setIsSaving])(dispatch);
     } catch (e) {
       console.log(e); // TODO: capturar error bien
+      return false;
     }
   };
 }
@@ -467,6 +483,47 @@ function setStatusStructuredDataContent(
   };
 }
 
+function validateForm(): (dispatch: Dispatch, getState: any) => Promise<boolean> {
+  return async (dispatch, getState) => {
+    try {
+      const {
+        structuredData: {
+          form: { content },
+          schema,
+        },
+      } = getState();
+
+      const errors = findMandatoryStructuredDataErrors(content, schema);
+      dispatch(setErrors(errors));
+      if (errors.length === 0) {
+        dispatch(setValidated(true));
+      } else {
+        dispatch(setValidated(false));
+      }
+      return true;
+    } catch (e) {
+      console.log(e);
+      return false;
+    }
+  };
+}
+
+function deleteError(error: IErrorItem): (dispatch: Dispatch, getState: any) => void {
+  return async (dispatch, getState) => {
+    try {
+      const {
+        structuredData: { errors },
+      } = getState();
+
+      const updatedErrors = errors.filter((err: IErrorItem) => error.key !== err.key);
+
+      dispatch(setErrors(updatedErrors));
+    } catch (e) {
+      console.log(e);
+    }
+  };
+}
+
 export {
   setIsActive,
   setCategories,
@@ -495,4 +552,6 @@ export {
   setStatusStructuredDataContent,
   filterStructuredData,
   setFilter,
+  validateForm,
+  deleteError,
 };

package/src/containers/StructuredData/constants.tsx

@@ -12,6 +12,8 @@ const UPDATE_FORM = `${NAME}/UPDATE_FORM`;
 const SET_ENTITY = `${NAME}/SET_ENTITY`;
 const SET_FILTER: string | null = `${NAME}/SET_FILTER`;
 const SET_SCHEMA_VERSION: string | null = `${NAME}/SET_SCHEMA_VERSION`;
+const SET_ERRORS = `${NAME}/SET_ERRORS`;
+const SET_VALIDATED = `${NAME}/SET_VALIDATED`;
 
 const ITEMS_PER_PAGE = 50;
 
@@ -39,4 +41,6 @@ export {
   DEFAULT_PARAMS,
   SET_FILTER,
   SET_SCHEMA_VERSION,
+  SET_ERRORS,
+  SET_VALIDATED,
 };

package/src/containers/StructuredData/interfaces.tsx

@@ -9,9 +9,11 @@ import {
   SET_CATEGORY,
   SET_FILTER,
   SET_SCHEMA_VERSION,
+  SET_ERRORS,
+  SET_VALIDATED,
 } from "./constants";
 
-import { IStructuredData, IStructuredDataContent, ICategory } from "@ax/types";
+import { IStructuredData, IStructuredDataContent, ICategory, IErrorItem } from "@ax/types";
 
 export interface ISetCategories {
   type: typeof SET_CATEGORIES;
@@ -62,6 +64,16 @@ export interface ISetSchemaVersion {
   payload: { schemaVersion: string };
 }
 
+export interface ISetErrors {
+  type: typeof SET_ERRORS;
+  payload: { errors: IErrorItem[] };
+}
+
+export interface ISetValidated {
+  type: typeof SET_VALIDATED;
+  payload: { validated: boolean };
+}
+
 export type CategoryActionsCreators = ISetCategories & ISetCurrentData;
 
 export type StructuredDataActionsCreators = CategoryActionsCreators &

package/src/containers/StructuredData/reducer.tsx

@@ -1,4 +1,4 @@
-import { IStructuredData, IStructuredDataContent, ICategory } from "@ax/types";
+import { IStructuredData, IStructuredDataContent, ICategory, IErrorItem } from "@ax/types";
 import {
   SET_CATEGORIES,
   SET_STRUCTURED_DATA,
@@ -12,6 +12,8 @@ import {
   SET_ENTITY,
   SET_FILTER,
   SET_SCHEMA_VERSION,
+  SET_ERRORS,
+  SET_VALIDATED,
 } from "./constants";
 
 import { StructuredDataActionsCreators } from "./interfaces";
@@ -28,6 +30,8 @@ export interface IStructuredDataState {
   entity: string | null;
   currentFilter: string;
   schemaVersion: string;
+  errors: IErrorItem[];
+  validated: boolean;
 }
 
 export const initialState = {
@@ -42,6 +46,8 @@ export const initialState = {
   entity: null,
   currentFilter: "all-pages",
   schemaVersion: "",
+  errors: [],
+  validated: false,
 };
 
 export function reducer(state = initialState, action: StructuredDataActionsCreators): IStructuredDataState {
@@ -58,6 +64,8 @@ export function reducer(state = initialState, action: StructuredDataActionsCreat
     case SET_ENTITY:
     case SET_FILTER:
     case SET_SCHEMA_VERSION:
+    case SET_ERRORS:
+    case SET_VALIDATED:
       return { ...state, ...action.payload };
     default:
       return state;

package/src/forms/editor.tsx

@@ -116,6 +116,8 @@ const cleanPageValues = (updatedValues: any, originalValues: any) => {
   delete updatedValues["hash"];
   delete updatedValues["editing"];
   delete updatedValues["pageLanguages"];
+  delete updatedValues["availableSites"];
+  delete updatedValues["fullUrl"];
 
   delete originalValues["setAsHome"];
   delete originalValues["modified"];
@@ -128,6 +130,8 @@ const cleanPageValues = (updatedValues: any, originalValues: any) => {
   delete originalValues["hash"];
   delete originalValues["editing"];
   delete originalValues["pageLanguages"];
+  delete originalValues["availableSites"];
+  delete originalValues["fullUrl"];
 
   return {
     cleanUpdatedValues: updatedValues,

package/src/forms/elements.tsx

@@ -68,7 +68,7 @@ const getUpdatedComponents = (sections: any, component: any, key: string) => {
 const getUpdatedSections = (sections: any[], id: number, moduleType: string) => {
   let selectedIndex = 0;
   const sectionEntries = sections.map((section: any, index: number) => {
-    const { name, component, modules } = section;
+    const { modules, key } = section;
     if (isSelectedEditorID(section, id)) {
       selectedIndex = index;
       const newModule = getDefaultSchema(moduleType);
@@ -76,10 +76,7 @@ const getUpdatedSections = (sections: any[], id: number, moduleType: string) =>
       section.modules = [...updatedModules];
     }
 
-    const text = name ? name : component;
-    const sectionKey = camelize(text);
-
-    return [sectionKey, section];
+    return [key, section];
   });
   const updatedSections = Object.fromEntries(sectionEntries);