wpgraphql attributes query issues

37 Views Asked by At

When I query for products attributes:

query MyQuery {
  products {
    edges {
      node {
        id
      }
    }
    nodes {
      attributes {
        nodes {
          name
          options
          position
          visible
          variation
          scope
          label
          id
          attributeId
        }
      }
    }
  }
}

I get part of result:

 {
                "name": "Capacity",
                "options": [
                  "95-ml"
                ],
 {
                "name": "Manufacturer",
                "options": [
                  "pascal-morabito"
                ],
  1. The problem is with options, this display options like: pascal-morabito but i not see any field to display full option name like Pascal Morabito or 95 ml

  2. Next problem, I have query for display products WHERE category slug per page 25 products. With this products I map all attributes, and problem is in my ecoommerce filter example when I have in category 200 products, and when I display 25 products per page, then I see only attributes for sort for current page, but should display attributes to sort for all pages.

Here is my hook:

export const useProductsData = (offset, size) => {
  const params = useParams()
  const { handle } = params;

  const [products, setProducts] = useState([]);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);
  const [paginationInfo, setPaginationInfo] = useState({});

  const fetchProductsData = async () => {
    const query = gql`
    query GetProducts($offset: Int, $size: Int) {
        products(where: {offsetPagination: {offset: $offset, size: $size}, categoryIn: "${handle}", stockStatus: IN_STOCK}) {
        nodes {
          id
          sku
          slug
          status
          name
          attributes {
            nodes {
              label
              options
            }
          }
          image {
            sourceUrl
          }
          ... on SimpleProduct {
            id
            name
            price
          }
          ... on VariableProduct {
            id
            name
            price
          }
        }
        pageInfo {
          offsetPagination {
            hasMore
            hasPrevious
            total
          }
        }
      }
    }
  `;
  


  try {
    const result = await fetchWooCommerceData(query, { offset, size, handle });
    setProducts(result.products.nodes);
    setPaginationInfo({
      ...result.products.pageInfo,
      totalPages: Math.ceil(result.products.pageInfo.offsetPagination.total / size),
    });
    setLoading(false);
  } catch (error) {
    setError(error);
    setLoading(false);
  }
};

  // Call fetchProductData directly when the hook is invoked
  useEffect(() => {
    fetchProductsData();
  }, [offset, size, handle]);
 console.log("await", paginationInfo);
  return { products, loading, error, paginationInfo };
};

Here is screenshot, i have in this category example 1000products, but i can filter attributes only on current page so 25 products.

enter image description here

0

There are 0 best solutions below