финишный вариант интерцептора

api/endpoints/getProductsDetail.ts

@@ -1,8 +1,4 @@
 import api from '~/api/instance'
 
-export const getProductsDetail = (productId: number) =>
+export const getProductsDetail = async (productId: number) =>
-  api.wc.v1ProductsDetail(productId)
+  await api.wc.v1ProductsDetail(productId)
-    .then(({ data }) => {
-      console.log('data', data)
-      return data
-    })

api/instance.ts

@@ -20,7 +20,7 @@ const api = new Api({
   },
 })
 
-// Модифицируем методы API для автоматической аутентификации
+// Модифицируем методы API
 Object.keys(api.wc).forEach((namespace) => {
   const namespaceObj = api.wc[namespace]
 
@@ -41,13 +41,15 @@ Object.keys(api.wc).forEach((namespace) => {
           },
         }
 
-        // Заменяем последний аргумент на модифицированные опции
         const modifiedArgs = typeof lastArg === 'object'
           ? [...args.slice(0, -1), modifiedOptions]
           : [...args, modifiedOptions]
 
         const response = await originalMethod.apply(this, modifiedArgs)
-        return response.json()
+
+        // Получаем тело ответа и парсим JSON
+        const data = await response.json()
+        return data
       }
       catch (error) {
         console.error(`API Error in ${namespace}.${methodName}:`, error)
@@ -57,14 +59,14 @@ Object.keys(api.wc).forEach((namespace) => {
   })
 })
 
-// Переопределяем базовый request для обработки ошибок
+// Переопределяем базовый request
 const nativeRequest = api.request
 
 api.request = async function (...args) {
   try {
     const response = await nativeRequest.call(api, ...args)
-    console.log('response', response.json())
+    const data = await response.json()
-    return response.data
+    return data
   }
   catch (error) {
     console.error('API Request Error:', error)

pages/index.vue

@@ -1,8 +1,7 @@
 <template>
   <div>
-    productsData
     <pre>
-    {{ productsData }}
+    {{ productsData?.images?.filter(img => img?.src?.includes(colorVariants.blackCottonPolyester)) }}
     </pre>
   </div>
 </template>
@@ -11,4 +10,11 @@
 import { useGetProductsDetail } from '~/api/queries'
 
 const { data: productsData } = useGetProductsDetail(79)
+
+const colorVariants = {
+  beigeCottonPolyester: 'beige_cotton-polyester_',
+  blackCotton: 'black_cotton_',
+  greyCottonPolyester: 'grey_cotton-polyester_',
+  blackCottonPolyester: 'black_cotton-polyester_',
+}
 </script>