Register fragment

graphql/client.tsx

@@ -7,6 +7,8 @@ import {
 	from,
 } from "@apollo/client";
 import { API_URI } from "@env";
+import { SHOT_FEATURES_FRAGMENT } from "./fragment/shot";
+import { createFragmentRegistry } from "@apollo/client/cache";
 
 type Props = {
 	children: ReactNode;
@@ -16,10 +18,13 @@ const ClientProvider: React.FC<Props> = ({ children }) => {
 	const httpLink = new HttpLink({
 		uri: API_URI,
 	});
+	const cache = new InMemoryCache({
+		fragments: createFragmentRegistry(SHOT_FEATURES_FRAGMENT),
+	});
 
 	const client = new ApolloClient({
 		link: from([httpLink]),
-		cache: new InMemoryCache(),
+		cache: cache,
 	});
 
 	return <ApolloProvider client={client}>{children}</ApolloProvider>;

graphql/fragment/shot-features.ts

@@ -1,10 +0,0 @@
-import { gql } from "@apollo/client";
-
-const SHOT_FEATURES_FRAGMENT = gql`
-	fragment ShotFeatures on ShotFeaturesGQL {
-		cueObjectAngle @include(if: $includeCueObjectAngle)
-		cueObjectDistance @include(if: $includeCueObjectDistance)
-	}
-`;
-
-export default SHOT_FEATURES_FRAGMENT;

graphql/fragment/shot.ts

@@ -0,0 +1,13 @@
+import { gql } from "@apollo/client";
+
+export const SHOT_FEATURES_FRAGMENT = gql`
+	fragment ShotFeatures on ShotFeaturesGQL {
+		cueObjectDistance @include(if: $includeCueObjectDistance)
+		targetPocketDistance @include(if: $includeTargetPocketDistance)
+		cueObjectAngle @include(if: $includeCueObjectAngle)
+		cueBallSpeed @include(if: $includeCueBallSpeed)
+		intendedPocket @include(if: $includeIntendedPocket)
+		shotDirection @include(if: $includeShotDirection)
+		didMake @include(if: $includeDidMake)
+	}
+`;

graphql/query.ts

@@ -1,15 +1,22 @@
 import { gql } from "@apollo/client";
-import SHOT_FEATURES_FRAGMENT from "./fragment/shot-features";
 
 export const GET_SHOTS = gql`
-	${SHOT_FEATURES_FRAGMENT}
 	query GetShots(
-		$includeCueObjectAngle: Boolean! = false
 		$includeCueObjectDistance: Boolean! = false
+		$includeTargetPocketDistance: Boolean! = false
+		$includeCueObjectAngle: Boolean! = false
+		$includeCueBallSpeed: Boolean! = false
+		$includeIntendedPocket: Boolean! = false
+		$includeShotDirection: Boolean! = false
+		$includeDidMake: Boolean! = false
 	) {
 		getShots {
 			id
 			videoId
+			startFrame
+			endFrame
+			createdAt
+			updatedAt
 			features {
 				...ShotFeatures
 			}