Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor useQuery to not use an internal class #11869

Merged
merged 33 commits into from
Jul 4, 2024
Merged
Changes from 1 commit
Commits
Show all changes
33 commits
Select commit Hold shift + click to select a range
c2bd48b
extract hooks from InternalState
phryneas May 27, 2024
dc58beb
inline hooks and functions into each other, move `createWatchQueryOpt…
phryneas May 27, 2024
10466e5
move `executeQuery` to `useLazyQuery`
phryneas May 27, 2024
ea77f60
move more functions out
phryneas May 27, 2024
fde4c4d
move `unsafeHandlePartialRefetch` into `setResult`
phryneas May 28, 2024
e1b7ed7
remove `toQueryResultCache`, save transformed result in `internalStat…
phryneas May 29, 2024
9c865ca
fixup test
phryneas May 29, 2024
b5e1643
move `getDefaultFetchPolicy` out
phryneas May 29, 2024
b4c8bf9
move more functions out
phryneas May 29, 2024
12e19f9
moved all class methods out
phryneas May 29, 2024
24e4491
replace class with single mutable object
phryneas May 29, 2024
e31d953
move callbacks into their own ref
phryneas May 29, 2024
891e211
move `obsQueryFields` out of `internalState`
phryneas Jun 3, 2024
ec1c7a9
inline `useInternalState`
phryneas Jun 4, 2024
79566a8
redactor away `internalState.queryHookOptions`
phryneas Jun 4, 2024
873f24d
make function arguments more explicit
phryneas Jun 4, 2024
8bb445c
replace `internalState.watchQueryOptions` with `observable[lastWatchO…
phryneas Jun 5, 2024
635a32b
move observable fully into a readonly prop on internalState
phryneas Jun 5, 2024
d6de17f
remove all direct access to `internalState` after initializing
phryneas Jun 5, 2024
06d98ac
extract new `useInternalState` hook
phryneas Jun 5, 2024
7717b4f
extract `useResubscribeIfNecessary` hook
phryneas Jun 5, 2024
3889fff
add comment
phryneas Jun 5, 2024
da4b840
extract `bindObservableMethods`
phryneas Jun 7, 2024
f18b753
extract `useHandleSkip` and `useRegisterSSRObservable` hooks
phryneas Jun 7, 2024
8480ce6
extract useObservableSubscriptionResult hook
phryneas Jun 7, 2024
30b1769
change some method arguments. remove obsolete comment
phryneas Jun 7, 2024
c896885
curry `createMakeWatchQueryOptions`
phryneas Jun 7, 2024
1485651
bring function and hook argyuments into a common order
phryneas Jun 7, 2024
70f5aaf
Move `onQueryExecuted` into `useInternalState`
phryneas Jun 7, 2024
fed117b
some style adjustments to be more compiler-friendly
phryneas Jun 7, 2024
a69327c
remove R19 exception from test, chores
phryneas Jul 3, 2024
987aaad
Apply suggestions from code review
phryneas Jul 4, 2024
33c0fef
Merge branch 'release-3.11' into pr/rewrite-useQuery
phryneas Jul 4, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
inline useInternalState
  • Loading branch information
phryneas committed Jul 3, 2024
commit ec1c7a92d23ee7c0f541c2944fcc1c88fe986705
72 changes: 31 additions & 41 deletions src/react/hooks/useQuery.ts
Original file line number Diff line number Diff line change
Expand Up @@ -146,10 +146,37 @@ export function useQueryWithInternalState<
query: DocumentNode | TypedDocumentNode<TData, TVariables>,
options: QueryHookOptions<NoInfer<TData>, NoInfer<TVariables>>
) {
const internalState = useInternalState(
useApolloClient(options.client),
query
);
const client = useApolloClient(options.client);
function createInternalState(previous?: InternalState<TData, TVariables>) {
verifyDocumentType(query, DocumentType.Query);

// Reuse previousData from previous InternalState (if any) to provide
// continuity of previousData even if/when the query or client changes.
const previousResult = previous && previous.result;
const previousData = previousResult && previousResult.data;
const internalState: Partial<InternalState<TData, TVariables>> = {
client,
query,
};
if (previousData) {
internalState.previousData = previousData;
}

return internalState as InternalState<TData, TVariables>;
}

let [internalState, updateState] = React.useState(createInternalState);

if (client !== internalState.client || query !== internalState.query) {
// If the client or query have changed, we need to create a new InternalState.
// This will trigger a re-render with the new state, but it will also continue
// to run the current render function to completion.
// Since we sometimes trigger some side-effects in the render function, we
// re-assign `state` to the new state to ensure that those side-effects are
// triggered with the new state.
updateState((internalState = createInternalState(internalState)));
}

// The renderPromises field gets initialized here in the useQuery method, at
// the beginning of everything (for a given component rendering, at least),
// so we can safely use this.renderPromises in other/later InternalState
Expand Down Expand Up @@ -368,43 +395,6 @@ export function useQueryWithInternalState<
return { result, obsQueryFields, internalState };
}

export function useInternalState<TData, TVariables extends OperationVariables>(
client: ApolloClient<any>,
query: DocumentNode | TypedDocumentNode<TData, TVariables>
): InternalState<TData, TVariables> {
function createInternalState(previous?: InternalState<TData, TVariables>) {
verifyDocumentType(query, DocumentType.Query);

// Reuse previousData from previous InternalState (if any) to provide
// continuity of previousData even if/when the query or client changes.
const previousResult = previous && previous.result;
const previousData = previousResult && previousResult.data;
const internalState: Partial<InternalState<TData, TVariables>> = {
client,
query,
};
if (previousData) {
internalState.previousData = previousData;
}

return internalState as InternalState<TData, TVariables>;
}

let [state, updateState] = React.useState(createInternalState);

if (client !== state.client || query !== state.query) {
// If the client or query have changed, we need to create a new InternalState.
// This will trigger a re-render with the new state, but it will also continue
// to run the current render function to completion.
// Since we sometimes trigger some side-effects in the render function, we
// re-assign `state` to the new state to ensure that those side-effects are
// triggered with the new state.
updateState((state = createInternalState(state)));
}

return state;
}

// A function to massage options before passing them to ObservableQuery.
export function createWatchQueryOptions<
TData = any,
Expand Down