diff --git a/framework/vendure/utils/queries/get-product-query.ts b/framework/vendure/utils/queries/get-product-query.ts
index b2c502da9..82aa5dc41 100644
--- a/framework/vendure/utils/queries/get-product-query.ts
+++ b/framework/vendure/utils/queries/get-product-query.ts
@@ -39,3 +39,19 @@ export const getProductQuery = /* GraphQL */ `
     }
   }
 `
+export const getProductDetailQuery = /* GraphQL */ `
+  query GetProductDetail($slug: String! = "hand-trowel") {
+  product(slug: $slug) {
+    name
+    description
+    variants {
+      price
+      priceWithTax
+    }
+    assets {
+      preview
+      name
+    }
+  }
+}
+`
\ No newline at end of file
diff --git a/src/components/hooks/product/useProductDetail.tsx b/src/components/hooks/product/useProductDetail.tsx
index 6a147d263..a68b1449d 100644
--- a/src/components/hooks/product/useProductDetail.tsx
+++ b/src/components/hooks/product/useProductDetail.tsx
@@ -1,30 +1,15 @@
 import { GetProductQuery } from '@framework/schema'
-import { gql } from 'graphql-request'
+import { getProductDetailQuery } from '@framework/utils/queries/get-product-query';
 import gglFetcher from 'src/utils/gglFetcher'
 import useSWR from 'swr'
 
-const query = gql`
-  query GetProductDetail($slug: String! = "hand-trowel") {
-  product(slug: $slug) {
-    name
-    description
-    variants {
-      price
-      priceWithTax
-    }
-    assets {
-      preview
-      name
-    }
-  }
-}
-`
+
 interface ProductDetail {
   slug: string
 }
 
 const useProductDetail = () => {
-  const { data, ...rest } = useSWR<GetProductQuery>([query],gglFetcher)
+  const { data, ...rest } = useSWR<GetProductQuery>([getProductDetailQuery],gglFetcher)
   return { productDetail: data?.product, ...rest }
 }