Filter functionality + load more using wpgraphql, nextjs & react from URL query strings (headless woocommerce)

Help me build a filter functionality for a headless woocommerce project (in nextjs using react and wpgraphql / apollo client or useRouter). Filter fields should include: price range, sort by (price - low-high & latest), global attributes (e.g paBrand, paSize, paColor, paFit, paMaterial) - be able to to multi-select those and filter data, the url will need to change as user filters. also load more pagination with graphql cursors