Fix couple of eslint rules (#4058)

.changeset/many-icons-flow.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Fix couple of eslint rules connected to display name and no-case declarations

.eslintrc.json

@@ -101,16 +101,7 @@
     "array-callback-return": "off",
     "import/export": "off",
     "n/no-callback-literal": "off",
-    "no-case-declarations": "off",
+    "no-case-declarations": "warn"
-    "no-empty-pattern": "off",
-    "no-fallthrough": "off",
-    "no-new": "off",
-    "no-prototype-builtins": "off",
-    "no-unreachable": "off",
-    "no-useless-catch": "off",
-    "no-useless-escape": "off",
-    "prefer-promise-reject-errors": "off",
-    "react/display-name": "warn"
   },
   "ignorePatterns": ["node_modules/", "**/types/**/*", "type-policies.ts"]
 }

src/apps/components/AppDetailsPage/AppDetailsPage.test.tsx

@@ -6,6 +6,7 @@ import { appDetails } from "../../fixtures";
 import { AppDetailsPage } from "./AppDetailsPage";
 
 const mockHeader = jest.fn();
+// eslint-disable-next-line react/display-name
 jest.mock("./Header", () => props => {
   mockHeader(props);
   return <></>;

src/apps/components/AppFrame/AppIFrame.tsx

@@ -48,6 +48,8 @@ const _AppIFrame = forwardRef<HTMLIFrameElement, AppIFrameProps>(
   },
 );
 
+_AppIFrame.displayName = "AppIFrame";
+
 export const AppIFrame = memo(_AppIFrame, (prev, next) =>
   isEqualWith(prev, next),
 );

src/apps/components/InstallWithManifestFormButton/InstallWithManifestFormButton.tsx

@@ -27,9 +27,8 @@ export const InstallWithManifestFormButton: React.FC<
     const inputValue = form.get("manifest-url") as string;
 
     try {
-      new URL(inputValue);
+      const parsedURL = new URL(inputValue);
-
+      onSubmitted(parsedURL.href);
-      onSubmitted(inputValue);
     } catch (e) {
       console.error("Invalid URL from input. Should be validated by browser");
     }

src/components/AppLayout/util.ts

@@ -10,7 +10,7 @@ export const extractQueryParams = (queryString: string) => {
     if (match) {
       const arrayKey = match[1];
 
-      if (!queryParams.hasOwnProperty(arrayKey)) {
+      if (!Object.prototype.hasOwnProperty.call(queryParams, arrayKey)) {
         queryParams[arrayKey] = [];
       }
 

src/components/Form/ExitFormDialog.test.tsx

@@ -14,6 +14,7 @@ jest.mock("react-intl", () => ({
 jest.mock("@saleor/macaw-ui", () => ({
   useStyles: jest.fn(() => () => ({})),
   makeStyles: jest.fn(() => () => ({})),
+  // eslint-disable-next-line react/display-name
   DialogHeader: jest.fn(() => () => <></>),
 }));
 

src/components/IconButton/IconButton.tsx

@@ -18,6 +18,8 @@ const _IconButton: React.FC<any> = React.forwardRef(
   },
 );
 
+_IconButton.displayName = "IconButton";
+
 export const IconButton = _IconButton as <
   T extends React.ElementType = "button",
 >(

src/components/Metadata/Metadata.tsx

@@ -83,3 +83,5 @@ export const Metadata: React.FC<MetadataProps> = memo(({ data, onChange }) => {
     </Box>
   );
 }, propsCompare);
+
+Metadata.displayName = "Metadata";

src/components/SeoForm/SeoForm.tsx

@@ -20,7 +20,7 @@ enum SeoField {
   description = "seoDescription",
 }
 
-const SLUG_REGEX = /^[a-zA-Z0-9\-\_]+$/;
+const SLUG_REGEX = /^[a-zA-Z0-9\-_]+$/;
 const maxSlugLength = 255;
 const maxTitleLength = 70;
 const maxDescriptionLength = 300;

src/containers/BackgroundTasks/BackgroundTasksProvider.tsx

@@ -28,29 +28,20 @@ export function useBackgroundTasks(
   React.useEffect(() => {
     const intervalId = setInterval(() => {
       const queue = async () => {
-        try {
+        await Promise.all(
-          await Promise.all(
+          tasks.current.map(async task => {
-            tasks.current.map(async task => {
+            if (task.status === TaskStatus.PENDING) {
-              if (task.status === TaskStatus.PENDING) {
+              const status = await handleTask(task);
-                let status: TaskStatus;
 
-                try {
+              if (status !== TaskStatus.PENDING) {
-                  status = await handleTask(task);
+                const taskIndex = tasks.current.findIndex(
-                } catch (error) {
+                  t => t.id === task.id,
-                  throw error;
+                );
-                }
+                tasks.current[taskIndex].status = status;
-                if (status !== TaskStatus.PENDING) {
-                  const taskIndex = tasks.current.findIndex(
-                    t => t.id === task.id,
-                  );
-                  tasks.current[taskIndex].status = status;
-                }
               }
-            }),
+            }
-          );
+          }),
-        } catch (error) {
+        );
-          throw error;
-        }
       };
 
       queue();

src/custom-apps/components/PermissionAlert/PermissionAlert.test.tsx

@@ -23,6 +23,7 @@ jest.mock("@saleor/macaw-ui", () => ({
   useTheme: jest.fn(() => () => ({})),
   useStyles: jest.fn(() => () => ({})),
   makeStyles: jest.fn(() => () => ({})),
+  // eslint-disable-next-line react/display-name
   DialogHeader: jest.fn(() => () => <></>),
 }));
 

src/giftCards/index.tsx

@@ -41,7 +41,7 @@ const GiftCardList: React.FC<RouteComponentProps<any>> = () => {
   return <GiftCardListComponent params={params} />;
 };
 
-const Component: React.FC = ({}) => {
+const Component: React.FC = () => {
   const intl = useIntl();
 
   return (

src/icons/Attributes.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const Attributes = createSvgIcon(
+const AttributesIcons = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const Attributes = createSvgIcon(
   "Attributes",
 );
 
-export default (props: SvgIconProps) => (
+export default function Attributes(props: SvgIconProps) {
-  <Attributes {...props} viewBox="0 0 32 32" />
+  return <AttributesIcons {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/Channels.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const Channels = createSvgIcon(
+const ChannelsIcon = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const Channels = createSvgIcon(
   "Channels",
 );
 
-export default (props: SvgIconProps) => (
+export default function Channels(props: SvgIconProps) {
-  <Channels {...props} viewBox="0 0 32 32" />
+  return <ChannelsIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/Miscellaneous.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const Miscellaneous = createSvgIcon(
+const MiscellaneousIcon = createSvgIcon(
   <>
     <path
       fillRule="evenodd"
@@ -31,6 +31,6 @@ const Miscellaneous = createSvgIcon(
   "Miscellaneous",
 );
 
-export default (props: SvgIconProps) => (
+export default function Miscellaneous(props: SvgIconProps) {
-  <Miscellaneous {...props} viewBox="0 0 24 24" fill="none" />
+  return <MiscellaneousIcon {...props} viewBox="0 0 24 24" fill="none" />;
-);
+}

src/icons/Navigation.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const Navigation = createSvgIcon(
+const NavigationIcon = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const Navigation = createSvgIcon(
   "Navigation",
 );
 
-export default (props: SvgIconProps) => (
+export default function Navigation(props: SvgIconProps) {
-  <Navigation {...props} viewBox="0 0 32 32" />
+  return <NavigationIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/PageTypes.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const PageTypes = createSvgIcon(
+const PageTypesIcons = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const PageTypes = createSvgIcon(
   "PageTypes",
 );
 
-export default (props: SvgIconProps) => (
+export default function PageTypes(props: SvgIconProps) {
-  <PageTypes {...props} viewBox="0 0 24 25" />
+  return <PageTypesIcons {...props} viewBox="0 0 24 25" />;
-);
+}

src/icons/PermissionGroups.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const PermissionGroups = createSvgIcon(
+const PermissionGroupsIcon = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const PermissionGroups = createSvgIcon(
   "PermissionGroups",
 );
 
-export default (props: SvgIconProps) => (
+export default function PermissionGroups(props: SvgIconProps) {
-  <PermissionGroups {...props} viewBox="0 0 32 32" />
+  return <PermissionGroupsIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/ProductTypes.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const ProductTypes = createSvgIcon(
+const ProductTypesIcon = createSvgIcon(
   <>
     <path
       fillRule="evenodd"
@@ -13,6 +13,6 @@ const ProductTypes = createSvgIcon(
   "ProductTypes",
 );
 
-export default (props: SvgIconProps) => (
+export default function ProductTypes(props: SvgIconProps) {
-  <ProductTypes {...props} viewBox="0 0 44 44" />
+  return <ProductTypesIcon {...props} viewBox="0 0 44 44" />;
-);
+}

src/icons/ShippingMethods.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const ShippingMethods = createSvgIcon(
+const ShippingMethodsIcons = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const ShippingMethods = createSvgIcon(
   "ShippingMethods",
 );
 
-export default (props: SvgIconProps) => (
+export default function ShippingMethods(props: SvgIconProps) {
-  <ShippingMethods {...props} viewBox="0 0 32 32" />
+  return <ShippingMethodsIcons {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/SiteSettings.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const SiteSettings = createSvgIcon(
+const SiteSettingsIcon = createSvgIcon(
   <>
     <path
       fillRule="evenodd"
@@ -19,6 +19,6 @@ const SiteSettings = createSvgIcon(
   "SiteSettings",
 );
 
-export default (props: SvgIconProps) => (
+export default function SiteSettings(props: SvgIconProps) {
-  <SiteSettings {...props} viewBox="0 0 32 32" />
+  return <SiteSettingsIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/StaffMembers.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const StaffMembers = createSvgIcon(
+const StaffMembersIcon = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const StaffMembers = createSvgIcon(
   "StaffMembers",
 );
 
-export default (props: SvgIconProps) => (
+export default function StaffMembers(props: SvgIconProps) {
-  <StaffMembers {...props} viewBox="0 0 32 32" />
+  return <StaffMembersIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/Taxes.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const Taxes = createSvgIcon(
+const TaxesIcon = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const Taxes = createSvgIcon(
   "Taxes",
 );
 
-export default (props: SvgIconProps) => (
+export default function Taxes(props: SvgIconProps) {
-  <Taxes {...props} viewBox="0 0 32 32" />
+  return <TaxesIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/icons/Warehouses.tsx

@@ -1,7 +1,7 @@
 import { createSvgIcon, SvgIconProps } from "@material-ui/core";
 import React from "react";
 
-const Warehouses = createSvgIcon(
+const WarehousesIcon = createSvgIcon(
   <path
     fillRule="evenodd"
     clipRule="evenodd"
@@ -11,6 +11,6 @@ const Warehouses = createSvgIcon(
   "Warehouses",
 );
 
-export default (props: SvgIconProps) => (
+export default function Warehouses(props: SvgIconProps) {
-  <Warehouses {...props} viewBox="0 0 32 32" />
+  return <WarehousesIcon {...props} viewBox="0 0 32 32" />;
-);
+}

src/navigation/views/MenuDetails/index.tsx

@@ -119,7 +119,6 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
 
       default:
         throw unknownTypeError;
-        break;
     }
   };
 

src/orders/components/OrderHistory/messages.ts

@@ -100,6 +100,8 @@ export const getEventMessage = (
             defaultMessage: "Order refund information was sent to customer",
             description: "order history message",
           });
+        default:
+          return "";
       }
     case OrderEventsEnum.FULFILLMENT_CANCELED:
       return intl.formatMessage({

src/utils/handlers/multiFileUploadHandler.test.ts

@@ -48,7 +48,7 @@ describe("Multiple file upload handler", () => {
     const handle = createMultiFileUploadHandler((_, fileIndex) => {
       const promise = new Promise<void>((resolve, reject) => {
         if (fileIndex === 2) {
-          reject();
+          reject(new Error("mock error"));
         } else {
           resolve();
         }