Update eslint and prettier

.eslintrc.js

@@ -1,10 +1,10 @@
 module.exports = {
   extends: [
-    'plugin:shopify/typescript',
-    'plugin:shopify/typescript-type-checking',
-    'plugin:shopify/react',
-    'plugin:shopify/jest',
-    'plugin:shopify/prettier',
+    'plugin:@shopify/typescript',
+    'plugin:@shopify/typescript-type-checking',
+    'plugin:@shopify/react',
+    'plugin:@shopify/jest',
+    'plugin:@shopify/prettier',
   ],
   parserOptions: {
     project: [
@@ -23,8 +23,8 @@ module.exports = {
     'callback-return': 'off',
     'func-style': 'off',
     'react/display-name': 'off',
-    'shopify/restrict-full-import': ['error', 'lodash'],
-    'shopify/jsx-no-hardcoded-content': 'off',
+    '@shopify/restrict-full-import': ['error', 'lodash'],
+    '@shopify/jsx-no-hardcoded-content': 'off',
     // reports false positives with React's useRef hook
     'require-atomic-updates': 'off',
     '@typescript-eslint/no-unnecessary-type-arguments': 'off',

package.json

@@ -39,6 +39,7 @@
     "@apollo/react-hooks": "^3.1.3",
     "@babel/core": "^7.5.5",
     "@shopify/app-bridge": "^0.7.3",
+    "@shopify/eslint-plugin": "^36.0.2",
     "@shopify/tophat": "^0.0.3",
     "@types/enzyme": "^3.1.10",
     "@types/enzyme-adapter-react-16": "^1.0.3",
@@ -57,8 +58,7 @@
     "element-closest": "^3.0.1",
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.14.0",
-    "eslint": "^6.5.1",
-    "eslint-plugin-shopify": "^32.0.0",
+    "eslint": "^6.8.0",
     "faker": "^4.1.0",
     "fs-extra": "^8.1.0",
     "full-icu": "^1.3.0",
@@ -73,7 +73,7 @@
     "jest-transform-graphql": "^2.1.0",
     "lerna": "^2.9.0",
     "plop": "^2.0.0",
-    "prettier": "~1.17.1",
+    "prettier": "~2.0.4",
     "puppeteer": "^1.20.0",
     "react": "16.12.0",
     "react-dom": "16.12.0",

packages/ast-utilities/src/javascript/index.ts

@@ -4,9 +4,7 @@ export {default as addImportStatement} from './addImportStatement';
 export {default as addComponentProps} from './addComponentProps';
 export {default as replaceJsxBody} from './replaceJsxBody';
 export {default as replaceStrings} from './replaceStrings';
-export {
-  default as addVariableDeclaratorProps,
-} from './addVariableDeclaratorProps';
+export {default as addVariableDeclaratorProps} from './addVariableDeclaratorProps';
 export {transform, transformSync} from './transform';
 export {parse, parseSync} from './parse';
 export {compose, astFrom} from './utilities';

packages/ast-utilities/src/javascript/replaceStrings/tests/replaceStrings.test.ts

@@ -20,7 +20,10 @@ describe('replaceStrings', () => {
 
     const result = await transform(
       initial,
-      replaceStrings([['foo', 'baz'], ['bar', 'qux']]),
+      replaceStrings([
+        ['foo', 'baz'],
+        ['bar', 'qux'],
+      ]),
     );
 
     const expected = `

packages/ast-utilities/src/javascript/utilities/index.ts

@@ -20,7 +20,7 @@ export function compose(...visitors: any[]) {
 
   return [
     (function combinedVisitor() {
-      return function() {
+      return function () {
         return {
           visitor,
         };

packages/ast-utilities/src/markdown/transforms/addReleaseToChangelog/addReleaseToChangelog.ts

@@ -21,11 +21,7 @@ export default function addReleaseToChangelog({version, date, notes}: Options) {
       [build('text', {value: `${version} - ${date}`})],
     );
 
-    const notesNode = notes
-      ? unified()
-          .use(parse)
-          .parse(notes)
-      : null;
+    const notesNode = notes ? unified().use(parse).parse(notes) : null;
 
     function transformer(tree) {
       tree.children = flatten(

packages/decorators/src/memoize.ts

@@ -3,7 +3,7 @@ import {memoize as memoizeEnhancer} from '@shopify/function-enhancers';
 export default function memoize<Method extends (...args: any[]) => any>(
   resolver?: (...args: Parameters<Method>) => any,
 ): MethodDecorator {
-  return function<T>(
+  return function <T>(
     _target: object,
     propertyKey: string | symbol,
     descriptor: TypedPropertyDescriptor<T>,

packages/graphql-testing/src/graphql-controller.ts

@@ -94,7 +94,8 @@ export class GraphQL {
 
 function defaultGraphQLMock({operationName}: GraphQLRequest) {
   return new Error(
-    `Can’t perform GraphQL operation '${operationName ||
-      ''}' because no mocks were set.`,
+    `Can’t perform GraphQL operation '${
+      operationName || ''
+    }' because no mocks were set.`,
   );
 }

packages/graphql-testing/src/matchers/operations.ts

@@ -57,14 +57,16 @@ export function toHavePerformedGraphQLOperation<Variables>(
           foundByVariables.length === 1 ? 'operation was' : 'operations were'
         } found.\n`
     : () =>
-        `${`${matcherHint('.toHavePerformedGraphQLOperation')}\n\n` +
+        `${
+          `${matcherHint('.toHavePerformedGraphQLOperation')}\n\n` +
           `Expected to have performed GraphQL ${type}:\n  ${expectedColor(
             name,
           )}\n${
             variables
               ? `With props matching:\n  ${printExpected(variables)}\n`
               : ''
-          }`}${
+          }`
+        }${
           foundByVariables.length === 0
             ? `But no matching operations were found.\n`
             : `But the ${

packages/jest-dom-mocks/src/test/animation-frame.test.ts

@@ -16,7 +16,9 @@ describe('AnimationFrame', () => {
 
       expect(() => {
         animationFrame.mock();
-      }).toThrow();
+      }).toThrow(
+        'The animation frame is already mocked, but you tried to mock it again.',
+      );
     });
   });
 
@@ -34,7 +36,9 @@ describe('AnimationFrame', () => {
 
       expect(() => {
         animationFrame.restore();
-      }).toThrow();
+      }).toThrow(
+        'The animation frame is already real, but you tried to restore it again.',
+      );
     });
   });
 });

packages/jest-dom-mocks/src/test/clock.test.ts

@@ -16,7 +16,9 @@ describe('Clock', () => {
 
       expect(() => {
         clock.mock();
-      }).toThrow();
+      }).toThrow(
+        'The clock is already mocked, but you tried to mock it again.',
+      );
     });
   });
 
@@ -34,7 +36,9 @@ describe('Clock', () => {
 
       expect(() => {
         clock.restore();
-      }).toThrow();
+      }).toThrow(
+        'The clock is already real, but you tried to restore it again.',
+      );
     });
   });
 });

packages/jest-dom-mocks/src/test/connection.test.ts

@@ -15,7 +15,9 @@ describe('Connection', () => {
 
       expect(() => {
         connection.mock();
-      }).toThrow();
+      }).toThrow(
+        'You tried to mock navigator.connection when it was already mocked.',
+      );
     });
 
     it('delegates stubbed options to navigator.connection', () => {
@@ -47,7 +49,9 @@ describe('Connection', () => {
 
       expect(() => {
         connection.restore();
-      }).toThrow();
+      }).toThrow(
+        'You tried to restore navigator.connection when it was already restored.',
+      );
     });
   });
 });

packages/jest-dom-mocks/src/test/location.test.ts

@@ -16,7 +16,9 @@ describe('Location', () => {
 
       expect(() => {
         location.mock();
-      }).toThrow();
+      }).toThrow(
+        'You tried to mock window.location when it was already mocked.',
+      );
     });
   });
 
@@ -34,7 +36,9 @@ describe('Location', () => {
 
       expect(() => {
         location.restore();
-      }).toThrow();
+      }).toThrow(
+        'You tried to restore window.location when it was already restored.',
+      );
     });
   });
 });

packages/jest-dom-mocks/src/test/match-media.test.ts

@@ -16,7 +16,9 @@ describe('MatchMedia', () => {
 
       expect(() => {
         matchMedia.mock();
-      }).toThrow();
+      }).toThrow(
+        'You tried to mock window.matchMedia when it was already mocked.',
+      );
     });
   });
 
@@ -34,7 +36,9 @@ describe('MatchMedia', () => {
 
       expect(() => {
         matchMedia.restore();
-      }).toThrow();
+      }).toThrow(
+        'You tried to restore window.matchMedia when it was already restored.',
+      );
     });
   });
 });

packages/jest-dom-mocks/src/test/timer.test.ts

@@ -16,7 +16,9 @@ describe('Timer', () => {
 
       expect(() => {
         timer.mock();
-      }).toThrow();
+      }).toThrow(
+        'The Timer is already mocked, but you tried to mock it again.',
+      );
     });
   });
 
@@ -34,7 +36,9 @@ describe('Timer', () => {
 
       expect(() => {
         timer.restore();
-      }).toThrow();
+      }).toThrow(
+        'The Timer is already real, but you tried to restore it again.',
+      );
     });
   });
 });

packages/jest-dom-mocks/src/test/user-timing.test.ts

@@ -15,7 +15,9 @@ describe('UserTiming', () => {
 
       expect(() => {
         userTiming.mock();
-      }).toThrow();
+      }).toThrow(
+        'You tried to mock window.performance.timing when it was already mocked.',
+      );
     });
 
     it('delegates stubbed options to window.performance.timing', () => {
@@ -47,7 +49,9 @@ describe('UserTiming', () => {
 
       expect(() => {
         userTiming.restore();
-      }).toThrow();
+      }).toThrow(
+        'You tried to restore window.performance.timing when it was already restored.',
+      );
     });
   });
 });

packages/jest-mock-apollo/src/graphqlClient.ts

@@ -24,8 +24,9 @@ export type MockGraphQLClient = ApolloClient<any> & {
 
 function defaultGraphQLMock({operationName}: GraphQLRequest) {
   return new Error(
-    `Can’t perform GraphQL operation '${operationName ||
-      ''}' because no mocks were set.`,
+    `Can’t perform GraphQL operation '${
+      operationName || ''
+    }' because no mocks were set.`,
   );
 }
 
@@ -62,7 +63,10 @@ export default function configureClient({
         }),
       );
       const observer = forward(operation);
-      observer.subscribe(next => resolver(next), err => resolver(err));
+      observer.subscribe(
+        next => resolver(next),
+        err => resolver(err),
+      );
       return observer;
     });
 

packages/koa-performance/src/middleware.ts

@@ -165,9 +165,9 @@ export function clientPerformanceMetrics({
 
         if (getAdditionalNavigationMetrics) {
           metrics.push(
-            ...getAdditionalNavigationMetrics(navigation).map(
-              ({name, value}) => ({name, value, tags: navigationTags}),
-            ),
+            ...getAdditionalNavigationMetrics(
+              navigation,
+            ).map(({name, value}) => ({name, value, tags: navigationTags})),
           );
         }
       }

packages/koa-performance/src/test/middleware.test.ts

@@ -535,7 +535,7 @@ type DeepPartial<T> = {
     ? T[K]
     : T[K] extends object
     ? DeepPartial<T[K]>
-    : T[K]
+    : T[K];
 };
 
 function createBody({

packages/koa-shopify-webhooks/src/test/receive.test.ts

@@ -201,9 +201,7 @@ function headers({
 }
 
 function hmac(secret: string, body: string) {
-  return createHmac('sha256', secret)
-    .update(body, 'utf8')
-    .digest('base64');
+  return createHmac('sha256', secret).update(body, 'utf8').digest('base64');
 }
 
 async function noop() {}

packages/koa-shopify-webhooks/src/test/register.test.ts

@@ -33,9 +33,7 @@ describe('registerWebhook', () => {
 
     const webhookQuery = `
     mutation webhookSubscriptionCreate {
-      webhookSubscriptionCreate(topic: ${
-        webhook.topic
-      }, webhookSubscription: {callbackUrl: "${webhook.address}"}) {
+      webhookSubscriptionCreate(topic: ${webhook.topic}, webhookSubscription: {callbackUrl: "${webhook.address}"}) {
         userErrors {
           field
           message

packages/network/src/network.ts

@@ -173,6 +173,4 @@ export enum CacheControl {
   MaxAge = 'max-age',
 }
 
-export const noCache = `${CacheControl.NoCache},${CacheControl.NoStore},${
-  CacheControl.MustRevalidate
-},${CacheControl.MaxAge}=0`;
+export const noCache = `${CacheControl.NoCache},${CacheControl.NoStore},${CacheControl.MustRevalidate},${CacheControl.MaxAge}=0`;

packages/performance/src/test/navigation.test.ts

@@ -315,7 +315,7 @@ function createGenericEvent(event: Partial<CustomEvent> = {}): CustomEvent {
 }
 
 type DeepPartial<T> = {
-  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K]
+  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];
 };
 
 function createScriptDownloadEvent(

packages/performance/src/types.ts

@@ -7,7 +7,7 @@ export enum EventType {
   Load = 'load',
   LongTask = 'longtask',
   Usable = 'usable',
-  // eslint-disable-next-line shopify/typescript/prefer-pascal-case-enums
+  // eslint-disable-next-line @shopify/typescript/prefer-pascal-case-enums
   GraphQL = 'graphql',
   ScriptDownload = 'script',
   StyleDownload = 'style',