Fix issues

src/attributes/components/AttributeProperties/AttributeProperties.tsx

@@ -144,7 +144,7 @@ const AttributeProperties: React.FC<AttributePropertiesProps> = ({
                 description="add attribute as column in product list table"
               />
               <Typography variant="caption">
-                <FormattedMessage defaultMessage="If enable this attribute can be used as a column in product table." />
+                <FormattedMessage defaultMessage="If enabled this attribute can be used as a column in product table." />
               </Typography>
             </>
           }

src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx

@@ -150,6 +150,7 @@ const CollectionCreatePage: React.StatelessComponent<
                       errors={formErrors}
                       disabled={disabled}
                       onChange={change}
+                      translate="collection"
                     />
                   </CardContent>
                 </Card>

src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx

@@ -125,6 +125,7 @@ const CollectionDetailsPage: React.StatelessComponent<
                   errors={formErrors}
                   disabled={disabled}
                   onChange={change}
+                  translate="collection"
                 >
                   <ControlledCheckbox
                     name={"isFeatured" as keyof CollectionDetailsPageFormData}

src/components/AppHeader/AppHeader.tsx

@@ -18,6 +18,9 @@ export interface AppHeaderProps {
 
 const styles = (theme: Theme) =>
   createStyles({
+    backArrow: {
+      fontSize: 30
+    },
     menuButton: {
       flex: "0 0 auto",
       marginLeft: theme.spacing.unit * -2,
@@ -25,9 +28,6 @@ const styles = (theme: Theme) =>
       marginTop: -theme.spacing.unit * 2
     },
     root: {
-      "& svg": {
-        fontSize: 30
-      },
       "&:hover": {
         color: theme.typography.body2.color
       },
@@ -60,7 +60,7 @@ const AppHeader = withStyles(styles, { name: "AppHeader" })(
         anchor ? (
           <Portal container={anchor.current}>
             <div className={classes.root} onClick={onBack}>
-              <ArrowBackIcon />
+              <ArrowBackIcon className={classes.backArrow} />
               {children ? (
                 <Typography className={classes.title}>{children}</Typography>
               ) : (

src/components/TablePagination/TablePaginationActions.tsx

@@ -45,12 +45,10 @@ const styles = (theme: Theme) =>
           backgroundColor: fade(theme.palette.primary.main, 0.2)
         },
         backgroundColor: "transparent"
-      }
+      },
+      padding: 6
     },
     root: {
-      "& button": {
-        padding: 6
-      },
       color: theme.palette.text.secondary,
       flexShrink: 0,
       margin: `0 ${theme.spacing.unit * 2.5}px`

src/components/VisibilityCard/VisibilityCard.tsx

@@ -43,6 +43,7 @@ interface VisibilityCardProps extends WithStyles<typeof styles> {
   errors: { [key: string]: string };
   disabled?: boolean;
   onChange(event: any);
+  translate: string;
 }
 
 export const VisibilityCard = withStyles(styles, {
@@ -54,7 +55,8 @@ export const VisibilityCard = withStyles(styles, {
     data: { isPublished, publicationDate },
     errors,
     disabled,
-    onChange
+    onChange,
+    translate
   }: VisibilityCardProps) => {
     const intl = useIntl();
     const [isPublicationDate, setPublicationDate] = React.useState(
@@ -75,7 +77,8 @@ export const VisibilityCard = withStyles(styles, {
               defaultMessage: "since {date}"
             },
             {
-              date: localizeDate(publicationDate)
+              date: localizeDate(publicationDate),
+              description: translate
             }
           )
         : null
@@ -89,7 +92,8 @@ export const VisibilityCard = withStyles(styles, {
               defaultMessage: "will be visible from {date}"
             },
             {
-              date: localizeDate(publicationDate)
+              date: localizeDate(publicationDate),
+              description: translate
             }
           )
         : null

src/discounts/components/SaleInfo/SaleInfo.tsx

@@ -23,50 +23,36 @@ export interface SaleInfoProps {
   onChange: (event: React.ChangeEvent<any>) => void;
 }
 
-const styles = (theme: Theme) =>
+const SaleInfo: React.FC<SaleInfoProps> = ({
-  createStyles({
+  data,
-    root: {
+  disabled,
-      display: "grid",
+  errors,
-      gridColumnGap: theme.spacing.unit * 2 + "px",
+  onChange
-      gridTemplateColumns: "1fr"
+}) => {
-    }
+  const intl = useIntl();
-  });
 
-const SaleInfo = withStyles(styles, {
+  return (
-  name: "SaleInfo"
+    <Card>
-})(
+      <CardTitle
-  ({
+        title={intl.formatMessage(commonMessages.generalInformations)}
-    classes,
+      />
-    data,
+      <CardContent>
-    disabled,
+        <TextField
-    errors,
+          disabled={disabled}
-    onChange
+          error={!!errors.name}
-  }: SaleInfoProps & WithStyles<typeof styles>) => {
+          helperText={errors.name}
-    const intl = useIntl();
+          name={"name" as keyof FormData}
-
+          onChange={onChange}
-    return (
+          label={intl.formatMessage({
-      <Card>
+            defaultMessage: "Name",
-        <CardTitle
+            description: "sale name"
-          title={intl.formatMessage(commonMessages.generalInformations)}
+          })}
+          value={data.name}
+          fullWidth
         />
-        <CardContent className={classes.root}>
+      </CardContent>
-          <TextField
+    </Card>
-            disabled={disabled}
+  );
-            error={!!errors.name}
+};
-            helperText={errors.name}
-            name={"name" as keyof FormData}
-            onChange={onChange}
-            label={intl.formatMessage({
-              defaultMessage: "Name",
-              description: "sale name"
-            })}
-            value={data.name}
-            fullWidth
-          />
-        </CardContent>
-      </Card>
-    );
-  }
-);
 SaleInfo.displayName = "SaleInfo";
 export default SaleInfo;

src/pages/components/PageDetailsPage/PageDetailsPage.tsx

@@ -124,6 +124,7 @@ const PageDetailsPage: React.StatelessComponent<PageDetailsPageProps> = ({
                 disabled={disabled}
                 errors={formErrors}
                 onChange={change}
+                translate="product"
               />
             </div>
           </Grid>

src/products/components/ProductCreatePage/ProductCreatePage.tsx

@@ -281,6 +281,7 @@ export const ProductCreatePage: React.StatelessComponent<
                   errors={errors}
                   disabled={disabled}
                   onChange={change}
+                  translate="page"
                 />
               </div>
             </Grid>

src/products/components/ProductUpdatePage/ProductUpdatePage.tsx

@@ -291,6 +291,7 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
                     errors={errors}
                     disabled={disabled}
                     onChange={change}
+                    translate="product"
                   />
                 </div>
               </Grid>