hide cat toogle in case only one cat is available

[Philip-Carneiro]

Description

When only one category is available for Model Catalog or MCP Catalog, the grid only show 4 cards and need to click in a link/toggle to show all the cards from that category.
These changes are made for when this happens, it shows all the cards available in that category (until the load more button appear)

• Added getActiveSourceLabels utility function
• Implemented conditional rendering logic

With this changes the behaviour will be:

1. Multiple active categories: Normal behaviour with category toggle visible
2. Single active category: Toggle hidden, category auto-selected via useEffect
3. No active categories: Empty state displayed

Before:

• non-PF mode:

• PF mode:

After:

• non-PF mode:

• PF mode:

How Has This Been Tested?

It was manually tested, also crated unit tests and 3 new cypress tests

Merge criteria:

• All the commits have been signed-off (To pass the DCO check)

• The commits have meaningful messages
• Automated tests are provided as part of the PR for major new functionalities; testing instructions have been added in the PR body (for PRs involving changes that are not immediately obvious).
• The developer has manually tested the changes and verified that the changes work.
• Code changes follow the kubeflow contribution guidelines.
• For first time contributors: Please reach out to the Reviewers to ensure all tests are being run, ensuring the label ok-to-test has been added to the PR.

If you have UI changes

• The developer has added tests or explained why testing cannot be added.
• Included any necessary screenshots or gifs if it was a UI change.
• Verify that UI/UX changes conform the UX guidelines for Kubeflow.

[ppadti]

Thanks @Philip-Carneiro !!
one question - @mturley @Philip-Carneiro
when there's only 1 category the toggle is hidden, but now the user has no way to know which category they're viewing. Would it be better to show the name and description when we have 1 category or should we leave it as is, not sure.

[manaswinidas]

+1 to Pushpa's suggestion - I think name and description should be there

[ppadti]

Sorry @Philip-Carneiro for the back and forth. The fix for the useEffect guard and the singleCategoryLabel prop looks good on the Model Catalog side — could we mirror the same changes in McpCatalog.tsx and McpCatalogGalleryView.tsx as well?

[Philip-Carneiro]

The fix for the useEffect guard and the singleCategoryLabel prop looks good on the Model Catalog side — could we mirror the same changes in McpCatalog.tsx and McpCatalogGalleryView.tsx as well?

I add the change requested

[ppadti]

/lgtm
/approve

[google-oss-prow]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: ppadti

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Details

Needs approval from an approver in each of these files:

• clients/ui/OWNERS [ppadti]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment