Merge remote-tracking branch 'origin/master' into fix/tooltip-position

src/admin/components/elements/Paginator/ClickableArrow/index.scss

@@ -2,9 +2,14 @@
 
 .clickable-arrow {
   cursor: pointer;
-  transform: rotate(-90deg);
 
-  &--left {
+  &--right {
+    .icon {
+      transform: rotate(-90deg);
+    }
+  }
+
+  &--left .icon {
     transform: rotate(90deg);
   }
 

src/admin/components/elements/Paginator/index.scss

@@ -18,6 +18,10 @@
     }
   }
 
+  .clickable-arrow--right {
+    margin-right: base(.25);
+  }
+
   .clickable-arrow,
   &__page {
     @extend %btn-reset;

src/admin/components/elements/Paginator/index.tsx

@@ -93,16 +93,7 @@ const Pagination: React.FC<Props> = (props) => {
   }
 
   // Add prev and next arrows based on necessity
-  nodes.push({
-    type: 'ClickableArrow',
-    props: {
-      updatePage: () => updatePage(prevPage),
-      isDisabled: !hasPrevPage,
-      direction: 'left',
-    },
-  });
-
-  nodes.push({
+  nodes.unshift({
     type: 'ClickableArrow',
     props: {
       updatePage: () => updatePage(nextPage),
@@ -111,6 +102,15 @@ const Pagination: React.FC<Props> = (props) => {
     },
   });
 
+  nodes.unshift({
+    type: 'ClickableArrow',
+    props: {
+      updatePage: () => updatePage(prevPage),
+      isDisabled: !hasPrevPage,
+      direction: 'left',
+    },
+  });
+
   return (
     <div className={baseClass}>
       {nodes.map((node, i) => {

src/admin/components/elements/TableColumns/buildColumns.tsx

@@ -44,7 +44,7 @@ const buildColumns = ({
     return [...acc, field];
   }, collection.fields);
 
-  const flattenedFields = flattenFields(combinedFields);
+  const flattenedFields = flattenFields(combinedFields, true);
 
   // sort the fields to the order of activeColumns
   const sortedFields = flattenedFields.sort((a, b) => {