upcoming: [UIE-9814] - Implement the main product grid with category grouping and load more functionality #13267
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…grouping and load more functionality
| placeholderData: keepPreviousData, | ||
| }); | ||
|
|
||
| export const useAllMarketplacePartnersQuery = ( |
Contributor
There was a problem hiding this comment.
Could we update this name to useAllMarketplacePartnersMapQuery for more clarity?
Comment on lines
174
to
176
| return { | ||
| partnersById, | ||
| }; |
Contributor
There was a problem hiding this comment.
Suggested change
| return { | |
| partnersById, | |
| }; | |
| return partnersById; |
packages/manager/src/features/Marketplace/MarketplaceLanding/CategorySection.tsx
Show resolved
Hide resolved
Comment on lines
27
to
37
| export interface ProductCardData { | ||
| data: { | ||
| companyName: string; | ||
| description: string; | ||
| logoUrl: string; | ||
| productName: string; | ||
| productTag?: string; | ||
| type: string; | ||
| }; | ||
| id: number; | ||
| } |
Contributor
There was a problem hiding this comment.
Suggested change
| export interface ProductCardData { | |
| data: { | |
| companyName: string; | |
| description: string; | |
| logoUrl: string; | |
| productName: string; | |
| productTag?: string; | |
| type: string; | |
| }; | |
| id: number; | |
| } | |
| export interface ProductCardItem { | |
| data: ProductCardData; | |
| id: number; | |
| } |
Let's reuse the ProductCardData type defined in ProductSelectionCard to avoid duplicating types and names
Comment on lines
+76
to
+82
| const products = React.useMemo( | ||
| () => | ||
| productsData?.pages.flatMap((page) => page.data) ?? | ||
| filteredProducts ?? | ||
| [], | ||
| [productsData, filteredProducts] | ||
| ); |
Contributor
There was a problem hiding this comment.
We can simplify this since filteredProducts isn't needed here:
const products = React.useMemo(
() => productsData?.pages.flatMap((page) => page.data) ?? [],
[productsData]
);
| isLoading, | ||
| } = useAllMarketplaceCategoriesQuery({}, {}, true); | ||
|
|
||
| const filteredProducts = marketplaceProductFactory.buildList(5); |
Contributor
There was a problem hiding this comment.
Suggested change
| const filteredProducts = marketplaceProductFactory.buildList(5); |
|
|
||
| const filteredProducts = marketplaceProductFactory.buildList(5); | ||
|
|
||
| const categories = categoriesData || marketplaceCategoryFactory.buildList(5); |
Contributor
There was a problem hiding this comment.
Suggested change
| const categories = categoriesData || marketplaceCategoryFactory.buildList(5); |
Let's avoid using factories here
|
|
||
| export const MarketplaceLanding = () => { | ||
| const { | ||
| data: categoriesData, |
Contributor
There was a problem hiding this comment.
Suggested change
| data: categoriesData, | |
| data: categories, |
| <CategorySection | ||
| key={category.id} | ||
| {...category} | ||
| filteredProducts={filteredProducts} |
Contributor
There was a problem hiding this comment.
Suggested change
| filteredProducts={filteredProducts} | |
| filters={globalFilters} |
reason mentioned here: #13267 (comment)
| category.products_count > 0 && ( | ||
| <CategorySection | ||
| key={category.id} | ||
| {...category} |
Contributor
There was a problem hiding this comment.
Suggested change
| {...category} | |
| category={category} |
Collaborator
Cloud Manager UI test results🔺 1 failing test on test run #2 ↗︎
Details
TroubleshootingUse this command to re-run the failing tests: pnpm cy:run -s "cypress/e2e/core/linodes/clone-linode.spec.ts" |
|||||||||||||||||
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description 📝
Highlight the Pull Request's context and intentions.
Changes 🔄
List any change(s) relevant to the reviewer.
Scope 🚢
Upon production release, changes in this PR will be visible to:
Target release date 🗓️
Please specify a release date (and environment, if applicable) to guarantee timely review of this PR. If exact date is not known, please approximate and update it as needed.
Preview 📷
Include a screenshot
<img src="" />or video<video src="" />of the change.🔒 Use the Mask Sensitive Data setting for security.
💡 For changes requiring multiple steps to validate, prefer a video for clarity.
How to test 🧪
Prerequisites
(How to setup test environment)
Reproduction steps
(How to reproduce the issue, if applicable)
Verification steps
(How to verify changes)
Author Checklists
As an Author, to speed up the review process, I considered 🤔
👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support
As an Author, before moving this PR from Draft to Open, I confirmed ✅