попытка сделать нормальный интерцептор

api/queries/useGetProductsDetail.ts

@@ -0,0 +1,14 @@
+import { useQuery } from '@tanstack/vue-query'
+import { unref, watch } from 'vue'
+import { getProductsDetail } from '~/api/endpoints'
+
+export const useGetProductsDetail = (productId: MaybeRef<number>) => {
+  const q = useQuery({
+    queryKey: ['get-products-detail', unref(productId)],
+    queryFn: () => getProductsDetail(unref(productId)),
+  })
+
+  watch(() => productId, () => q.refetch())
+
+  return q
+}