@griddo/ax 10.3.23 → 10.3.25

package/src/__tests__/components/TableFilters/StatusFilter/StatusFilter.test.tsx

@@ -7,13 +7,14 @@ import { render, screen, cleanup, fireEvent } from "@testing-library/react";
 import { parseTheme } from "@ax/helpers";
 import globalTheme from "@ax/themes/theme.json";
 import StatusFilter, { IStatusFilterProps } from "@ax/components/TableFilters/StatusFilter";
+import { IQueryValue } from "@ax/types";
 
 afterEach(cleanup);
 const defaultProps = mock<IStatusFilterProps>();
 describe("StatusFilter component rendering", () => {
   it("should render date filter", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: false, sortedByDate: false, sortedByTitle: false, sortedByURL: false };
     defaultProps.sortItems = onClickMock;
     defaultProps.isStructuredData = false;
@@ -30,8 +31,8 @@ describe("StatusFilter component rendering", () => {
   });
 
   it("should render interactive arrow if not filter selected", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: false, sortedByDate: false, sortedByTitle: false, sortedByURL: false };
     defaultProps.sortItems = onClickMock;
     defaultProps.isStructuredData = false;
@@ -47,8 +48,8 @@ describe("StatusFilter component rendering", () => {
   });
 
   it("should render FullArrowDown icon if is filtered by most recent", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: false, sortedByDate: true, sortedByTitle: false, sortedByURL: false };
     defaultProps.sortItems = onClickMock;
     defaultProps.isStructuredData = false;
@@ -68,8 +69,8 @@ describe("StatusFilter events", () => {
   it("should render check group on click", () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: false, sortedByDate: false };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
         <StatusFilter {...defaultProps} />
@@ -88,8 +89,8 @@ describe("StatusFilter events", () => {
   it("should call sortItems function with 'modified, true' as param when it's not structured data and is ascending", async () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: false, sortedByDate: false };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
         <StatusFilter {...defaultProps} />
@@ -108,14 +109,14 @@ describe("StatusFilter events", () => {
     fireEvent.click(listItems[1]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
     const isAscending = true;
-    expect(onClickMock).toBeCalledWith("modified", isAscending);
+    expect(onClickMock).toBeCalledWith([{ label: "modified", value: "modified" }], isAscending);
   });
 
   it("should call sortItems function with 'date, true' as param when it's not structured data and is asceding", async () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: false, sortedByDate: false };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.isStructuredData = true;
 
     render(
@@ -135,14 +136,14 @@ describe("StatusFilter events", () => {
 
     fireEvent.click(listItems[1]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
-    expect(onClickMock).toBeCalledWith("date", true);
+    expect(onClickMock).toBeCalledWith([{ label: "date", value: "date" }], true);
   });
 
   it("should call sortItems function with 'modified, false' as param when it's not structured data and is not ascending", async () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: false, sortedByDate: false };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.isStructuredData = false;
 
     render(
@@ -163,14 +164,14 @@ describe("StatusFilter events", () => {
     fireEvent.click(listItems[0]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
     const isAscending = false;
-    expect(onClickMock).toBeCalledWith("modified", isAscending);
+    expect(onClickMock).toBeCalledWith([{ label: "modified", value: "modified" }], isAscending);
   });
 
   it("should call sortItems function with 'date, false' as param when it's not structured data and is not asceding", async () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: false, sortedByDate: false };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.isStructuredData = true;
 
     render(
@@ -190,6 +191,6 @@ describe("StatusFilter events", () => {
 
     fireEvent.click(listItems[0]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
-    expect(onClickMock).toBeCalledWith("date", false);
+    expect(onClickMock).toBeCalledWith([{ label: "date", value: "date" }], false);
   });
 });

package/src/__tests__/components/TableFilters/TranslationsFilter/TranslationsFilter.test.tsx

@@ -9,14 +9,15 @@ import { parseTheme } from "@ax/helpers";
 
 import globalTheme from "@ax/themes/theme.json";
 import TranslationsFilter, { ITranslationsFilterProps } from "@ax/components/TableFilters/TranslationsFilter";
+import { IQueryValue } from "@ax/types";
 
 afterEach(cleanup);
 const defaultProps = mock<ITranslationsFilterProps>();
 describe("TranslationsFilter component rendering", () => {
   it("should render name filter", () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
 
     render(
@@ -31,9 +32,9 @@ describe("TranslationsFilter component rendering", () => {
   });
 
   it("should render icon's wrapper", () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -46,9 +47,9 @@ describe("TranslationsFilter component rendering", () => {
   });
 
   it("should render options", async () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -70,9 +71,9 @@ describe("TranslationsFilter component rendering", () => {
 
 describe("TranslationsFilter events", () => {
   it("should render check group on click", () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -90,9 +91,9 @@ describe("TranslationsFilter events", () => {
   });
 
   it("should call filterItems with 'all' on click 'All' option", async () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -108,13 +109,13 @@ describe("TranslationsFilter events", () => {
 
     fireEvent.click(checksFieldInputs[0]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
-    expect(onClickMock).toBeCalledWith("translated", "all");
+    expect(onClickMock).toBeCalledWith("translated", [{ label: "All", value: "all" }]);
   });
 
   it("should call filterItems with 'no' on click 'Not translated content' option", async () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -130,13 +131,13 @@ describe("TranslationsFilter events", () => {
 
     fireEvent.click(checksFieldInputs[1]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
-    expect(onClickMock).toBeCalledWith("translated", "no");
+    expect(onClickMock).toBeCalledWith("translated", [{ label: "Not translated content", value: "no" }]);
   });
 
   it("should close floating menu when option is checked", async () => {
-    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]> &
-      ((pointer: string, filter: string) => void);
-    defaultProps.value = "all";
+    const onClickMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]> &
+      ((pointer: string, filter: IQueryValue[]) => void);
+    defaultProps.value = [{ value: "all", label: "All" }];
     defaultProps.filterItems = onClickMock;
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>

package/src/__tests__/components/TableFilters/TypeFilter/TypeFilter.test.tsx

@@ -7,6 +7,7 @@ import { render, screen, cleanup, fireEvent } from "@testing-library/react";
 import TypeFilter, { ITypeFilterProps } from "@ax/components/TableFilters/TypeFilter";
 import globalTheme from "@ax/themes/theme.json";
 import { parseTheme } from "@ax/helpers";
+import { IQueryValue } from "@ax/types";
 
 afterEach(cleanup);
 
@@ -31,7 +32,7 @@ describe("TypeFilter component rendering", () => {
       },
     ];
     defaultProps.pointer = "type";
-    defaultProps.filterItems = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]>;
+    defaultProps.filterItems = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]>;
 
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -65,7 +66,7 @@ describe("TypeFilter events", () => {
       },
     ];
     defaultProps.pointer = "type";
-    defaultProps.filterItems = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]>;
+    defaultProps.filterItems = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]>;
 
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -103,7 +104,7 @@ describe("TypeFilter events", () => {
       },
     ];
     defaultProps.pointer = "type";
-    const onChangeMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]>;
+    const onChangeMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]>;
     defaultProps.filterItems = onChangeMock;
 
     render(
@@ -144,7 +145,7 @@ describe("TypeFilter events", () => {
       },
     ];
     defaultProps.pointer = "type";
-    const onChangeMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: string]>;
+    const onChangeMock = jest.fn() as CalledWithMock<void, [pointer: string, filter: IQueryValue[]]>;
     defaultProps.filterItems = onChangeMock;
 
     render(
@@ -160,6 +161,6 @@ describe("TypeFilter events", () => {
     const checkFieldInputs = screen.queryAllByTestId("check-field-input");
     fireEvent.click(checkFieldInputs[1]);
     expect(onChangeMock).toHaveBeenCalledTimes(1);
-    expect(onChangeMock).toBeCalledWith("type", "unique");
+    expect(onChangeMock).toBeCalledWith("type", [{ label: "Basic templates", value: "unique" }]);
   });
 });

package/src/__tests__/components/TableFilters/UsersFilter/UsersFilter.test.tsx

@@ -8,13 +8,14 @@ import { render, screen, cleanup, fireEvent } from "@testing-library/react";
 import { parseTheme } from "@ax/helpers";
 import globalTheme from "@ax/themes/theme.json";
 import UsersFilter, { IUsersFilterProps } from "@ax/components/TableFilters/UsersFilter";
+import { IQueryValue } from "@ax/types";
 
 afterEach(cleanup);
 const defaultProps = mock<IUsersFilterProps>();
 describe("UsersFilter component rendering", () => {
   it("should render users filter", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: true, sortedByTitle: false, sortedByUsers: true };
 
     defaultProps.sortItems = onClickMock;
@@ -31,8 +32,8 @@ describe("UsersFilter component rendering", () => {
   });
 
   it("should render interactive arrow if not filter selected", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: true, sortedByTitle: false, sortedByUsers: false };
     defaultProps.sortItems = onClickMock;
 
@@ -47,8 +48,8 @@ describe("UsersFilter component rendering", () => {
   });
 
   it("should not render interactive arrow if filter selected", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: false, sortedByTitle: false, sortedByUsers: true };
     defaultProps.sortItems = onClickMock;
 
@@ -63,8 +64,8 @@ describe("UsersFilter component rendering", () => {
   });
 
   it("should render FullArrowUp icon if is filtered by ascending users", () => {
-    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    const onClickMock = jest.fn() as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
     defaultProps.sortedState = { isAscending: true, sortedByTitle: false, sortedByUsers: true };
     defaultProps.sortItems = onClickMock;
 
@@ -83,8 +84,8 @@ describe("UsersFilter events", () => {
   it("should render check group on click", () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: true, sortedByTitle: false, sortedByUsers: true };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
 
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -106,8 +107,8 @@ describe("UsersFilter events", () => {
   it("should call filterItems with isAscending on click 'Ascendent' option", async () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: true, sortedByTitle: false, sortedByUsers: true };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
 
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -124,14 +125,14 @@ describe("UsersFilter events", () => {
     fireEvent.click(listItems[0]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
     const isAscending = true;
-    expect(onClickMock).toBeCalledWith("users", isAscending);
+    expect(onClickMock).toBeCalledWith([{ label: "users", value: "users" }], isAscending);
   });
 
   it("should call filterItems with isAscending false on click 'Descendent' option", async () => {
     const onClickMock = jest.fn();
     defaultProps.sortedState = { isAscending: true, sortedByTitle: false, sortedByUsers: true };
-    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: string, isAscendent: boolean]> &
-      ((orderPointer: string, isAscendent: boolean) => any);
+    defaultProps.sortItems = onClickMock as CalledWithMock<any, [orderPointer: IQueryValue[], isAscendent: boolean]> &
+      ((orderPointer: IQueryValue[], isAscendent: boolean) => any);
 
     render(
       <ThemeProvider theme={parseTheme(globalTheme)}>
@@ -148,6 +149,6 @@ describe("UsersFilter events", () => {
     fireEvent.click(listItems[1]);
     expect(onClickMock).toHaveBeenCalledTimes(1);
     const isAscending = false;
-    expect(onClickMock).toBeCalledWith("users", isAscending);
+    expect(onClickMock).toBeCalledWith([{ label: "users", value: "users" }], isAscending);
   });
 });

package/src/api/sites.tsx

@@ -132,7 +132,7 @@ const getAllSites = async (params: IGetSitesParams = { recentSitesNumber: 7 }) =
   if (searchQuery && searchQuery.trim() !== "") {
     SERVICES.GET_ALL_SITES.dynamicUrl = `${SERVICES.GET_ALL_SITES.dynamicUrl}${searchQuery}`;
   }
-  
+
   if (token) {
     return sendInitialRequest(SERVICES.GET_ALL_SITES, token, { recentSitesNumber: 7 });
   } else {
@@ -147,7 +147,7 @@ const getSiteInfo = async (siteID: number) => {
   return sendRequest(SERVICES.GET_SITE_INFO);
 };
 
-const getStructuredSitePages = async (params: IGetSitePagesParams, structuredData: string, filterQuery?: string) => {
+const getStructuredSitePages = async (params: IGetSitePagesParams, structuredData: string, filterQuery = "") => {
   const {
     host,
     endpoint: [prefix, suffix],
@@ -155,9 +155,7 @@ const getStructuredSitePages = async (params: IGetSitePagesParams, structuredDat
 
   const { siteID, deleted, page, itemsPerPage, query, format } = params;
 
-  const filters = filterQuery ? `${filterQuery}&` : "?";
-
-  SERVICES.GET_SITE_STRUCTURED_PAGES.dynamicUrl = `${host}${prefix}${siteID}${suffix}${structuredData}${filters}deleted=${deleted}&page=${page}&itemsPerPage=${itemsPerPage}`;
+  SERVICES.GET_SITE_STRUCTURED_PAGES.dynamicUrl = `${host}${prefix}${siteID}${suffix}${structuredData}?deleted=${deleted}&page=${page}&itemsPerPage=${itemsPerPage}${filterQuery}`;
 
   if (query && query.trim() !== "")
     SERVICES.GET_SITE_STRUCTURED_PAGES.dynamicUrl = SERVICES.GET_SITE_STRUCTURED_PAGES.dynamicUrl + `&query=${query}`;
@@ -167,7 +165,7 @@ const getStructuredSitePages = async (params: IGetSitePagesParams, structuredDat
   return sendRequest(SERVICES.GET_SITE_STRUCTURED_PAGES);
 };
 
-const getSitePages = async (params: IGetSitePagesParams, filterQuery?: string): Promise<AxiosResponse> => {
+const getSitePages = async (params: IGetSitePagesParams, filterQuery = ""): Promise<AxiosResponse> => {
   const {
     host,
     endpoint: [prefix, suffix],
@@ -176,9 +174,7 @@ const getSitePages = async (params: IGetSitePagesParams, filterQuery?: string):
   const { siteID, deleted, page, itemsPerPage, query, filterStructuredData, lang, format, filterPages, ignoreLang } =
     params;
 
-  const filters = filterQuery ? `${filterQuery}&` : "?";
-
-  SERVICES.GET_SITE_PAGES.dynamicUrl = `${host}${prefix}${siteID}${suffix}${filters}deleted=${deleted}`;
+  SERVICES.GET_SITE_PAGES.dynamicUrl = `${host}${prefix}${siteID}${suffix}?deleted=${deleted}${filterQuery}`;
 
   if (page && itemsPerPage)
     SERVICES.GET_SITE_PAGES.dynamicUrl =

package/src/components/Button/index.tsx

@@ -21,7 +21,9 @@ const Button = (props: IButtonProps): JSX.Element => {
     }
   };
 
-  let iconWrapper = icon ? <Icon name={icon} /> : loader ? <Loader name={loader} /> : <></>;
+  const iconSize = buttonStyle === buttonStyles.MINIMAL ? "16" : "24";
+
+  let iconWrapper = icon ? <Icon name={icon} size={iconSize} /> : loader ? <Loader name={loader} /> : <></>;
   let iconBackWrapper = backIcon ? <Icon name={backIcon} /> : <></>;
 
   const buttonContent = (

package/src/components/Button/style.tsx

@@ -129,6 +129,12 @@ const MinimalButton = styled.button`
   color: ${(p) => p.theme.color.interactive01};
   border: none;
   cursor: pointer;
+  span {
+    display: flex;
+    span {
+      padding-left: ${(p) => p.theme.spacing.xxs};
+    }
+  }
 `;
 
 const Label = styled.span<{ icon?: string; backIcon?: string }>`

package/src/components/ConfigPanel/Form/ConnectedField/PageConnectedField/TemplateManager/index.tsx

@@ -37,7 +37,7 @@ export const TemplateManager = (props: IProps): JSX.Element => {
   const modulesDataPacks = activatedPacks.map((pack: IDataPack) => pack.modules).flat();
 
   const getFieldProps = (field: ISchemaField) => {
-    const { key, type, whiteList = [], slugTo, readonly } = field;
+    const { key, type, whiteList = [], slugTo, readonly, disabled } = field;
     const isArr = type === "ComponentArray";
     const currentContent = isArr ? templateContent[key] : templateContent;
     const fieldObjKey = !isArr ? `${key}` : `modules`;
@@ -72,7 +72,7 @@ export const TemplateManager = (props: IProps): JSX.Element => {
       handleUpdate,
       error,
       readonly,
-      disabledField: isComputedField,
+      disabledField: isComputedField || disabled,
     };
   };
 

package/src/components/ConfigPanel/Form/ConnectedField/PageConnectedField/index.tsx

@@ -75,7 +75,7 @@ const PageConnectedField = (props: any) => {
   const isDisabled =
     (!isGlobal &&
       (isModuleDisabled(selectedContent.component, componentType, activatedModules) || !isTemplateActivated)) ||
-    isFieldReadOnly;
+    isFieldReadOnly || field.disabled;
 
   const isMetaTitleModified = selectedContent.metaTitle && selectedContent.metaTitle !== selectedContent.title;
 

package/src/components/Fields/ArrayFieldGroup/ArrayFieldInline/index.tsx

@@ -6,7 +6,7 @@ import { ISite } from "@ax/types";
 import * as S from "./style";
 
 const ArrayFieldInline = (props: IProps): JSX.Element => {
-  const { fields, item, index, onChange, handleDelete, site } = props;
+  const { fields, item, index, onChange, handleDelete, site, disabled } = props;
 
   const deleteItem = () => handleDelete(index);
 
@@ -30,7 +30,7 @@ const ArrayFieldInline = (props: IProps): JSX.Element => {
     <S.Wrapper data-testid="arrayFieldInline">
       <S.Content>
         <S.IconWrapper>
-          <IconAction icon="delete" onClick={deleteItem} size="s" />
+          <IconAction icon="delete" onClick={deleteItem} size="s" disabled={disabled} />
         </S.IconWrapper>
         {getFields(fields)}
       </S.Content>
@@ -45,6 +45,7 @@ interface IProps {
   onChange: (value: Record<string, unknown>) => void;
   handleDelete: (index: number) => void;
   site: ISite | null;
+  disabled?: boolean;
 }
 
 export default ArrayFieldInline;

package/src/components/Fields/ArrayFieldGroup/ArrayFieldItem/index.tsx

@@ -4,7 +4,7 @@ import { ISite } from "@ax/types";
 import * as S from "./style";
 
 const ArrayFieldItem = (props: IProps): JSX.Element => {
-  const { fields, item, name, index, onChange, handleDelete, isOpen, setIsOpen, site } = props;
+  const { fields, item, name, index, onChange, handleDelete, isOpen, setIsOpen, site, disabled } = props;
 
   const handleClick = () => (isOpen === index ? setIsOpen(null) : setIsOpen(index));
 
@@ -15,6 +15,7 @@ const ArrayFieldItem = (props: IProps): JSX.Element => {
       label: "Delete",
       icon: "delete",
       action: deleteItem,
+      disabled
     },
   ];
 
@@ -63,6 +64,7 @@ interface IProps {
   isOpen: number | null;
   setIsOpen: (index: number | null) => void;
   site: ISite | null;
+  disabled?: boolean;
 }
 
 export default ArrayFieldItem;

package/src/components/Fields/ArrayFieldGroup/index.tsx

@@ -9,7 +9,7 @@ import ArrayFieldInline from "./ArrayFieldInline";
 import * as S from "./style";
 
 const ArrayFieldGroup = (props: IProps): JSX.Element => {
-  const { value, name, innerFields, onChange, divider, arrayType, site } = props;
+  const { value, name, innerFields, onChange, divider, arrayType, site, disabled } = props;
 
   const initialValue = value ? Object.values(value) : [];
   const initialValueMapped = initialValue.map((val: any) => {
@@ -61,6 +61,7 @@ const ArrayFieldGroup = (props: IProps): JSX.Element => {
                 onChange={handleFieldChange}
                 handleDelete={handleDelete}
                 site={site}
+                disabled={disabled}
               />
             ) : (
               <ArrayFieldItem
@@ -74,12 +75,13 @@ const ArrayFieldGroup = (props: IProps): JSX.Element => {
                 isOpen={isOpen}
                 setIsOpen={setIsOpen}
                 site={site}
+                disabled={disabled}
               />
             );
           })}
       </div>
       <S.ButtonWrapper>
-        <Button type="button" onClick={handleClick} buttonStyle="line">
+        <Button type="button" onClick={handleClick} buttonStyle="line" disabled={disabled}>
           {`Add ${name}`}
         </Button>
       </S.ButtonWrapper>
@@ -95,6 +97,7 @@ export interface IProps {
   divider: { title: string; text: string };
   arrayType: string;
   site: ISite | null;
+  disabled?: boolean;
 }
 
 export default ArrayFieldGroup;

package/src/components/Fields/CheckField/style.tsx

@@ -51,8 +51,8 @@ const CheckMark = styled.span<{
     content: "";
     position: absolute;
     display: ${(p) => (p.checked || p.indeterminate ? `blocked` : `none`)};
-    left: 3px;
-    top: -1px;
+    left: 4px;
+    top: 0;
     width: 4px;
     height: 10px;
     border: solid #ffffff;

package/src/components/Fields/ColorPicker/index.tsx

@@ -8,7 +8,7 @@ import Picker from "./Picker";
 import * as S from "./style";
 
 const ColorPicker = (props: IProps): JSX.Element => {
-  const { value, onChange, error, colors = [], handleValidation, theme, isThemePalette } = props;
+  const { value, onChange, error, colors = [], handleValidation, theme, isThemePalette, disabled } = props;
 
   const getCurrentColors = () => {
     if (isThemePalette) {
@@ -105,9 +105,10 @@ const ColorPicker = (props: IProps): JSX.Element => {
           error={error}
           placeholder="#FFFFFF"
           onBlur={handleOnBlur}
+          disabled={disabled}
         />
         <S.IconWrapper>
-          <IconAction icon={icon} size="s" onClick={togglePicker} />
+          <IconAction icon={icon} size="s" onClick={togglePicker} disabled={disabled} />
         </S.IconWrapper>
       </S.InputWrapper>
       {isVisible && (
@@ -129,6 +130,7 @@ export interface IProps {
   handleValidation?: (value: string, validators: Record<string, unknown>) => void;
   theme: string;
   isThemePalette?: boolean;
+  disabled?: boolean;
 }
 
 export default memo(ColorPicker);

package/src/components/Fields/ColorPicker/style.tsx

@@ -44,6 +44,10 @@ const Input = styled.input<{error?: boolean}>`
   &::placeholder {
     color: ${(p) => p.theme.color.textLowEmphasis};
   }
+  &:disabled {
+    color: ${(p) => p.theme.color.interactiveDisabled};
+    border-color: ${(p) => p.theme.color.interactiveDisabled};
+  }
 `;
 
 const IconWrapper = styled.div`

package/src/components/Fields/DateField/DatePickerInput/index.tsx

@@ -42,7 +42,7 @@ const DatePickerInput = (props: IDatePickerProps, ref: any): JSX.Element => {
     handleValidation && handleValidation(inputValue, validators);
   };
 
-  const CalendarIcon = <IconAction icon="calendar" onClick={onClick} />;
+  const CalendarIcon = <IconAction icon="calendar" onClick={onClick} disabled={disabled} />;
   const CloseIcon = (
     <S.IconWrapper>
       <Icon name="close" size="16" />