@griddo/ax 1.75.111 → 1.75.113

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

@@ -81,7 +81,7 @@ const TextField = (props: ITextFieldProps): JSX.Element => {
     <S.FieldWrapper data-testid="text-field-container" error={error} className={className}>
       {prefix && <Prefix />}
       <S.Input
-        data-testid="inputComponent"
+        data-testid="input-component"
         type={inputType}
         value={inputValue}
         name={name}
@@ -99,12 +99,12 @@ const TextField = (props: ITextFieldProps): JSX.Element => {
         aria-label={name}
       />
       {hasBackgroundIcon && (
-        <S.BackgroundIcon data-testid="backgroundIconComponent" onClick={onClickIcon}>
+        <S.BackgroundIcon data-testid="background-icon-component" onClick={onClickIcon}>
           <Icon name={icon || ""} size="24" />
         </S.BackgroundIcon>
       )}
       {hasButton && (
-        <S.IconWrapper data-testid="iconWrapperComponent" readonly={readonly} error={error}>
+        <S.IconWrapper data-testid="icon-wrapper-component" readonly={readonly} error={error}>
           <IconAction icon={icon || ""} onClick={onClickIcon} disabled={disabled} size="s" />
         </S.IconWrapper>
       )}

package/src/components/Gallery/GalleryFilters/Orientation/index.tsx

@@ -22,7 +22,7 @@ const Orientation = ({ filterItems }: IOrientationProps): JSX.Element => {
   const isActive = !areEquals(selectedValue, initialState);
 
   const Header = () => (
-    <S.Orientation isActive={isActive}>
+    <S.Orientation data-testid="orientation-wrapper" isActive={isActive}>
       Orientation
       <S.IconsWrapper>
         {isActive && <Icon name="Filter" size="16" />}
@@ -36,15 +36,23 @@ const Orientation = ({ filterItems }: IOrientationProps): JSX.Element => {
   return (
     <FloatingMenu Button={Header} position="center" closeOnSelect={true}>
       <ListTitle>Filter by orientation</ListTitle>
-      <ListItem isSelected={selectedValue.includes("all")} onClick={() => setQuery("all")}>All</ListItem>
-      <ListItem isSelected={selectedValue.includes("landscape")} onClick={() => setQuery("landscape")}>Horizontal</ListItem>
-      <ListItem isSelected={selectedValue.includes("portrait")} onClick={() => setQuery("portrait")}>Vertical</ListItem>
-      <ListItem isSelected={selectedValue.includes("square")} onClick={() => setQuery("square")}>Square</ListItem>
+      <ListItem isSelected={selectedValue.includes("all")} onClick={() => setQuery("all")}>
+        All
+      </ListItem>
+      <ListItem isSelected={selectedValue.includes("landscape")} onClick={() => setQuery("landscape")}>
+        Horizontal
+      </ListItem>
+      <ListItem isSelected={selectedValue.includes("portrait")} onClick={() => setQuery("portrait")}>
+        Vertical
+      </ListItem>
+      <ListItem isSelected={selectedValue.includes("square")} onClick={() => setQuery("square")}>
+        Square
+      </ListItem>
     </FloatingMenu>
   );
 };
 
-interface IOrientationProps {
+export interface IOrientationProps {
   filterItems(pointer: string, filter: string): void;
 }
 

package/src/components/Gallery/GalleryFilters/SortBy/index.tsx

@@ -19,7 +19,7 @@ const SortBy = ({ sortItems, sortedState }: ISortByProps): JSX.Element => {
   const isActive = sortedByName || sortedByDate || sortedBySize;
 
   const Header = () => (
-    <S.SortBy isActive={isActive}>
+    <S.SortBy data-testid="sortby-wrapper" isActive={isActive}>
       Sort by
       <S.IconsWrapper>
         {isActive && <SortedStateArrow />}
@@ -45,7 +45,7 @@ const SortBy = ({ sortItems, sortedState }: ISortByProps): JSX.Element => {
   );
 };
 
-interface ISortByProps {
+export interface ISortByProps {
   sortedState: ISortedListStatus;
   sortItems(orderPointer: string, isAscendent: boolean): void;
 }

package/src/components/Gallery/GalleryFilters/Type/index.tsx

@@ -22,7 +22,7 @@ const Type = ({ filterItems }: ITypeProps): JSX.Element => {
   const isActive = !areEquals(selectedValue, initialState);
 
   const Header = () => (
-    <S.Type isActive={isActive}>
+    <S.Type data-testid="type-wrapper" isActive={isActive}>
       Media type
       <S.IconsWrapper>
         {isActive && <Icon name="Filter" size="16" />}
@@ -43,7 +43,7 @@ const Type = ({ filterItems }: ITypeProps): JSX.Element => {
   );
 };
 
-interface ITypeProps {
+export interface ITypeProps {
   filterItems(pointer: string, filter: string): void;
 }
 

package/src/components/Gallery/GalleryPanel/DetailPanel/index.tsx

@@ -118,7 +118,7 @@ const GalleryDetailPanel = (props: IProps) => {
       : "";
 
   const AddToGlobal = () => (
-    <S.AddToGlobal>
+    <S.AddToGlobal data-testid="add-to-global-wrapper">
       <CheckField
         key="addToGlobal"
         title="Add to Global Gallery"
@@ -187,7 +187,7 @@ const GalleryDetailPanel = (props: IProps) => {
   );
 
   return (
-    <S.DetailPanelWrapper hidden={!isImageSelected}>
+    <S.DetailPanelWrapper data-testid="detail-panel-wrapper" hidden={!isImageSelected}>
       {renderImageForm}
       <S.PanelActions>
         <Button
@@ -219,7 +219,7 @@ const GalleryDetailPanel = (props: IProps) => {
   );
 };
 
-interface IDetailPanelProps {
+export interface IDetailPanelProps {
   setImage: (imageData: any) => void;
   imageSelected: IImage | null;
   isImageSelected: boolean;
@@ -232,7 +232,7 @@ const mapStateToProps = (state: IRootState) => ({
   isSaving: state.gallery.isSaving,
 });
 
-interface IDispatchProps {
+export interface IDispatchProps {
   updateImage: (imageID: number, imageData: IImageForm, add?: boolean) => Promise<void>;
   deleteImage: (imageID: number) => Promise<boolean>;
   uploadImage: (imageFile: File, site: number | string) => Promise<IImage>;

package/src/components/Gallery/GalleryPanel/GalleryDragAndDrop/index.tsx

@@ -93,8 +93,8 @@ const GalleryDragAndDrop = (props: IProps) => {
   const uploadPercentage = (uploadingState.ready * 100) / uploadingState.total;
 
   const handleTryAgain = () => {
-    setInDropZone(false);
     uploadError(false);
+    setInDropZone(false);
   };
 
   const handleFileClick = () => {
@@ -105,6 +105,7 @@ const GalleryDragAndDrop = (props: IProps) => {
 
   const renderDragAndDrop = () => (
     <DragAndDrop
+      data-testid="drag-drop-wrapper"
       onDrop={handleDrop}
       onDragOver={handleDragOver}
       onDragEnter={handleDragEnter}
@@ -147,7 +148,7 @@ const GalleryDragAndDrop = (props: IProps) => {
   );
 
   return (
-    <S.Wrapper hidden={isImageSelected}>
+    <S.Wrapper hidden={isImageSelected} data-testid="gallery-drag-drop-wrapper">
       <S.DragAndDropWrapper inDropZone={inDropZone} uploading={uploading} success={success} error={isError}>
         {allowUpload ? renderDragAndDrop() : renderPlaceholder()}
       </S.DragAndDropWrapper>
@@ -184,7 +185,7 @@ const GalleryDragAndDrop = (props: IProps) => {
   );
 };
 
-interface IGalleryDragAndDropProps {
+export interface IGalleryDragAndDropProps {
   isImageSelected: boolean;
   validFormats: string[];
   site: number | string;
@@ -203,7 +204,7 @@ const mapStateToProps = (state: IRootState) => ({
   errorMsg: state.gallery.errorMsg,
 });
 
-interface IDispatchProps {
+export interface IDispatchProps {
   getSiteImages(params: IGetSiteImages): Promise<void>;
   selectImage(item: IImage): void;
   uploadError: (error: boolean, msg?: string) => Promise<void>;

package/src/components/Gallery/GalleryPanel/index.tsx

@@ -7,16 +7,8 @@ import DetailPanel from "./DetailPanel";
 import * as S from "./style";
 
 const GalleryPanel = (props: IGalleryPanelProps) => {
-  const {
-    isImageSelected,
-    imageSelected,
-    validFormats,
-    setImage,
-    isGlobalTab,
-    site,
-    selectedTab,
-    refreshImages,
-  } = props;
+  const { isImageSelected, imageSelected, validFormats, setImage, isGlobalTab, site, selectedTab, refreshImages } =
+    props;
   const allowUpload = !isGlobalTab || !selectedTab;
 
   return (
@@ -39,7 +31,7 @@ const GalleryPanel = (props: IGalleryPanelProps) => {
   );
 };
 
-interface IGalleryPanelProps {
+export interface IGalleryPanelProps {
   isImageSelected: boolean;
   imageSelected: IImage | null;
   validFormats: string[];

package/src/components/Gallery/index.tsx

@@ -127,7 +127,7 @@ const Gallery = (props: IProps): JSX.Element => {
   const noSearchResults = !data?.items?.length && isSearching;
 
   return (
-    <S.Wrapper>
+    <S.Wrapper data-testid="gallery-wrapper">
       <S.GalleryTabs>
         <S.Header>
           {!!tabs.length && (
@@ -165,7 +165,7 @@ const Gallery = (props: IProps): JSX.Element => {
                   <EmptyState {...emptyStateProps} />
                 </S.EmptyWrapper>
               ) : (
-                <S.Grid>
+                <S.Grid data-testid="grid-wrapper">
                   {data &&
                     data.items &&
                     data.items.map((item: IImage, index: number) => {
@@ -175,8 +175,9 @@ const Gallery = (props: IProps): JSX.Element => {
                         setImageSelectedData(data);
                       }
                       return (
-                        <S.GridItem key={item.name + index} orientation={item.orientation}>
+                        <S.GridItem data-testid="grid-item" key={item.name + index} orientation={item.orientation}>
                           <S.ImageWrapper
+                            data-testid="image-item"
                             onClick={handleClick(item)}
                             selected={isSelected}
                             orientation={item.orientation}
@@ -217,7 +218,7 @@ const Gallery = (props: IProps): JSX.Element => {
   );
 };
 
-interface IGalleryProps {
+export interface IGalleryProps {
   getImageSelected: (img: IImage | null) => void;
   toggleModal: () => void;
   site: ISite;
@@ -230,7 +231,7 @@ const mapStateToProps = (state: IRootState) => ({
   isLoading: state.gallery.isLoading,
 });
 
-interface IDispatchProps {
+export interface IDispatchProps {
   getSiteImages(params: IGetSiteImages): Promise<void>;
   selectImage(item: IImage): void;
   uploadError: (error: boolean, msg?: string) => Promise<void>;

package/src/containers/PageEditor/actions.tsx

@@ -1020,6 +1020,7 @@ function setSelectedContent(editorID: number): (dispatch: Dispatch, getState: an
     */
 
     const { element: selectedContent, parent: selectedParent } = findByEditorID({ header, editorContent }, editorID);
+
     const { component } = selectedContent;
     const defaultSchema = getDefaultSchema(component);
 
@@ -1294,9 +1295,7 @@ function removeNavigationFromPage(key: string): (dispatch: Dispatch, getState: a
     const {
       pageEditor: { editorContent },
     } = getState();
-
     const updatedEditorContent = { ...editorContent, [key]: 0 };
-
     setSelectedContent(0)(dispatch, getState);
     dispatch(setEditorContent(updatedEditorContent));
   };