Strict mode plugin (#3778)

* Stric mode plugin

* Update command

.storybook/helpers/MockedUserProvider.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import * as React from "react";
 import { UserContext } from "../../src/auth";
 import { adminUserPermissions } from "../../src/fixtures";

package-lock.json

@@ -162,6 +162,7 @@
         "rollup-plugin-polyfill-node": "^0.11.0",
         "start-server-and-test": "^1.11.0",
         "typescript": "^5.0.2",
+        "typescript-strict-plugin": "^2.1.0",
         "vite": "^3.2.4",
         "vite-plugin-html": "^3.2.0",
         "vite-plugin-pwa": "^0.13.3",
@@ -33952,6 +33953,211 @@
         "node": ">=12.20"
       }
     },
+    "node_modules/typescript-strict-plugin": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/typescript-strict-plugin/-/typescript-strict-plugin-2.1.0.tgz",
+      "integrity": "sha512-ilLV3nyWUAzh8il8Q0ItX8j5xdprWAvZYNsebOkjfz/FAoVc8DiBvAS9+QxAYMMzbOq7XNtx5cUy84SVKTohyw==",
+      "dev": true,
+      "dependencies": {
+        "chalk": "^3.0.0",
+        "execa": "^4.0.0",
+        "ora": "^5.4.1",
+        "yargs": "^16.2.0"
+      },
+      "bin": {
+        "tsc-strict": "dist/cli/tsc-strict/index.js",
+        "update-strict-comments": "dist/cli/update-strict-comments/index.js"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/chalk": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
+      "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/cli-cursor": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz",
+      "integrity": "sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==",
+      "dev": true,
+      "dependencies": {
+        "restore-cursor": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/cliui": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
+      "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
+      "dev": true,
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^7.0.0"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/log-symbols": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz",
+      "integrity": "sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==",
+      "dev": true,
+      "dependencies": {
+        "chalk": "^4.1.0",
+        "is-unicode-supported": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/log-symbols/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/ora": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz",
+      "integrity": "sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==",
+      "dev": true,
+      "dependencies": {
+        "bl": "^4.1.0",
+        "chalk": "^4.1.0",
+        "cli-cursor": "^3.1.0",
+        "cli-spinners": "^2.5.0",
+        "is-interactive": "^1.0.0",
+        "is-unicode-supported": "^0.1.0",
+        "log-symbols": "^4.1.0",
+        "strip-ansi": "^6.0.0",
+        "wcwidth": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/ora/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "dev": true,
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/restore-cursor": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
+      "integrity": "sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==",
+      "dev": true,
+      "dependencies": {
+        "onetime": "^5.1.0",
+        "signal-exit": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dev": true,
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/yargs": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
+      "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
+      "dev": true,
+      "dependencies": {
+        "cliui": "^7.0.2",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^20.2.2"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/typescript-strict-plugin/node_modules/yargs-parser": {
+      "version": "20.2.9",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
+      "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/ua-parser-js": {
       "version": "0.7.35",
       "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.35.tgz",
@@ -59319,6 +59525,162 @@
       "integrity": "sha512-wVORMBGO/FAs/++blGNeAVdbNKtIh1rbBL2EyQ1+J9lClJ93KiiKe8PmFIVdXhHcyv44SL9oglmfeSsndo0jRw==",
       "dev": true
     },
+    "typescript-strict-plugin": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/typescript-strict-plugin/-/typescript-strict-plugin-2.1.0.tgz",
+      "integrity": "sha512-ilLV3nyWUAzh8il8Q0ItX8j5xdprWAvZYNsebOkjfz/FAoVc8DiBvAS9+QxAYMMzbOq7XNtx5cUy84SVKTohyw==",
+      "dev": true,
+      "requires": {
+        "chalk": "^3.0.0",
+        "execa": "^4.0.0",
+        "ora": "^5.4.1",
+        "yargs": "^16.2.0"
+      },
+      "dependencies": {
+        "chalk": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
+          "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "cli-cursor": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz",
+          "integrity": "sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==",
+          "dev": true,
+          "requires": {
+            "restore-cursor": "^3.1.0"
+          }
+        },
+        "cliui": {
+          "version": "7.0.4",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
+          "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
+          "dev": true,
+          "requires": {
+            "string-width": "^4.2.0",
+            "strip-ansi": "^6.0.0",
+            "wrap-ansi": "^7.0.0"
+          }
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true
+        },
+        "log-symbols": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz",
+          "integrity": "sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==",
+          "dev": true,
+          "requires": {
+            "chalk": "^4.1.0",
+            "is-unicode-supported": "^0.1.0"
+          },
+          "dependencies": {
+            "chalk": {
+              "version": "4.1.2",
+              "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+              "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+              "dev": true,
+              "requires": {
+                "ansi-styles": "^4.1.0",
+                "supports-color": "^7.1.0"
+              }
+            }
+          }
+        },
+        "ora": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/ora/-/ora-5.4.1.tgz",
+          "integrity": "sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==",
+          "dev": true,
+          "requires": {
+            "bl": "^4.1.0",
+            "chalk": "^4.1.0",
+            "cli-cursor": "^3.1.0",
+            "cli-spinners": "^2.5.0",
+            "is-interactive": "^1.0.0",
+            "is-unicode-supported": "^0.1.0",
+            "log-symbols": "^4.1.0",
+            "strip-ansi": "^6.0.0",
+            "wcwidth": "^1.0.1"
+          },
+          "dependencies": {
+            "chalk": {
+              "version": "4.1.2",
+              "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+              "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+              "dev": true,
+              "requires": {
+                "ansi-styles": "^4.1.0",
+                "supports-color": "^7.1.0"
+              }
+            }
+          }
+        },
+        "restore-cursor": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
+          "integrity": "sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==",
+          "dev": true,
+          "requires": {
+            "onetime": "^5.1.0",
+            "signal-exit": "^3.0.2"
+          }
+        },
+        "strip-ansi": {
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+          "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^5.0.1"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        },
+        "y18n": {
+          "version": "5.0.8",
+          "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+          "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+          "dev": true
+        },
+        "yargs": {
+          "version": "16.2.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
+          "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
+          "dev": true,
+          "requires": {
+            "cliui": "^7.0.2",
+            "escalade": "^3.1.1",
+            "get-caller-file": "^2.0.5",
+            "require-directory": "^2.1.1",
+            "string-width": "^4.2.0",
+            "y18n": "^5.0.5",
+            "yargs-parser": "^20.2.2"
+          }
+        },
+        "yargs-parser": {
+          "version": "20.2.9",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
+          "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
+          "dev": true
+        }
+      }
+    },
     "ua-parser-js": {
       "version": "0.7.35",
       "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.35.tgz",

package.json

@@ -169,6 +169,7 @@
     "rollup-plugin-polyfill-node": "^0.11.0",
     "start-server-and-test": "^1.11.0",
     "typescript": "^5.0.2",
+    "typescript-strict-plugin": "^2.1.0",
     "vite": "^3.2.4",
     "vite-plugin-html": "^3.2.0",
     "vite-plugin-pwa": "^0.13.3",
@@ -299,7 +300,7 @@
     "build-types": "node scripts/build-types.js",
     "prebuild": "npm run build-types",
     "check-strict-null-errors": "tsc --noEmit --strictNullChecks | node scripts/count-strict-null-check-errors.js",
-    "check-types": "tsc --noEmit",
+    "check-types": "tsc --noEmit && tsc-strict",
     "extract-json-messages": "formatjs extract 'src/**/*.{ts,tsx}' --out-file locale/defaultMessages.json --format scripts/formatter.js",
     "extract-messages": "npm run extract-json-messages",
     "fetch-schema": "graphql-codegen --config ./fetch-schema.yml",

src/apps/components/AppAvatar/AppAvatar.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AppLogo } from "@dashboard/apps/types";
 import { Box, GenericAppIcon } from "@saleor/macaw-ui/next";
 import React from "react";

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

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { render } from "@testing-library/react";
 import React from "react";
 

src/apps/components/AppDetailsPage/DataPrivacyCard.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import CardTitle from "@dashboard/components/CardTitle";
 import ExternalLink from "@dashboard/components/ExternalLink";
 import Skeleton from "@dashboard/components/Skeleton";

src/apps/components/AppDetailsPage/Header.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AppPageNav } from "@dashboard/apps/components/AppPage/AppPageNav";
 import { AppUrls } from "@dashboard/apps/urls";
 import { AppQuery } from "@dashboard/graphql";

src/apps/components/AppDetailsPage/PermissionsCard.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import CardTitle from "@dashboard/components/CardTitle";
 import Skeleton from "@dashboard/components/Skeleton";
 import { AppQuery } from "@dashboard/graphql";

src/apps/components/AppFrame/AppFrame.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useAppDashboardUpdates } from "@dashboard/apps/components/AppFrame/useAppDashboardUpdates";
 import { useUpdateAppToken } from "@dashboard/apps/components/AppFrame/useUpdateAppToken";
 import {

src/apps/components/AppFrame/AppIFrame.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AppDetailsUrlQueryParams, AppUrls } from "@dashboard/apps/urls";
 import { ThemeType } from "@saleor/app-sdk/app-bridge";
 import { useTheme } from "@saleor/macaw-ui";

src/apps/components/AppFrame/appActionsHandler.test.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AppActionsHandler } from "@dashboard/apps/components/AppFrame/appActionsHandler";
 import * as ExternalAppContext from "@dashboard/apps/components/ExternalAppContext/ExternalAppContext";
 import * as dashboardConfig from "@dashboard/config";

src/apps/components/AppFrame/useUpdateAppToken.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { createAppsDebug } from "@dashboard/apps/apps-debug";
 import { DashboardEventFactory, Events } from "@saleor/app-sdk/app-bridge";
 import { useEffect, useRef } from "react";

src/apps/components/AppListPage/utils.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { GetV2SaleorAppsResponse } from "@dashboard/apps/marketplace.types";
 import { AppInstallation, InstalledApp } from "@dashboard/apps/types";
 import {

src/apps/components/AppListRow/AppListRow.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useAppListContext } from "@dashboard/apps/context";
 import { GetV2SaleorAppsResponse } from "@dashboard/apps/marketplace.types";
 import {

src/apps/components/AppPage/AppPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AppUrls } from "@dashboard/apps/urls";
 import {
   borderHeight,

src/apps/hooks/useExtensions.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useUserPermissions } from "@dashboard/auth/hooks/useUserPermissions";
 import {
   AppExtensionMountEnum,

src/apps/hooks/useMarketplaceApps.test.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { renderHook } from "@testing-library/react-hooks";
 
 import { comingSoonApp, releasedApp } from "../fixtures";

src/apps/utils.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { getAppsConfig } from "@dashboard/config";
 import { AppInstallationFragment, JobStatusEnum } from "@dashboard/graphql";
 import { IntlShape } from "react-intl";

src/attributes/components/AttributeDetails/utils.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Choice } from "@dashboard/components/SingleSelectField";
 import { MeasurementUnitsEnum } from "@dashboard/graphql";
 import React from "react";

src/attributes/components/AttributeListPage/AttributeListPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   attributeAddUrl,
   AttributeListUrlSortField,

src/attributes/components/AttributePage/AttributePage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { attributeListUrl } from "@dashboard/attributes/urls";
 import { ATTRIBUTE_TYPES_WITH_DEDICATED_VALUES } from "@dashboard/attributes/utils/data";
 import { TopNav } from "@dashboard/components/AppLayout/TopNav";

src/attributes/components/AttributeSwatchField/AttributeSwatchField.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { inputTypeMessages } from "@dashboard/attributes/components/AttributeDetails/messages";
 import { AttributeValueEditDialogFormData } from "@dashboard/attributes/utils/data";
 import { ColorPicker } from "@dashboard/components/ColorPicker";

src/attributes/utils/data.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { FetchResult } from "@apollo/client";
 import {
   AttributeInput,

src/attributes/views/AttributeList/AttributeList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   deleteFilterTab,
   getActiveFilters,

src/auth/AuthProvider.test.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useApolloClient } from "@apollo/client";
 import { useUserDetailsQuery } from "@dashboard/graphql";
 import useNotifier from "@dashboard/hooks/useNotifier";

src/auth/components/LoginPage/LoginPage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import React from "react";
 
 import { CardDecorator } from "../../../../.storybook/decorators";

src/auth/components/LoginPage/LoginPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { UserContextError } from "@dashboard/auth/types";
 import { passwordResetUrl } from "@dashboard/auth/urls";
 import { Button } from "@dashboard/components/Button";

src/auth/components/NewPasswordPage/NewPasswordPage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AccountErrorCode } from "@dashboard/graphql";
 import React from "react";
 

src/auth/components/NewPasswordPage/NewPasswordPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Button } from "@dashboard/components/Button";
 import Form from "@dashboard/components/Form";
 import FormSpacer from "@dashboard/components/FormSpacer";

src/auth/components/ResetPasswordPage/ResetPasswordPage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import React from "react";
 
 import { CardDecorator } from "../../../../.storybook/decorators";

src/auth/components/ResetPasswordPage/ResetPasswordPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Button } from "@dashboard/components/Button";
 import Form from "@dashboard/components/Form";
 import FormSpacer from "@dashboard/components/FormSpacer";

src/auth/errors.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ApolloError } from "@apollo/client";
 import { findValueInEnum } from "@dashboard/misc";
 import { GraphQLError } from "graphql";
@@ -15,7 +16,7 @@ export const AuthError = {
   OAuthError: "OAuthError",
 } as const;
 
-export type AuthError = typeof AuthError[keyof typeof AuthError];
+export type AuthError = (typeof AuthError)[keyof typeof AuthError];
 
 export function isJwtError(error: GraphQLError): boolean {
   let jwtError: boolean;

src/auth/hooks/useAuthProvider.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ApolloClient, ApolloError } from "@apollo/client";
 import { IMessageContext } from "@dashboard/components/messages";
 import { DEMO_MODE } from "@dashboard/config";

src/auth/hooks/useAuthRedirection.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { getAppMountUri } from "@dashboard/config";
 import { getAppMountUriForRedirect } from "@dashboard/utils/urls";
 import { useEffect } from "react";

src/auth/index.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { parse as parseQs } from "qs";
 import React, { useContext } from "react";
 import { Route, RouteComponentProps, Switch } from "react-router-dom";

src/auth/misc.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { PermissionEnum, UserFragment } from "@dashboard/graphql";
 
 export const hasPermission = (permission: PermissionEnum, user: UserFragment) =>

src/auth/utils.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ApolloError, ServerError } from "@apollo/client/core";
 import { IMessage, IMessageContext } from "@dashboard/components/messages";
 import { UseNotifierResult } from "@dashboard/hooks/useNotifier";

src/auth/views/Login.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useAvailableExternalAuthenticationsLazyQuery } from "@dashboard/graphql";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { getAppMountUriForRedirect } from "@dashboard/utils/urls";

src/auth/views/NewPassword.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { SetPasswordData, useAuth } from "@saleor/sdk";
 import { parse as parseQs } from "qs";

src/auth/views/ResetPassword.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useRequestPasswordResetMutation } from "@dashboard/graphql";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { commonMessages } from "@dashboard/intl";
@@ -17,30 +18,28 @@ const ResetPasswordView: React.FC = () => {
   const navigate = useNavigator();
   const intl = useIntl();
 
-  const [
+  const [requestPasswordReset, requestPasswordResetOpts] =
-    requestPasswordReset,
+    useRequestPasswordResetMutation({
-    requestPasswordResetOpts,
+      onCompleted: data => {
-  ] = useRequestPasswordResetMutation({
+        if (data.requestPasswordReset.errors.length === 0) {
-    onCompleted: data => {
+          navigate(passwordResetSuccessUrl);
-      if (data.requestPasswordReset.errors.length === 0) {
-        navigate(passwordResetSuccessUrl);
-      } else {
-        if (
-          data.requestPasswordReset.errors.find(err => err.field === "email")
-        ) {
-          setError(
-            intl.formatMessage({
-              id: "C0JLNW",
-              defaultMessage:
-                "Provided email address does not exist in our database.",
-            }),
-          );
         } else {
-          setError(intl.formatMessage(commonMessages.somethingWentWrong));
+          if (
+            data.requestPasswordReset.errors.find(err => err.field === "email")
+          ) {
+            setError(
+              intl.formatMessage({
+                id: "C0JLNW",
+                defaultMessage:
+                  "Provided email address does not exist in our database.",
+              }),
+            );
+          } else {
+            setError(intl.formatMessage(commonMessages.somethingWentWrong));
+          }
         }
-      }
+      },
-    },
+    });
-  });
 
   const handleSubmit = (data: ResetPasswordPageFormData) =>
     extractMutationErrors(

src/categories/components/CategoryBackground/CategoryBackground.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Button } from "@dashboard/components/Button";
 import CardTitle from "@dashboard/components/CardTitle";
 import Hr from "@dashboard/components/Hr";

src/categories/components/CategoryCreatePage/CategoryCreatePage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { TopNav } from "@dashboard/components/AppLayout/TopNav";
 import { CardSpacer } from "@dashboard/components/CardSpacer";
 import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton";

src/categories/components/CategoryCreatePage/form.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useExitFormDialog } from "@dashboard/components/Form/useExitFormDialog";
 import { MetadataFormData } from "@dashboard/components/Metadata";
 import useForm, {
@@ -74,9 +75,8 @@ function useCategoryCreateForm(
     triggerChange,
   });
 
-  const {
+  const { makeChangeHandler: makeMetadataChangeHandler } =
-    makeChangeHandler: makeMetadataChangeHandler,
+    useMetadataChangeTrigger();
-  } = useMetadataChangeTrigger();
 
   const changeMetadata = makeMetadataChangeHandler(handleChange);
 

src/categories/components/CategoryDeleteDialog/CategoryDeleteDialog.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import BackButton from "@dashboard/components/BackButton";
 import { Button } from "@dashboard/components/Button";
 import { buttonMessages } from "@dashboard/intl";

src/categories/components/CategoryDetailsForm/CategoryDetailsForm.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import CardTitle from "@dashboard/components/CardTitle";
 import FormSpacer from "@dashboard/components/FormSpacer";
 import RichTextEditor from "@dashboard/components/RichTextEditor";
@@ -28,12 +29,8 @@ export const CategoryDetailsForm: React.FC<CategoryDetailsFormProps> = ({
   errors,
 }) => {
   const intl = useIntl();
-  const {
+  const { defaultValue, editorRef, isReadyForMount, handleChange } =
-    defaultValue,
+    useRichTextContext();
-    editorRef,
-    isReadyForMount,
-    handleChange,
-  } = useRichTextContext();
 
   const formErrors = getFormErrors(["name", "description"], errors);
 

src/categories/components/CategoryList/CategoryList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   CategoryListUrlSortField,
   categoryUrl,

src/categories/components/CategoryListPage/CategoryListPage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { categories } from "@dashboard/categories/fixtures";
 import { CategoryListUrlSortField } from "@dashboard/categories/urls";
 import {

src/categories/components/CategoryProductList/CategoryProductList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import Checkbox from "@dashboard/components/Checkbox";
 import ResponsiveTable from "@dashboard/components/ResponsiveTable";
 import Skeleton from "@dashboard/components/Skeleton";
@@ -55,7 +56,9 @@ interface CategoryProductListProps extends ListProps, ListActions {
   products: RelayToFlat<CategoryDetailsQuery["category"]["products"]>;
 }
 
-export const CategoryProductList: React.FC<CategoryProductListProps> = props => {
+export const CategoryProductList: React.FC<
+  CategoryProductListProps
+> = props => {
   const {
     disabled,
     isChecked,

src/categories/components/CategoryProducts/CategoryProducts.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Button } from "@dashboard/components/Button";
 import CardTitle from "@dashboard/components/CardTitle";
 import HorizontalSpacer from "@dashboard/components/HorizontalSpacer";

src/categories/components/CategoryUpdatePage/CategoryUpdatePage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import placeholderImage from "@assets/images/placeholder255x255.png";
 import { category as categoryFixture } from "@dashboard/categories/fixtures";
 import { listActionsProps } from "@dashboard/fixtures";

src/categories/components/CategoryUpdatePage/CategoryUpdatePage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   categoryAddUrl,
   categoryListUrl,

src/categories/components/CategoryUpdatePage/form.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useExitFormDialog } from "@dashboard/components/Form/useExitFormDialog";
 import { MetadataFormData } from "@dashboard/components/Metadata";
 import { CategoryDetailsFragment } from "@dashboard/graphql";

src/categories/index.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { sectionNames } from "@dashboard/intl";
 import { asSortParams } from "@dashboard/utils/sort";
 import { parse as parseQs } from "qs";

src/categories/views/CategoryCreate.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { WindowTitle } from "@dashboard/components/WindowTitle";
 import {
   CategoryCreateMutation,

src/categories/views/CategoryDetails.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import ActionDialog from "@dashboard/components/ActionDialog";
 import NotFoundPage from "@dashboard/components/NotFoundPage";
 import { WindowTitle } from "@dashboard/components/WindowTitle";
@@ -142,29 +143,25 @@ export const CategoryDetails: React.FC<CategoryDetailsProps> = ({
     }
   };
 
-  const [
+  const [categoryBulkDelete, categoryBulkDeleteOpts] =
-    categoryBulkDelete,
+    useCategoryBulkDeleteMutation({
-    categoryBulkDeleteOpts,
+      onCompleted: handleBulkCategoryDelete,
-  ] = useCategoryBulkDeleteMutation({
+    });
-    onCompleted: handleBulkCategoryDelete,
-  });
 
-  const [
+  const [productBulkDelete, productBulkDeleteOpts] =
-    productBulkDelete,
+    useProductBulkDeleteMutation({
-    productBulkDeleteOpts,
+      onCompleted: data => {
-  ] = useProductBulkDeleteMutation({
+        if (data.productBulkDelete.errors.length === 0) {
-    onCompleted: data => {
+          closeModal();
-      if (data.productBulkDelete.errors.length === 0) {
+          notify({
-        closeModal();
+            status: "success",
-        notify({
+            text: intl.formatMessage(commonMessages.savedChanges),
-          status: "success",
+          });
-          text: intl.formatMessage(commonMessages.savedChanges),
+          refetch();
-        });
+          reset();
-        refetch();
+        }
-        reset();
+      },
-      }
+    });
-    },
-  });
 
   const [openModal, closeModal] = createDialogActionHandlers<
     CategoryUrlDialog,

src/categories/views/CategoryList/CategoryList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import ActionDialog from "@dashboard/components/ActionDialog";
 import DeleteFilterTabDialog from "@dashboard/components/DeleteFilterTabDialog";
 import SaveFilterTabDialog, {
@@ -131,12 +132,10 @@ export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
     }
   };
 
-  const [
+  const [categoryBulkDelete, categoryBulkDeleteOpts] =
-    categoryBulkDelete,
+    useCategoryBulkDeleteMutation({
-    categoryBulkDeleteOpts,
+      onCompleted: handleCategoryBulkDelete,
-  ] = useCategoryBulkDeleteMutation({
+    });
-    onCompleted: handleCategoryBulkDelete,
-  });
 
   const handleSort = createSortHandler(navigate, categoryListUrl, params);
 

src/categories/views/CategoryList/sort.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { CategoryListUrlSortField } from "@dashboard/categories/urls";
 import { CategorySortField } from "@dashboard/graphql";
 import { createGetSortQueryVariables } from "@dashboard/utils/sort";
@@ -17,6 +18,5 @@ export function getSortQueryField(
   }
 }
 
-export const getSortQueryVariables = createGetSortQueryVariables(
+export const getSortQueryVariables =
-  getSortQueryField,
+  createGetSortQueryVariables(getSortQueryField);
-);

src/channels/components/AssignmentList/AssignmentList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import Skeleton from "@dashboard/components/Skeleton";
 import { ReorderEvent } from "@dashboard/types";
 import { Accordion, Divider, Typography } from "@material-ui/core";

src/channels/components/AssignmentList/AssignmentListFooter.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import SingleAutocompleteSelectField from "@dashboard/components/SingleAutocompleteSelectField";
 import CardAddItemsFooter from "@dashboard/products/components/ProductStocks/CardAddItemsFooter";
 import { mapNodeToChoice } from "@dashboard/utils/maps";

src/channels/components/ChannelAllocationStrategy/ChannelAllocationStrategy.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import CardTitle from "@dashboard/components/CardTitle";
 import PreviewPill from "@dashboard/components/PreviewPill";
 import RadioGroupField from "@dashboard/components/RadioGroupField";

src/channels/components/ChannelForm/ChannelForm.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   ChannelShippingZones,
   ChannelWarehouses,

src/channels/components/ShippingZones/ShippingZones.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelShippingZones } from "@dashboard/channels/pages/ChannelDetailsPage/types";
 import CardTitle from "@dashboard/components/CardTitle";
 import { SearchShippingZonesQuery } from "@dashboard/graphql";

src/channels/components/Warehouses/Warehouses.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelWarehouses } from "@dashboard/channels/pages/ChannelDetailsPage/types";
 import CardTitle from "@dashboard/components/CardTitle";
 import { SearchWarehousesQuery } from "@dashboard/graphql";

src/channels/fixtures.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   AllocationStrategyEnum,
   ChannelDetailsFragment,

src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { channel, channelCreateErrors } from "@dashboard/channels/fixtures";
 import { countries } from "@dashboard/fixtures";
 import { ChannelErrorFragment } from "@dashboard/graphql";

src/channels/pages/ChannelDetailsPage/ChannelDetailsPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import ChannelAllocationStrategy from "@dashboard/channels/components/ChannelAllocationStrategy";
 import ShippingZones from "@dashboard/channels/components/ShippingZones";
 import Warehouses from "@dashboard/channels/components/Warehouses";

src/channels/pages/ChannelDetailsPage/handlers.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { FormData } from "@dashboard/channels/components/ChannelForm";
 import { SearchData } from "@dashboard/hooks/makeTopLevelSearch";
 import { getParsedSearchData } from "@dashboard/hooks/makeTopLevelSearch/utils";

src/channels/pages/ChannelDetailsPage/types.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   ChannelShippingZonesQuery,
   WarehouseFragment,

src/channels/pages/ChannelsListPage/ChannelsListPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { channelAddUrl, channelUrl } from "@dashboard/channels/urls";
 import { LimitsInfo } from "@dashboard/components/AppLayout/LimitsInfo";
 import { TopNav } from "@dashboard/components/AppLayout/TopNav";

src/channels/utils.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   ChannelSaleFormData,
   SaleDetailsPageFormData,

src/channels/views/ChannelCreate/ChannelCreate.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { FormData } from "@dashboard/channels/components/ChannelForm/ChannelForm";
 import { WindowTitle } from "@dashboard/components/WindowTitle";
 import {

src/channels/views/ChannelDetails/ChannelDetails.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import ChannelDeleteDialog from "@dashboard/channels/components/ChannelDeleteDialog";
 import { FormData } from "@dashboard/channels/components/ChannelForm/ChannelForm";
 import { getChannelsCurrencyChoices } from "@dashboard/channels/utils";

src/channels/views/ChannelDetails/useShippingZones.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useUserPermissions } from "@dashboard/auth/hooks/useUserPermissions";
 import { hasPermissions } from "@dashboard/components/RequirePermissions";
 import { DEFAULT_INITIAL_SEARCH_DATA } from "@dashboard/config";
@@ -14,10 +15,8 @@ export const useShippingZones = (channelId?: string) => {
     PermissionEnum.MANAGE_SHIPPING,
   ]);
 
-  const {
+  const { data: shippingZonesCountData, loading: shippingZonesCountLoading } =
-    data: shippingZonesCountData,
+    useShippingZonesCountQuery({ skip: !canLoadShippingZones });
-    loading: shippingZonesCountLoading,
-  } = useShippingZonesCountQuery({ skip: !canLoadShippingZones });
 
   const {
     data: channelShippingZonesData,

src/channels/views/ChannelDetails/useWarehouses.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useUserPermissions } from "@dashboard/auth/hooks/useUserPermissions";
 import { hasOneOfPermissions } from "@dashboard/components/RequirePermissions";
 import { DEFAULT_INITIAL_SEARCH_DATA } from "@dashboard/config";
@@ -12,10 +13,8 @@ export const useWarehouses = () => {
     PermissionEnum.MANAGE_PRODUCTS,
   ]);
 
-  const {
+  const { data: warehousesCountData, loading: warehousesCountLoading } =
-    data: warehousesCountData,
+    useWarehousesCountQuery({ skip: !canLoadWarehouses });
-    loading: warehousesCountLoading,
-  } = useWarehousesCountQuery({ skip: !canLoadWarehouses });
 
   const {
     loadMore: fetchMoreWarehouses,

src/channels/views/ChannelsList/ChannelsList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { getChannelsCurrencyChoices } from "@dashboard/channels/utils";
 import { useShopLimitsQuery } from "@dashboard/components/Shop/queries";
 import {

src/collections/components/CollectionCreatePage/CollectionCreatePage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { channelsList } from "@dashboard/channels/fixtures";
 import { createCollectionChannels } from "@dashboard/channels/utils";
 import { CollectionErrorCode } from "@dashboard/graphql";

src/collections/components/CollectionCreatePage/CollectionCreatePage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelCollectionData } from "@dashboard/channels/utils";
 import { collectionListUrl } from "@dashboard/collections/urls";
 import { TopNav } from "@dashboard/components/AppLayout/TopNav";

src/collections/components/CollectionCreatePage/form.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelCollectionData } from "@dashboard/channels/utils";
 import { createChannelsChangeHandler } from "@dashboard/collections/utils";
 import { COLLECTION_CREATE_FORM_ID } from "@dashboard/collections/views/consts";
@@ -102,9 +103,8 @@ function useCollectionCreateForm(
     triggerChange,
   });
 
-  const {
+  const { makeChangeHandler: makeMetadataChangeHandler } =
-    makeChangeHandler: makeMetadataChangeHandler,
+    useMetadataChangeTrigger();
-  } = useMetadataChangeTrigger();
 
   const changeMetadata = makeMetadataChangeHandler(handleChange);
 

src/collections/components/CollectionDetails/CollectionDetails.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import CardTitle from "@dashboard/components/CardTitle";
 import FormSpacer from "@dashboard/components/FormSpacer";
 import RichTextEditor from "@dashboard/components/RichTextEditor";
@@ -28,12 +29,8 @@ const CollectionDetails: React.FC<CollectionDetailsProps> = ({
   errors,
 }) => {
   const intl = useIntl();
-  const {
+  const { defaultValue, editorRef, isReadyForMount, handleChange } =
-    defaultValue,
+    useRichTextContext();
-    editorRef,
-    isReadyForMount,
-    handleChange,
-  } = useRichTextContext();
   const formErrors = getFormErrors(["name", "description"], errors);
 
   return (

src/collections/components/CollectionDetailsPage/CollectionDetailsPage.stories.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import placeholderCollectionImage from "@assets/images/block1.jpg";
 import placeholderProductImage from "@assets/images/placeholder60x60.png";
 import { createCollectionChannelsData } from "@dashboard/channels/utils";

src/collections/components/CollectionDetailsPage/CollectionDetailsPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelCollectionData } from "@dashboard/channels/utils";
 import { collectionListUrl } from "@dashboard/collections/urls";
 import { TopNav } from "@dashboard/components/AppLayout/TopNav";

src/collections/components/CollectionDetailsPage/form.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelCollectionData } from "@dashboard/channels/utils";
 import { createChannelsChangeHandler } from "@dashboard/collections/utils";
 import { COLLECTION_DETAILS_FORM_ID } from "@dashboard/collections/views/consts";

src/collections/components/CollectionImage/CollectionImage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Button } from "@dashboard/components/Button";
 import CardTitle from "@dashboard/components/CardTitle";
 import Hr from "@dashboard/components/Hr";

src/collections/components/CollectionList/CollectionList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   CollectionListUrlSortField,
   collectionUrl,

src/collections/components/CollectionListPage/CollectionListPage.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { collectionAddUrl } from "@dashboard/collections/urls";
 import { TopNav } from "@dashboard/components/AppLayout/TopNav";
 import { Button } from "@dashboard/components/Button";

src/collections/components/CollectionProducts/CollectionProducts.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { Button } from "@dashboard/components/Button";
 import CardTitle from "@dashboard/components/CardTitle";
 import { ChannelsAvailabilityDropdown } from "@dashboard/components/ChannelsAvailabilityDropdown";

src/collections/fixtures.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   CollectionDetailsQuery,
   CollectionListQuery,

src/collections/utils.ts

@@ -1,28 +1,33 @@
+// @ts-strict-ignore
 import { ChannelCollectionData } from "@dashboard/channels/utils";
 import {
   CollectionDetailsQuery,
   SearchProductsQuery,
 } from "@dashboard/graphql";
 
-export const createChannelsChangeHandler = (
+export const createChannelsChangeHandler =
-  channelListings: ChannelCollectionData[],
+  (
-  updateChannels: (data: ChannelCollectionData[]) => void,
+    channelListings: ChannelCollectionData[],
-  triggerChange: () => void,
+    updateChannels: (data: ChannelCollectionData[]) => void,
-) => (id: string, data: Omit<ChannelCollectionData, "name" | "id">) => {
+    triggerChange: () => void,
-  const channelIndex = channelListings.findIndex(channel => channel.id === id);
+  ) =>
-  const channel = channelListings[channelIndex];
+  (id: string, data: Omit<ChannelCollectionData, "name" | "id">) => {
+    const channelIndex = channelListings.findIndex(
+      channel => channel.id === id,
+    );
+    const channel = channelListings[channelIndex];
 
-  const updatedChannels = [
+    const updatedChannels = [
-    ...channelListings.slice(0, channelIndex),
+      ...channelListings.slice(0, channelIndex),
-    {
+      {
-      ...channel,
+        ...channel,
-      ...data,
+        ...data,
-    },
+      },
-    ...channelListings.slice(channelIndex + 1),
+      ...channelListings.slice(channelIndex + 1),
-  ];
+    ];
-  updateChannels(updatedChannels);
+    updateChannels(updatedChannels);
-  triggerChange();
+    triggerChange();
-};
+  };
 
 export const getAssignedProductIdsToCollection = (
   collection: CollectionDetailsQuery["collection"],

src/collections/views/CollectionCreate.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ChannelsAction } from "@dashboard/channels/urls";
 import { createCollectionChannels } from "@dashboard/channels/utils";
 import useAppChannel from "@dashboard/components/AppLayout/AppChannelContext";
@@ -48,16 +49,12 @@ export const CollectionCreate: React.FC<CollectionCreateProps> = ({
     CollectionCreateUrlQueryParams
   >(navigate, params => collectionAddUrl(params), params);
 
-  const [
+  const [updateChannels, updateChannelsOpts] =
-    updateChannels,
+    useCollectionChannelListingUpdateMutation({});
-    updateChannelsOpts,
-  ] = useCollectionChannelListingUpdateMutation({});
   const { availableChannels } = useAppChannel(false);
 
-  const allChannels = createCollectionChannels(
+  const allChannels = createCollectionChannels(availableChannels)?.sort(
-    availableChannels,
+    (channel, nextChannel) => channel.name.localeCompare(nextChannel.name),
-  )?.sort((channel, nextChannel) =>
-    channel.name.localeCompare(nextChannel.name),
   );
 
   const {

src/collections/views/CollectionDetails.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   createCollectionChannels,
   createCollectionChannelsData,
@@ -80,10 +81,8 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
   const [updateMetadata] = useUpdateMetadataMutation({});
   const [updatePrivateMetadata] = useUpdatePrivateMetadataMutation({});
 
-  const [
+  const [updateChannels, updateChannelsOpts] =
-    updateChannels,
+    useCollectionChannelListingUpdateMutation({});
-    updateChannelsOpts,
-  ] = useCollectionChannelListingUpdateMutation({});
   const { availableChannels } = useAppChannel(false);
 
   const handleCollectionUpdate = (data: CollectionUpdateMutation) => {
@@ -127,24 +126,22 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
     },
   );
 
-  const [
+  const [unassignProduct, unassignProductOpts] =
-    unassignProduct,
+    useUnassignCollectionProductMutation({
-    unassignProductOpts,
+      onCompleted: data => {
-  ] = useUnassignCollectionProductMutation({
+        if (data.collectionRemoveProducts.errors.length === 0) {
-    onCompleted: data => {
+          notify({
-      if (data.collectionRemoveProducts.errors.length === 0) {
+            status: "success",
-        notify({
+            text: intl.formatMessage({
-          status: "success",
+              id: "WW+Ruy",
-          text: intl.formatMessage({
+              defaultMessage: "Deleted product from collection",
-            id: "WW+Ruy",
+            }),
-            defaultMessage: "Deleted product from collection",
+          });
-          }),
+          reset();
-        });
+          closeModal();
-        reset();
+        }
-        closeModal();
+      },
-      }
+    });
-    },
-  });
 
   const [removeCollection, removeCollectionOpts] = useRemoveCollectionMutation({
     onCompleted: data => {
@@ -161,9 +158,8 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
     },
   });
 
-  const [paginationState, setPaginationState] = useLocalPaginationState(
+  const [paginationState, setPaginationState] =
-    PAGINATE_BY,
+    useLocalPaginationState(PAGINATE_BY);
-  );
   const paginate = useLocalPaginator(setPaginationState);
 
   const [selectedChannel] = useLocalStorage("collectionListChannel", "");
@@ -174,10 +170,8 @@ export const CollectionDetails: React.FC<CollectionDetailsProps> = ({
   });
 
   const collection = data?.collection;
-  const allChannels = createCollectionChannels(
+  const allChannels = createCollectionChannels(availableChannels)?.sort(
-    availableChannels,
+    (channel, nextChannel) => channel.name.localeCompare(nextChannel.name),
-  )?.sort((channel, nextChannel) =>
-    channel.name.localeCompare(nextChannel.name),
   );
   const collectionChannelsChoices = createCollectionChannelsData(collection);
   const {

src/collections/views/CollectionList/CollectionList.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import ActionDialog from "@dashboard/components/ActionDialog";
 import useAppChannel from "@dashboard/components/AppLayout/AppChannelContext";
 import DeleteFilterTabDialog from "@dashboard/components/DeleteFilterTabDialog";
@@ -65,17 +66,14 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
 
   usePaginationReset(collectionListUrl, params, settings.rowNumber);
 
-  const [
+  const [changeFilters, resetFilters, handleSearchChange] =
-    changeFilters,
+    createFilterHandlers({
-    resetFilters,
+      cleanupFn: reset,
-    handleSearchChange,
+      createUrl: collectionListUrl,
-  ] = createFilterHandlers({
+      getFilterQueryParam,
-    cleanupFn: reset,
+      navigate,
-    createUrl: collectionListUrl,
+      params,
-    getFilterQueryParam,
+    });
-    navigate,
-    params,
-  });
 
   const { availableChannels } = useAppChannel(false);
   const channelOpts = availableChannels
@@ -100,22 +98,20 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
     variables: queryVariables,
   });
 
-  const [
+  const [collectionBulkDelete, collectionBulkDeleteOpts] =
-    collectionBulkDelete,
+    useCollectionBulkDeleteMutation({
-    collectionBulkDeleteOpts,
+      onCompleted: data => {
-  ] = useCollectionBulkDeleteMutation({
+        if (data.collectionBulkDelete.errors.length === 0) {
-    onCompleted: data => {
+          notify({
-      if (data.collectionBulkDelete.errors.length === 0) {
+            status: "success",
-        notify({
+            text: intl.formatMessage(commonMessages.savedChanges),
-          status: "success",
+          });
-          text: intl.formatMessage(commonMessages.savedChanges),
+          refetch();
-        });
+          reset();
-        refetch();
+          closeModal();
-        reset();
+        }
-        closeModal();
+      },
-      }
+    });
-    },
-  });
 
   const filterOpts = getFilterOpts(params, channelOpts);
   const tabs = getFilterTabs();

src/collections/views/CollectionList/filters.test.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { createFilterStructure } from "@dashboard/collections/components/CollectionListPage";
 import { CollectionListUrlFilters } from "@dashboard/collections/urls";
 import { CollectionPublished } from "@dashboard/graphql";

src/collections/views/CollectionList/filters.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   CollectionFilterKeys,
   CollectionListFilterOpts,
@@ -72,16 +73,10 @@ export function getFilterQueryParam(
   }
 }
 
-export const {
+export const { deleteFilterTab, getFilterTabs, saveFilterTab } =
-  deleteFilterTab,
+  createFilterTabUtils<CollectionListUrlFilters>(COLLECTION_FILTERS_KEY);
-  getFilterTabs,
-  saveFilterTab,
-} = createFilterTabUtils<CollectionListUrlFilters>(COLLECTION_FILTERS_KEY);
 
-export const {
+export const { areFiltersApplied, getActiveFilters, getFiltersCurrentTab } =
-  areFiltersApplied,
+  createFilterUtils<CollectionListUrlQueryParams, CollectionListUrlFilters>(
-  getActiveFilters,
+    CollectionListUrlFiltersEnum,
-  getFiltersCurrentTab,
+  );
-} = createFilterUtils<CollectionListUrlQueryParams, CollectionListUrlFilters>(
-  CollectionListUrlFiltersEnum,
-);

src/collections/views/CollectionList/sort.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { CollectionListUrlSortField } from "@dashboard/collections/urls";
 import { CollectionSortField } from "@dashboard/graphql";
 import { createGetSortQueryVariables } from "@dashboard/utils/sort";
@@ -34,6 +35,5 @@ export function getSortQueryField(
   }
 }
 
-export const getSortQueryVariables = createGetSortQueryVariables(
+export const getSortQueryVariables =
-  getSortQueryField,
+  createGetSortQueryVariables(getSortQueryField);
-);

src/components/AccountPermissionGroups/AccountPermissionGroups.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   SearchPermissionGroupsQuery,
   StaffErrorFragment,
@@ -27,7 +28,9 @@ export interface AccountPermissionGroupsProps
   displayValues: MultiAutocompleteChoiceType[];
 }
 
-const AccountPermissionGroups: React.FC<AccountPermissionGroupsProps> = props => {
+const AccountPermissionGroups: React.FC<
+  AccountPermissionGroupsProps
+> = props => {
   const {
     availablePermissionGroups,
     disabled,

src/components/AccountPermissions/AccountPermissions.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { useUser } from "@dashboard/auth";
 import CardTitle from "@dashboard/components/CardTitle";
 import Skeleton from "@dashboard/components/Skeleton";

src/components/AccountPermissions/utils.ts

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import {
   PermissionGroupDetailsQuery,
   ShopInfoQuery,

src/components/ActionDialog/ActionDialog.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton";
 import { DialogProps } from "@dashboard/types";
 import { Dialog, DialogContent, DialogTitle } from "@material-ui/core";

src/components/ActionDialog/DialogButtons.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { ConfirmButtonTransitionState } from "@dashboard/components/ConfirmButton";
 import { buttonMessages } from "@dashboard/intl";
 import { DialogActions } from "@material-ui/core";

src/components/AddressEdit/AddressEdit.tsx

@@ -1,3 +1,4 @@
+// @ts-strict-ignore
 import { AddressTypeInput } from "@dashboard/customers/types";
 import { AccountErrorFragment, OrderErrorFragment } from "@dashboard/graphql";
 import { commonMessages } from "@dashboard/intl";