use typescript native types

changelog forgot this one more apply pr comments Revert typescript-project-references.test.ts and apply proper fix remove two more usages of FirstArgument and Arguments revert ArgumentAtIndex changes update changelog files fix tests Apply suggestions from code review Apply suggestions from code review
Shopify · Feb 9, 2022 · 6463ec4 · 6463ec4
1 parent 330b095
commit 6463ec4
Show file tree

Hide file tree

Showing 33 changed files with 69 additions and 58 deletions.
diff --git a/packages/graphql-testing/CHANGELOG.md b/packages/graphql-testing/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Remove devDependency on `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 5.1.6 - 2022-02-09
 

diff --git a/packages/graphql-testing/package.json b/packages/graphql-testing/package.json
@@ -38,7 +38,6 @@
     "jest-matcher-utils": "^26.6.2"
   },
   "devDependencies": {
-    "@shopify/useful-types": "^3.1.0",
     "graphql-typed": "^1.1.3"
   },
   "files": [

diff --git a/packages/graphql-testing/tsconfig.json b/packages/graphql-testing/tsconfig.json
@@ -11,5 +11,5 @@
     "./src/**/*.tsx"
   ],
   "exclude": ["**/test/**/*", "**/tests/**/*"],
-  "references": [{"path": "../graphql-typed"}, {"path": "../useful-types"}]
+  "references": [{"path": "../graphql-typed"}]
 }
diff --git a/packages/performance/CHANGELOG.md b/packages/performance/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Remove devDependency on `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 2.0.12 - 2022-02-01
 

diff --git a/packages/performance/src/tests/performance.test.ts b/packages/performance/src/tests/performance.test.ts
@@ -1,10 +1,8 @@
-import {FirstArgument} from '@shopify/useful-types';
-
 import {Performance} from '../performance';
 import {Navigation} from '../navigation';
 import {EventType} from '../types';
 
-type FirstInputDelayCallback = FirstArgument<PerfMetrics['onFirstInputDelay']>;
+type FirstInputDelayCallback = Parameters<PerfMetrics['onFirstInputDelay']>[0];
 
 describe('Performance', () => {
   // We are not adding all the required tests here until we have time

diff --git a/packages/react-async/CHANGELOG.md b/packages/react-async/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Reduce usage of `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 4.1.17 - 2022-02-09
 

diff --git a/packages/react-async/src/PrefetchRoute.tsx b/packages/react-async/src/PrefetchRoute.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import {Omit} from '@shopify/useful-types';
 
 import {PrefetchContext, PrefetchManager} from './context/prefetch';
 

diff --git a/packages/react-async/src/Prefetcher.tsx b/packages/react-async/src/Prefetcher.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import {Omit} from '@shopify/useful-types';
 
 import {PrefetchContext, PrefetchManager} from './context/prefetch';
 import {EventListener} from './EventListener';

diff --git a/packages/react-async/src/testing.tsx b/packages/react-async/src/testing.tsx
@@ -1,12 +1,11 @@
 import React, {ReactElement} from 'react';
 import {extract} from '@shopify/react-effect/server';
-import {Arguments} from '@shopify/useful-types';
 
 import {AsyncAssetManager, AsyncAssetContext} from './context/assets';
 
 export async function getUsedAssets(
   element: ReactElement<unknown>,
-  ...args: Arguments<AsyncAssetManager['used']>
+  ...args: Parameters<AsyncAssetManager['used']>
 ) {
   const asyncAssets = new AsyncAssetManager();
 

diff --git a/packages/react-form-state/CHANGELOG.md b/packages/react-form-state/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Remove devDependency on `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 1.1.12 - 2022-02-09
 

diff --git a/packages/react-form-state/package.json b/packages/react-form-state/package.json
@@ -29,9 +29,6 @@
   "peerDependencies": {
     "react": ">=16.8.0 <18.0.0"
   },
-  "devDependencies": {
-    "@shopify/useful-types": "^3.1.0"
-  },
   "sideEffects": false,
   "files": [
     "build/",

diff --git a/packages/react-form-state/src/tests/components/Input.tsx b/packages/react-form-state/src/tests/components/Input.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import {Omit} from '@shopify/useful-types';
 
 export interface Props {
   onChange?(value: string): void;

diff --git a/packages/react-form-state/tsconfig.json b/packages/react-form-state/tsconfig.json
@@ -10,5 +10,5 @@
     "./src/**/*.ts",
     "./src/**/*.tsx"
   ],
-  "references": [{"path": "../predicates"}, {"path": "../useful-types"}]
+  "references": [{"path": "../predicates"}]
 }
diff --git a/packages/react-graphql/CHANGELOG.md b/packages/react-graphql/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Reduce usage of `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 7.1.19 - 2022-02-09
 

diff --git a/packages/react-graphql/src/hooks/background-query.ts b/packages/react-graphql/src/hooks/background-query.ts
@@ -1,7 +1,6 @@
 import {useEffect, useRef, useCallback} from 'react';
 import {DocumentNode} from 'graphql-typed';
 import {WatchQueryOptions} from 'apollo-client';
-import {Omit} from '@shopify/useful-types';
 
 import useApolloClient from './apollo-client';
 

diff --git a/packages/react-graphql/src/hooks/types.ts b/packages/react-graphql/src/hooks/types.ts
@@ -8,7 +8,7 @@ import {
   OperationVariables,
 } from '@apollo/react-common';
 import {QueryOptions, MutationOptions} from '@apollo/react-hooks';
-import {Omit, IfAllNullableKeys} from '@shopify/useful-types';
+import {IfAllNullableKeys} from '@shopify/useful-types';
 
 import {VariableOptions} from '../types';
 

diff --git a/packages/react-html/CHANGELOG.md b/packages/react-html/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Remove dependency on `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 11.1.15 - 2022-02-09
 

diff --git a/packages/react-html/package.json b/packages/react-html/package.json
@@ -32,7 +32,6 @@
   "dependencies": {
     "@shopify/react-effect": "^4.1.9",
     "@shopify/react-hydrate": "^2.1.14",
-    "@shopify/useful-types": "^3.1.0",
     "@types/multistream": "^2.1.1",
     "multistream": "^2.1.1",
     "serialize-javascript": "^3.0.0"

diff --git a/packages/react-html/src/components/BodyAttributes.tsx b/packages/react-html/src/components/BodyAttributes.tsx
@@ -1,8 +1,6 @@
-import {FirstArgument} from '@shopify/useful-types';
-
 import {useBodyAttributes} from '../hooks';
 
-type Props = FirstArgument<typeof useBodyAttributes>;
+type Props = Parameters<typeof useBodyAttributes>[0];
 
 export function BodyAttributes(props: Props) {
   useBodyAttributes(props);

diff --git a/packages/react-html/src/components/HtmlAttributes.tsx b/packages/react-html/src/components/HtmlAttributes.tsx
@@ -1,8 +1,6 @@
-import {FirstArgument} from '@shopify/useful-types';
-
 import {useHtmlAttributes} from '../hooks';
 
-type Props = FirstArgument<typeof useHtmlAttributes>;
+type Props = Parameters<typeof useHtmlAttributes>[0];
 
 export function HtmlAttributes(props: Props) {
   useHtmlAttributes(props);

diff --git a/packages/react-html/src/hooks.ts b/packages/react-html/src/hooks.ts
@@ -1,6 +1,5 @@
 import {useEffect, useContext} from 'react';
 import {useServerEffect} from '@shopify/react-effect';
-import {FirstArgument} from '@shopify/useful-types';
 
 import {HtmlContext} from './context';
 import {HtmlManager} from './manager';
@@ -65,15 +64,15 @@ export function useLocale(locale: string) {
 }
 
 export function useHtmlAttributes(
-  htmlAttributes: FirstArgument<HtmlManager['addHtmlAttributes']>,
+  htmlAttributes: Parameters<HtmlManager['addHtmlAttributes']>[0],
 ) {
   useDomEffect((manager) => manager.addHtmlAttributes(htmlAttributes), [
     JSON.stringify(htmlAttributes),
   ]);
 }
 
 export function useBodyAttributes(
-  bodyAttributes: FirstArgument<HtmlManager['addBodyAttributes']>,
+  bodyAttributes: Parameters<HtmlManager['addBodyAttributes']>[0],
 ) {
   useDomEffect((manager) => manager.addBodyAttributes(bodyAttributes), [
     JSON.stringify(bodyAttributes),

diff --git a/packages/react-html/tsconfig.json b/packages/react-html/tsconfig.json
@@ -14,7 +14,6 @@
     {"path": "../react-effect"},
     {"path": "../react-hydrate"},
     {"path": "../react-testing"},
-    {"path": "../useful-types"},
     {"path": "../with-env"}
   ]
 }
diff --git a/packages/react-network/CHANGELOG.md b/packages/react-network/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Remove devDependency on `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 4.2.5 - 2022-02-09
 

diff --git a/packages/react-network/src/tests/hooks.test.tsx b/packages/react-network/src/tests/hooks.test.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import {createMount} from '@shopify/react-testing';
 import {Header} from '@shopify/network';
-import {FirstArgument} from '@shopify/useful-types';
 
 import {NetworkManager} from '../manager';
 import {NetworkContext} from '../context';
@@ -11,7 +10,7 @@ describe('useAcceptLanguage()', () => {
   function MockComponent({
     fallback,
   }: {
-    fallback?: FirstArgument<typeof useAcceptLanguage>;
+    fallback?: Parameters<typeof useAcceptLanguage>[0];
   }) {
     const locales = useAcceptLanguage(fallback);
 

diff --git a/packages/react-server/CHANGELOG.md b/packages/react-server/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Remove dependency on `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 2.1.5 - 2022-02-09
 

diff --git a/packages/react-server/package.json b/packages/react-server/package.json
@@ -39,7 +39,6 @@
     "@shopify/react-hydrate": "^2.1.14",
     "@shopify/react-network": "^4.2.5",
     "@shopify/sewing-kit-koa": "^8.1.3",
-    "@shopify/useful-types": "^3.1.0",
     "chalk": "^2.4.2",
     "koa": "^2.13.4",
     "koa-compose": ">=4.0.0 <5.0.0",

diff --git a/packages/react-server/src/render/render.tsx b/packages/react-server/src/render/render.tsx
@@ -18,7 +18,6 @@ import {
   NetworkContext,
   NetworkManager,
 } from '@shopify/react-network/server';
-import {ArgumentAtIndex} from '@shopify/useful-types';
 import {extract} from '@shopify/react-effect/server';
 import {HydrationContext, HydrationManager} from '@shopify/react-hydrate';
 import {
@@ -48,7 +47,7 @@ interface Data {
 }
 
 export type RenderOptions = Pick<
-  NonNullable<ArgumentAtIndex<typeof extract, 1>>,
+  NonNullable<Parameters<typeof extract>[1]>,
   'afterEachPass' | 'betweenEachPass'
 > & {
   assetPrefix?: string;

diff --git a/packages/react-server/tsconfig.json b/packages/react-server/tsconfig.json
@@ -19,7 +19,6 @@
     {"path": "../react-cookie"},
     {"path": "../with-env"},
     {"path": "../react-html"},
-    {"path": "../useful-types"},
     {"path": "../react-hydrate"},
     {"path": "../react-effect"},
     {"path": "../react-testing"}

diff --git a/packages/react-testing/CHANGELOG.md b/packages/react-testing/CHANGELOG.md
@@ -5,7 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+### Changed
+
+- Reduce usage of `@shopify/useful-types` by using built-in types. [[#2163](https://github.com/Shopify/quilt/pull/2163)]
 
 ## 3.3.4 - 2022-02-09
 

diff --git a/packages/react-testing/README.md b/packages/react-testing/README.md
@@ -513,7 +513,7 @@ expect(componentElement.prop('name')).toBe('Gord');
 
 Like `findWhere`, but returns all matches as an array.
 
-##### <a name="trigger"></a> `trigger<K extends FunctionKeys<Props>>(prop: K, ...args: Arguments<Props<K>>): ReturnType<Props<K>>`
+##### <a name="trigger"></a> `trigger<K extends FunctionKeys<Props>>(prop: K, ...args: Parameters<Props<K>>): ReturnType<Props<K>>`
 
 Simulates a function prop being called on your component. This is usually the key to effective tests: after you have mounted your component, you simulate a change in a subcomponent, and assert that the resulting react tree is in the expected shape. This method automatically uses [`Root#act`](#act) when calling the prop, so updates will automatically be applied to the root component.
 

diff --git a/packages/react-testing/src/element.ts b/packages/react-testing/src/element.ts
@@ -1,8 +1,4 @@
 import React from 'react';
-import {
-  Arguments,
-  MaybeFunctionReturnType as ReturnType,
-} from '@shopify/useful-types';
 
 import {nodeName, toReactString} from './toReactString';
 import {
@@ -196,8 +192,10 @@ export class Element<Props> implements Node<Props> {
 
   trigger<K extends FunctionKeys<Props>>(
     prop: K,
-    ...args: DeepPartialArguments<Arguments<Props[K]>>
-  ): ReturnType<NonNullable<Props[K]>> {
+    ...args: DeepPartialArguments<Props[K]>
+  ): ReturnType<
+    NonNullable<Props[K] extends (...args: any[]) => any ? Props[K] : never>
+  > {
     return this.root.act(() => {
       const propValue = this.props[prop];
 

diff --git a/packages/react-testing/src/root.tsx b/packages/react-testing/src/root.tsx
@@ -1,10 +1,6 @@
 import React from 'react';
 import {render, unmountComponentAtNode} from 'react-dom';
 import {act} from 'react-dom/test-utils';
-import {
-  Arguments,
-  MaybeFunctionReturnType as ReturnType,
-} from '@shopify/useful-types';
 
 import {TestWrapper} from './TestWrapper';
 import {Element} from './element';
@@ -177,8 +173,10 @@ export class Root<Props> implements Node<Props> {
 
   trigger<K extends FunctionKeys<Props>>(
     prop: K,
-    ...args: DeepPartialArguments<Arguments<Props[K]>>
-  ): ReturnType<NonNullable<Props[K]>> {
+    ...args: DeepPartialArguments<Props[K]>
+  ): ReturnType<
+    NonNullable<Props[K] extends (...args: any[]) => any ? Props[K] : never>
+  > {
     return this.withRoot((root) => root.trigger(prop, ...(args as any)));
   }
 

diff --git a/packages/react-testing/src/types.ts b/packages/react-testing/src/types.ts
@@ -1,5 +1,4 @@
 import React from 'react';
-import {Arguments, MaybeFunctionReturnType} from '@shopify/useful-types';
 
 export type PropsFor<
   T extends string | React.ComponentType<any>
@@ -118,8 +117,10 @@ export interface Node<Props> {
 
   trigger<K extends FunctionKeys<Props>>(
     prop: K,
-    ...args: DeepPartialArguments<Arguments<Props[K]>>
-  ): MaybeFunctionReturnType<NonNullable<Props[K]>>;
+    ...args: DeepPartialArguments<Props[K]>
+  ): ReturnType<
+    NonNullable<Props[K] extends (...args: any[]) => any ? Props[K] : never>
+  >;
   triggerKeypath<T = unknown>(keypath: string, ...args: unknown[]): T;
 
   debug(options?: DebugOptions): string;