Limit storefront query by adding options: (take:Int)

[ashishkpaul]

On implementing vendure hardenplugin we need to limit storefront query by adding options: (take:Int) . Console Output debug 10/3/23, 11:46 AM - [HardenPlugin] Query.collections: CollectionList! childComplexity: 40, score: 3729 Discord Link: https://discord.com/channels/1100672177260478564/1123685243887566878

[gioboa]

Thanks I will look at it

[michaelbromley]

Yeah so the way the HardenPlugin works is that it assigns a "complexity score" to all queries, as a way to defend against too much resource usage from very computationallyy-expensive queries.

If you have a PaginatedList query (one that returns { totalItems: Int!, items: [Entity!]! } as is the case with the collections query, failing to pass a take option will result in a huge complexity penalty.

This line needs to have options added to it:

gql`
    query collections($options: CollectionListOptions) {
        collections(options: $options) {
            ....
    }

and then the argument needs to be added to the getCollections function, and then a take option passed whereever it is called.

[gioboa]

@michaelbromley thanks for the clarification 👍 @ashishkpaul can you try this solution?

[ashishkpaul]

@gioboa I tried, but it didn't compile successfully

Guidelines implemented as follows:

import gql from 'graphql-tag';
import { Collection, CollectionListOptions } from '~/generated/graphql';
import { shopSdk } from '~/graphql-wrapper';

export const getCollections = async () => {
    // return await shopSdk.collections().then((res) => res?.collections.items as Collection[]);
        return await shopSdk.collections({ options: { take: 25 } }).then((res) => res?.collections.items as Collection[]);

};

export const getCollectionBySlug = async (slug: string) => {
    return await shopSdk.collection({ slug }).then((res) => res.collection as Collection);
};

gql`
    query collections($options: CollectionListOptions) {
        collections(options: $options) {
            items {
                id
                name
                slug
                parent {
                    name
                }
                featuredAsset {
                    id
                    preview
                }
            }
        }
    }
`;

gql`
    query collection($slug: String, $id: ID) {
        collection(slug: $slug, id: $id) {
            id
            name
            slug
            breadcrumbs {
                id
                name
                slug
            }
            children {
                id
                name
                slug
                featuredAsset {
                    id
                    preview
                }
            }
        }
    }
`;

console output

 src/providers/shop/collections/collections.ts:7:44 - error TS2322: Type '{ take: number; }' is not assignable to type 'never'.

7 return await shopSdk.collections({ options: { take: 25 } }).then((res) => res?.collections.items as Collection[]);

[ashishkpaul]

Previous attempt yarn build && node server/entry.fastify

Second attemp with a code #(Guidelines implemented as follows:) yarn generate && yarn build && node server/entry.fastify

Console Output

dist/build/q-711e823d.js   54.06 kB │ gzip:  13.06 kB
dist/build/q-7528c755.js   55.00 kB │ gzip:  13.92 kB
dist/build/q-33c16fad.js   55.69 kB │ gzip:  13.71 kB
dist/build/q-c8e6942e.js  488.33 kB │ gzip: 126.10 kB
✓ built in 13.45s

> i18n-translate
> node_modules/.bin/localize-translate -s "*.js" -t src/locales/message.*.json -o dist/build/{{LOCALE}} -r ./dist/build

✓ Built client modules

error Command failed with exit code 1.

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[gioboa]

I will create you a new branch with this functionality, hold on.

[ashishkpaul]

Thanks, I am in a queue 🙋

On Wed, 4 Oct 2023, 11:01 Giorgio Boa, @.***> wrote:

I will create you a new branch with this functionality, hold on.

— Reply to this email directly, view it on GitHub https://github.com/vendure-ecommerce/storefront-qwik-starter/issues/135#issuecomment-1746163872, or unsubscribe https://github.com/notifications/unsubscribe-auth/AD4NU772JGVQOFIXEBHCW7LX5TYBLAVCNFSM6AAAAAA5QPPE6GVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTONBWGE3DGOBXGI . You are receiving this because you were mentioned.Message ID: @.*** com>

[gioboa]

Thanks, I am in a queue 🙋

This commit add the functionality https://github.com/vendure-ecommerce/storefront-qwik-starter/commit/64a364c46af3de73f0a13967ff610b8f8ecfafd7

[ashishkpaul]

Great, will try 👍

On Wed, 4 Oct 2023, 19:34 Giorgio Boa, @.***> wrote:

Thanks, I am in a queue 🙋

This commit add the functionality 64a364c https://github.com/vendure-ecommerce/storefront-qwik-starter/commit/64a364c46af3de73f0a13967ff610b8f8ecfafd7

— Reply to this email directly, view it on GitHub https://github.com/vendure-ecommerce/storefront-qwik-starter/issues/135#issuecomment-1746942779, or unsubscribe https://github.com/notifications/unsubscribe-auth/AD4NU7ZY5YVZSKZDTEFY2WLX5VUGNAVCNFSM6AAAAAA5QPPE6GVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTONBWHE2DENZXHE . You are receiving this because you were mentioned.Message ID: @.*** com>

[ashishkpaul]

Hi @gioboa, Now its returing corrrect complexity score for CollectionList

debug 10/4/23, 9:57 PM - [HardenPlugin] Query.collections: CollectionList!  childComplexity: 40, score: 132 

but returing higher complexity score of OrderList when clicked on "Purchase History"

debug 10/4/23, 10:01 PM - [HardenPlugin] OrderList.items: [Order!]! childComplexity: 25, score: 125 
debug 10/4/23, 10:01 PM - [HardenPlugin] OrderList.totalItems: Int! childComplexity: 0, score: 1 
debug 10/4/23, 10:01 PM - [HardenPlugin] Customer.orders: OrderList!    childComplexity: 126, score: 4962 
debug 10/4/23, 10:01 PM - [HardenPlugin] Query.activeCustomer: Customer childComplexity: 4963, score: 4964 
verbose 10/4/23, 10:01 PM - [HardenPlugin] Query complexity "anonymous": 4964 
error 10/4/23, 10:01 PM - [HardenPlugin] Query complexity of "anonymous" is 4964, which exceeds the maximum of 640 

[gioboa]

Is there a way to change this limit?

[ashishkpaul]

I have no idea about this. Maybe @michaelbromley can shed light on this.

[michaelbromley]

Yes, one thing is that you can simply raise the max query complexity in the HardenPlugin config:

import { HardenPlugin } from '@vendure/harden-plugin';

const config: VendureConfig = {
  // Add an instance of the plugin to the plugins array
  plugins: [
     HardenPlugin.init({
       maxQueryComplexity: 650,  <----- here
       apiMode: process.env.APP_ENV === 'dev' ? 'dev' : 'prod',
     }),
  ],
};

but with such a high complexity, I think there is just another unbounded list query in there. So the best thing would be to find any other list queries without a "take" param and add it.