import GetProduct from '@/graphql/product.graphql?raw';

export const useProduct = (id: string) => {
  const { $directus } = useNuxtApp();

  const { getDirectusLocale } = useLocalizations();
  const locale = getDirectusLocale();

  return useAsyncData(`product-${id}-${locale}`, async () => {
    return await $directus.query<{ products_by_id: Product }>(GetProduct, {
      id: id,
      locale: locale,
    });
    // return await $directus.request(
    //   readItem('products', id, {
    //     fields: [
    //       'id',
    //       { translations: ['id', 'name', 'summary', 'description'] },
    //       {
    //         images: [
    //           'id',
    //           {
    //             product_images_id: [
    //               'id',
    //               'image',
    //               { translations: ['id', 'caption'] },
    //             ],
    //           },
    //         ],
    //       },
    //       {
    //         specs: [
    //           'id',
    //           {
    //             translations: ['*'],
    //           },
    //           {
    //             specs: [
    //               'id',
    //               {
    //                 translations: ['id', 'key', 'value'],
    //               },
    //             ],
    //           },
    //         ],
    //       },
    //       {
    //         faqs: [
    //           'id',
    //           {
    //             questions_id: [
    //               'id',
    //               {
    //                 translations: ['id', 'title', 'content'],
    //               },
    //             ],
    //           },
    //         ],
    //       },
    //       {
    //         documents: [
    //           'id',
    //           {
    //             product_documents_id: [
    //               'id',
    //               {
    //                 file: ['id', 'filesize', 'filename_download'],
    //               },
    //               {
    //                 translations: ['id', 'title'],
    //               },
    //             ],
    //           },
    //         ],
    //       },
    //     ],
    //     deep: {
    //       translations: {
    //         _filter: {
    //           languages_code: { _eq: locale },
    //         },
    //       },
    //       images: {
    //         product_images_id: {
    //           translations: {
    //             _filter: {
    //               languages_code: { _eq: locale },
    //             },
    //           },
    //         },
    //       },
    //       faqs: {
    //         questions_id: {
    //           translations: {
    //             _filter: {
    //               languages_code: { _eq: locale },
    //             },
    //           },
    //         },
    //       },
    //       documents: {
    //         documents_id: {
    //           translations: {
    //             _filter: {
    //               languages_code: { _eq: locale },
    //             },
    //           },
    //         },
    //       },
    //     },
    //   })
    // );
  });
};