Skip to content

Commit badd538

Browse files
Alex Taylor (alta)facebook-github-bot
Alex Taylor (alta)
authored andcommitted
Migrate relay hooks to hook-syntax
Reviewed By: SamChou19815 Differential Revision: D56448931 fbshipit-source-id: 7713c667a67d24924bd52daf72b1c27aca36e34c
1 parent 349b5a8 commit badd538

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+122
-47
lines changed

.eslintrc.js

+3
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,9 @@ module.exports = {
2626
// Flow declares trip up the no-redeclare rule
2727
'no-redeclare': 'off',
2828

29+
// Flow handles these rules
30+
'no-unreachable': 'off',
31+
2932
// Prettier and ESLint may disagree on the following rules
3033
indent: 'off',
3134
'array-bracket-spacing': 'off',

packages/react-relay/ReactRelayLocalQueryRenderer.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ const queryRendererContext: ReactRelayQueryRendererContextType = {
4040
rootIsQueryRenderer: true,
4141
};
4242

43-
function useDeepCompare<T: {...}>(value: T): T {
43+
hook useDeepCompare<T: {...}>(value: T): T {
4444
const latestValue = React.useRef(value);
4545
if (!areEqual(latestValue.current, value)) {
4646
if (__DEV__) {

packages/react-relay/multi-actor/useRelayActorEnvironment.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const ReactRelayContext = require('./../ReactRelayContext');
2020
const invariant = require('invariant');
2121
const {useContext} = require('react');
2222

23-
function useRelayActorEnvironment(
23+
hook useRelayActorEnvironment(
2424
actorIdentifier: ActorIdentifier,
2525
): IActorEnvironment {
2626
const context = useContext(ReactRelayContext);

packages/react-relay/relay-hooks/__flowtests__/useBlockingPaginationFragment-flowtest.js

+20
Original file line numberDiff line numberDiff line change
@@ -48,49 +48,68 @@ type ExpectedReturnType<
4848
// $FlowFixMe[prop-missing]
4949
// $FlowFixMe[incompatible-cast]
5050
// $FlowFixMe[incompatible-exact]
51+
// $FlowFixMe[react-rule-hook]
5152
(useBlockingPaginationFragment(
5253
refetchableFragmentInput,
5354
keyNonNullable,
5455
): ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>);
5556

57+
// $FlowFixMe[react-rule-hook]
5658
(useBlockingPaginationFragment(
5759
refetchableFragmentInput,
5860
keyNullable,
5961
): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
6062

6163
// $FlowExpectedError: can't cast nullable to non-nullable
64+
// $FlowFixMe[react-rule-hook]
65+
// $FlowFixMe[incompatible-cast]
6266
(useBlockingPaginationFragment(
6367
refetchableFragmentInput,
6468
keyNullable,
6569
): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
6670

6771
// $FlowExpectedError: actual type of returned data is correct
72+
// $FlowFixMe[react-rule-hook]
73+
// $FlowFixMe[incompatible-exact]
74+
// $FlowFixMe[prop-missing]
75+
// $FlowFixMe[incompatible-cast]
6876
(useBlockingPaginationFragment(
6977
refetchableFragmentInput,
7078
// $FlowExpectedError[incompatible-call]
7179
keyAnotherNonNullable,
7280
): ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>);
7381

7482
// $FlowExpectedError[incompatible-call] `Example_user$fragmentType` is incompatible with `FragmentType`
83+
// $FlowFixMe[react-rule-hook]
7584
(useBlockingPaginationFragment(
7685
refetchableFragmentInput,
7786
// $FlowExpectedError[incompatible-call]
7887
keyAnotherNullable,
7988
): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
8089

8190
// $FlowExpectedError: Key should not be a user provided object
91+
// $FlowFixMe[react-rule-hook]
92+
// $FlowFixMe[prop-missing]
93+
// $FlowFixMe[cannot-resolve-name]
8294
useBlockingPaginationFragment(fragmentInput, {abc: 123});
8395

8496
// $FlowExpectedError: Key should not be an empty object
97+
// $FlowFixMe[react-rule-hook]
98+
// $FlowFixMe[prop-missing]
99+
// $FlowFixMe[cannot-resolve-name]
85100
useBlockingPaginationFragment(fragmentInput, {});
86101

87102
// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
103+
// $FlowFixMe[react-rule-hook]
104+
// $FlowFixMe[prop-missing]
105+
// $FlowFixMe[cannot-resolve-name]
88106
useBlockingPaginationFragment(fragmentInput, fragmentData);
89107

90108
// Refetch function options:
91109
declare var variables: QueryVariables;
92110
declare var environment: IEnvironment;
93111

112+
// $FlowFixMe[react-rule-hook]
94113
const {refetch} = useBlockingPaginationFragment(
95114
refetchableFragmentInput,
96115
keyNonNullable,
@@ -109,6 +128,7 @@ refetch(variables, {
109128
declare var extraVariables: {nickname: string};
110129
declare var invalidVariables: {foo: string};
111130

131+
// $FlowFixMe[react-rule-hook]
112132
const {loadNext} = useBlockingPaginationFragment(
113133
refetchableFragmentInput,
114134
keyNonNullable,

packages/react-relay/relay-hooks/__flowtests__/usePaginationFragment-flowtest.js

+18
Original file line numberDiff line numberDiff line change
@@ -50,48 +50,65 @@ type ExpectedReturnType<
5050
// $FlowFixMe[prop-missing]
5151
// $FlowFixMe[incompatible-cast]
5252
// $FlowFixMe[incompatible-exact]
53+
// $FlowFixMe[react-rule-hook]
5354
(usePaginationFragment(
5455
refetchableFragmentInput,
5556
keyNonNullable,
5657
): ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>);
5758

59+
// $FlowFixMe[react-rule-hook]
5860
(usePaginationFragment(
5961
refetchableFragmentInput,
6062
keyNullable,
6163
): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
6264

6365
// $FlowExpectedError: can't cast nullable to non-nullable
66+
// $FlowFixMe[react-rule-hook]
67+
// $FlowFixMe[incompatible-cast]
6468
(usePaginationFragment(
6569
refetchableFragmentInput,
6670
keyNullable,
6771
): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
6872

6973
// $FlowExpectedError: actual type of returned data is correct
74+
// $FlowFixMe[react-rule-hook]
75+
// $FlowFixMe[incompatible-exact]
76+
// $FlowFixMe[prop-missing]
77+
// $FlowFixMe[incompatible-cast]
7078
(usePaginationFragment(
7179
refetchableFragmentInput,
7280
// $FlowFixMe[incompatible-call]
7381
keyAnotherNonNullable,
7482
): ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>);
7583
// $FlowExpectedError
84+
// $FlowFixMe[react-rule-hook]
85+
// $FlowFixMe[incompatible-cast]
7686
(usePaginationFragment(
7787
refetchableFragmentInput,
7888
// $FlowFixMe[incompatible-call]
7989
keyAnotherNullable,
8090
): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
8191

8292
// $FlowExpectedError: Key should not be a user provided object
93+
// $FlowFixMe[react-rule-hook]
94+
// $FlowFixMe[prop-missing]
8395
usePaginationFragment(refetchableFragmentInput, {abc: 123});
8496

8597
// $FlowExpectedError: Key should not be an empty object
98+
// $FlowFixMe[react-rule-hook]
99+
// $FlowFixMe[prop-missing]
86100
usePaginationFragment(refetchableFragmentInput, {});
87101

88102
// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
103+
// $FlowFixMe[react-rule-hook]
104+
// $FlowFixMe[prop-missing]
89105
usePaginationFragment(refetchableFragmentInput, fragmentData);
90106

91107
// Refetch function options:
92108
declare var variables: QueryVariables;
93109
declare var environment: IEnvironment;
94110

111+
// $FlowFixMe[react-rule-hook]
95112
const {refetch} = usePaginationFragment(
96113
refetchableFragmentInput,
97114
keyNonNullable,
@@ -110,6 +127,7 @@ refetch(variables, {
110127
declare var extraVariables: {nickname: string};
111128
declare var invalidVariables: {foo: string};
112129

130+
// $FlowFixMe[react-rule-hook]
113131
const {loadNext} = usePaginationFragment(
114132
refetchableFragmentInput,
115133
keyNonNullable,

packages/react-relay/relay-hooks/__flowtests__/useRefetchableFragment-flowtest.js

+21
Original file line numberDiff line numberDiff line change
@@ -34,53 +34,74 @@ import {
3434
// $FlowFixMe[prop-missing]
3535
// $FlowFixMe[incompatible-cast]
3636
// $FlowFixMe[incompatible-exact]
37+
// $FlowFixMe[react-rule-hook]
3738
(useRefetchableFragment(refetchableFragmentInput, keyNonNullable): [
3839
NonNullableData,
3940
FetchFn<QueryVariablesSubset>,
4041
]);
4142

43+
// $FlowFixMe[react-rule-hook]
4244
(useRefetchableFragment(refetchableFragmentInput, keyNullable): [
4345
NullableData,
4446
FetchFn<QueryVariables>,
4547
]);
4648

4749
// $FlowExpectedError: can't cast nullable to non-nullable
50+
// $FlowFixMe[react-rule-hook]
51+
// $FlowFixMe[incompatible-cast]
4852
(useRefetchableFragment(refetchableFragmentInput, keyNullable): [
4953
NonNullableData,
5054
FetchFn<QueryVariables>,
5155
]);
5256

5357
// $FlowExpectedError: refetch requires exact type if key is nullable
58+
// $FlowFixMe[react-rule-hook]
59+
// $FlowFixMe[incompatible-exact]
60+
// $FlowFixMe[prop-missing]
5461
(useRefetchableFragment(refetchableFragmentInput, keyNullable): [
5562
NullableData,
5663
FetchFn<QueryVariablesSubset>,
5764
]);
5865

5966
// $FlowExpectedError: actual type of returned data is correct
67+
// $FlowFixMe[react-rule-hook]
68+
// $FlowFixMe[incompatible-call]
69+
// $FlowFixMe[incompatible-exact]
70+
// $FlowFixMe[prop-missing]
71+
// $FlowFixMe[incompatible-cast]
6072
(useRefetchableFragment(refetchableFragmentInput, keyAnotherNonNullable): [
6173
NonNullableData,
6274
FetchFn<QueryVariablesSubset>,
6375
]);
6476

6577
// $FlowExpectedError - incompatible key types
78+
// $FlowFixMe[react-rule-hook]
79+
// $FlowFixMe[incompatible-call]
6680
(useRefetchableFragment(refetchableFragmentInput, keyAnotherNullable): [
6781
NullableData,
6882
FetchFn<QueryVariables>,
6983
]);
7084

7185
// $FlowExpectedError: Key should not be a user provided object
86+
// $FlowFixMe[react-rule-hook]
87+
// $FlowFixMe[prop-missing]
7288
useRefetchableFragment(refetchableFragmentInput, {abc: 123});
7389

7490
// $FlowExpectedError: Key should not be an empty object
91+
// $FlowFixMe[react-rule-hook]
92+
// $FlowFixMe[prop-missing]
7593
useRefetchableFragment(refetchableFragmentInput, {});
7694

7795
// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
96+
// $FlowFixMe[react-rule-hook]
97+
// $FlowFixMe[prop-missing]
7898
useRefetchableFragment(refetchableFragmentInput, fragmentData);
7999

80100
// Refetch function options:
81101
declare var variables: QueryVariables;
82102
declare var environment: IEnvironment;
83103

104+
// $FlowFixMe[react-rule-hook]
84105
const [, refetch] = useRefetchableFragment(
85106
refetchableFragmentInput,
86107
keyNonNullable,

packages/react-relay/relay-hooks/__tests__/LazyLoadEntryPointContainer_DEEPRECATED-test.js

+2
Original file line numberDiff line numberDiff line change
@@ -298,6 +298,7 @@ it('renders synchronously when the query and component are already loaded', () =
298298
it('re-renders without reloading when non-prefetch props change', () => {
299299
// $FlowFixMe[missing-local-annot] error found when enabling Flow LTI mode
300300
const Component = jest.fn(props => {
301+
// $FlowFixMe[react-rule-hook]
301302
const data = usePreloadedQuery(query, props.queries.prefetched);
302303
return data.node?.name;
303304
});
@@ -340,6 +341,7 @@ it('re-renders without reloading when non-prefetch props change', () => {
340341
it('re-renders and reloads when prefetch params change', () => {
341342
// $FlowFixMe[missing-local-annot] error found when enabling Flow LTI mode
342343
const Component = jest.fn(props => {
344+
// $FlowFixMe[react-rule-hook]
343345
const data = usePreloadedQuery(query, props.queries.prefetched);
344346
return data.node?.name;
345347
});

packages/react-relay/relay-hooks/__tests__/loadQuery-test.js

+1
Original file line numberDiff line numberDiff line change
@@ -900,6 +900,7 @@ describe('loadQuery', () => {
900900

901901
beforeEach(() => {
902902
Container = (props: {children: React.Node}) => {
903+
// $FlowFixMe[react-rule-hook]
903904
useTrackLoadQueryInRender();
904905
return props.children;
905906
};

packages/react-relay/relay-hooks/__tests__/useEntryPointLoader-test.js

+1
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@ beforeEach(() => {
7878
}) {
7979
renderCount = (renderCount || 0) + 1;
8080
[loadedEntryPoint, entryPointLoaderCallback, disposeEntryPoint] =
81+
// $FlowFixMe[react-rule-hook]
8182
useEntryPointLoader<{...}, any, any, any, any, any, any>(
8283
environmentProvider,
8384
entryPoint,

packages/react-relay/relay-hooks/__tests__/useFragment-test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ let SingularRenderer;
5858
let PluralRenderer;
5959
let ContextProvider;
6060

61-
function useFragment(
61+
hook useFragment(
6262
fragmentNode:
6363
| Fragment<
6464
useFragmentTestUserFragment$fragmentType,

packages/react-relay/relay-hooks/__tests__/useFragmentNode-required-test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ let singularQuery;
3232
let renderSingularFragment;
3333
let renderSpy;
3434

35-
function useFragmentNode(
35+
hook useFragmentNode(
3636
fragmentNode: ReaderFragment,
3737
fragmentRef: $TEMPORARY$object<{
3838
__fragmentOwner: RequestDescriptor,

packages/react-relay/relay-hooks/__tests__/useFragmentNode-test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ type ReturnType<TFragmentData: mixed> = {
9292
disableStoreUpdates: () => void,
9393
enableStoreUpdates: () => void,
9494
};
95-
function useFragmentNode_NEW<TFragmentData: mixed>(
95+
hook useFragmentNode_NEW<TFragmentData: mixed>(
9696
fragment:
9797
| Fragment<
9898
useFragmentNodeTestUserFragment$fragmentType,

packages/react-relay/relay-hooks/__tests__/usePaginationFragment-test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ class ErrorBoundary extends React.Component<any, any> {
117117
}
118118
}
119119

120-
function usePaginationFragment(fragmentNode: any, fragmentRef: any) {
120+
hook usePaginationFragment(fragmentNode: any, fragmentRef: any) {
121121
/* $FlowFixMe[underconstrained-implicit-instantiation] error found when
122122
* enabling Flow LTI mode */
123123
const {data, ...result} = usePaginationFragmentImpl(

packages/react-relay/relay-hooks/legacy/useBlockingPaginationFragment.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ type ReturnType<TVariables, TData, TKey> = {
6565
refetch: RefetchFn<TVariables, TKey>,
6666
};
6767

68-
function useBlockingPaginationFragment<
68+
hook useBlockingPaginationFragment<
6969
TFragmentType: FragmentType,
7070
TVariables: Variables,
7171
TData,
@@ -166,7 +166,7 @@ function useBlockingPaginationFragment<
166166
};
167167
}
168168

169-
function useLoadMore<TVariables: Variables>(args: {
169+
hook useLoadMore<TVariables: Variables>(args: {
170170
disableStoreUpdates: () => void,
171171
enableStoreUpdates: () => void,
172172
...$Exact<

packages/react-relay/relay-hooks/legacy/useFragmentNode.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ type ReturnType<TFragmentData: mixed> = {
2626
enableStoreUpdates: () => void,
2727
};
2828

29-
function useFragmentNode<TFragmentData: mixed>(
29+
hook useFragmentNode<TFragmentData: mixed>(
3030
fragmentNode: ReaderFragment,
3131
fragmentRef: mixed,
3232
componentDisplayName: string,

packages/react-relay/relay-hooks/legacy/useRefetchableFragmentNode.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -162,7 +162,7 @@ function reducer(state: RefetchState, action: Action): RefetchState {
162162
}
163163
}
164164

165-
function useRefetchableFragmentNode<
165+
hook useRefetchableFragmentNode<
166166
TQuery: OperationType,
167167
TKey: ?{+$data?: mixed, ...},
168168
>(
@@ -367,7 +367,7 @@ function useRefetchableFragmentNode<
367367
};
368368
}
369369

370-
function useRefetchFunction<TQuery: OperationType>(
370+
hook useRefetchFunction<TQuery: OperationType>(
371371
componentDisplayName: string,
372372
dispatch: (
373373
| {

packages/react-relay/relay-hooks/loadQuery.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ const warning = require('warning');
4646
let RenderDispatcher = null;
4747
let fetchKey = 100001;
4848

49-
function useTrackLoadQueryInRender() {
49+
hook useTrackLoadQueryInRender() {
5050
if (RenderDispatcher === null) {
5151
// Flow does not know of React internals (rightly so), but we need to
5252
// ensure here that this function isn't called inside render.

packages/react-relay/relay-hooks/useClientQuery.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const useLazyLoadQuery = require('./useLazyLoadQuery');
2020
* These queries are consist of queries for client-only data,
2121
* schematized via local schema extensions and/or Relay resolvers.
2222
*/
23-
function useClientQuery<TVariables: Variables, TData, TRawResponse>(
23+
hook useClientQuery<TVariables: Variables, TData, TRawResponse>(
2424
gqlQuery: ClientQuery<TVariables, TData, TRawResponse>,
2525
variables: TVariables,
2626
options?: {

packages/react-relay/relay-hooks/useEntryPointLoader.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ type NullEntryPointReference = {
5050
};
5151
const initialNullEntryPointReferenceState = {kind: 'NullEntryPointReference'};
5252

53-
function useLoadEntryPoint<
53+
hook useLoadEntryPoint<
5454
TEntryPointParams: {...},
5555
TPreloadedQueries: {...},
5656
TPreloadedEntryPoints: {...},

0 commit comments

Comments
 (0)