Fix/catalog source error messages

[Philip-Carneiro]

Description

This PR improve the labels/text and show the error message from backend when the backend handle the error from YAML

Part 1: Error Handling Improvements

• Preview panel errors: Replaced generic "Failed to preview the results" with "Preview failed" title while displaying the detailed backend error message in the body, giving users actionable information about what went wrong.
• Save button errors: Replaced generic "Error saving source" with "Failed to save source" and surfaces the detailed backend error message.
• YAML file upload errors: Added FileReader.onError handler in YamlSection that displays an inline danger alert with the message: "File upload failed — The YAML file couldn't be uploaded. Check its syntax and structure, then try again."
• HF validation errors: Updated "Connection failed" to "Validation failed" with detailed backend error message passthrough.
• All error/success strings centralized in constants.tsx (ERROR_MESSAGES, SUCCESS_MESSAGES).

Note: No custom YAML validation logic was added to the frontend. Validation is the backend's responsibility; the UI only surfaces error messages returned by the API.

Part 2: Microcopy Updates

Page header:

• Page title: "Model catalog settings" → "Model catalog sources"

Table column names:

Old	New
Name	Source name
Organization allowed	Organization
Filters	Model visibility
Status	Validation status

Column popovers:

• Organization popover updated: meta-llama → Google
• Model visibility popover rewritten with "All models" / "Filtered" definitions
• Enable popover updated

Form fields:

• Organization label: "Allowed organization" → "Organization"
• Organization helper text updated with Google
• Organization placeholder: meta-llama → Google
• Access token refactored to use ThemeAwareFormGroupWrapper with separate description and helper text nodes
• Access token description updated to include webhook permissions
• Included/Excluded models: unified placeholders to Example: Llama*, Llama-3.1-8B-Instruct
• Included/Excluded models helper text simplified
• Enable source description updated

Empty states:

• Preview empty state: removed "with your current configuration"
• No models included/excluded messages moved to constants

Part 3: Component Refactoring

• Replaced raw FormGroup + FormFieldset with ThemeAwareFormGroupWrapper in: CredentialsSection, ModelVisibilitySection, ManageSourceForm (enable-source checkbox)
• Migrated pf-v5-* CSS classes to pf-v6-* in CredentialsSection
• Consolidated DESCRIPTIONS and HELP_TEXT into DESCRIPTION_TEXT and HELPER_TEXT
• Unified HF/generic placeholders (ALLOWED_MODELS_HF / ALLOWED_MODELS_GENERIC → ALLOWED_MODELS)
• All hardcoded strings moved to constants.tsx: ERROR_MESSAGES, SUCCESS_MESSAGES, TABLE_COLUMN_LABELS, TABLE_COLUMN_POPOVERS, EMPTY_STATE_TEXT
• CatalogSourceConfigsTableColumns.tsx now references constants instead of inline strings
• CatalogSourceStatusErrorModal.tsx uses ERROR_MESSAGES constants

Screen Shots

Before:

• PF mode

• non-PF mode:

After:

• PF mode:

• non-PF mode:

Files Changed (13)

File	Change
constants.tsx	Centralized all UI strings, added error/success/table/empty-state constants
CredentialsSection.tsx	ThemeAwareFormGroupWrapper, PF v5→v6, constants
ManageSourceForm.tsx	ThemeAwareFormGroupWrapper for enable-source, error constants
ManageSourceFormFooter.tsx	Error title from constants
ModelVisibilitySection.tsx	ThemeAwareFormGroupWrapper, unified placeholders
PreviewPanel.tsx	Error/empty-state text from constants
YamlSection.tsx	FileReader error handler, description/helper text nodes
CatalogSourceStatusErrorModal.tsx	Error text from constants
CatalogSourceConfigsTableColumns.tsx	Column labels/popovers from constants
modelCatalogSettings.ts (route)	Page title updated
modelCatalogSettings.ts (Cypress page)	Heading/breadcrumb/nav updated
modelCatalogSettings.cy.ts (Cypress test)	"your source" → "this source"
PreviewPanel.spec.tsx	Updated error title expectation

How Has This Been Tested?

• Cypress page objects updated to match new microcopy
• Cypress test assertions updated for "this source" wording
• Manual verification of error propagation chain from backend through handleRestFailures → component state → UI rendering

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.

[manaswinidas]

Please change the screenshots accordingly

[manaswinidas]

@yih-wang can you have a look at the error message screenshots ?

[yih-wang]

The screenshots look good. I don't see the screenshots for preview errors if that's what you referred to though... @manaswinidas

[yih-wang]

For the validation status column, the success term should be Ready instead of Connected.

[manaswinidas]

I don't see this "Source configuration changed. Refresh the preview. [Refresh preview]"

[manaswinidas]

/lgtm
/approve

nvm - others already exist

[google-oss-prow]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: manaswinidas

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 [manaswinidas]

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