Update 'Resource name' fields to meet UX guidelines: Model registries and Inference services

[jeff-phillips-18]

Towards RHOAIENG-14746

Description

Updates create/edit modals to use K8sNameDescriptionField component in order to meet current UX guidelines.
Modals updated:

• Model Registries
• Project Serving (these share the same name)
  • Serving Runtimes (project “model servers”)
  • Inference Services (project models)

Screen shots

Deploy model

Edit model

Model registry - Deploy model

How Has This Been Tested?

• Navigate to the Model Serving section

  • Select a project
  • Select Deploy model
  • Enter the model deployment name
  • View the resource name via the Edit resource name link.
  • Change the resource name to something invalid (ie. contains a space)
  • Verify the submit button is disabled
  • Change the resource name to something valid
  • Verify the submit button is enabled
  • Save the deployment.
  • Verify the deployment is created with the correct Display name and Resource Name.

• Navigate to the Model Serving section

  • For an existing Model, select the kebab and choose Edit
  • Update the Name field
  • Notice the resource name is not editable
  • Save the model server.
  • Verify the model is updated with the correct Display name.

• Navigate to the Model Registry section

  • Select an existing model
  • For a version, select the kebab and then Deploy
  • Select a project
  • Verify the model deployment name is set
  • Enter data for the rest of the form such that Deploy is enabled
  • View the resource name via the Edit resource name link.
  • Change the resource name to something invalid (ie. contains a space)
  • Verify the Deploy button is disabled
  • Change the resource name to something valid
  • Verify the Deploy button is enabled
  • Save the deployment.
  • Navigate to the Model Serving section
  • Find the new model created, select the kebab and choose Edit
  • Verify the deployment was created with the correct Display name and Resource Name.

• Navigate to a project that is not configured for kserve or model mesh

  • Select Select single-model from the Single-model serving platform card
  • Select Deploy model
  • Enter the model deployment name
  • Enter data for the rest of the form such that Deploy is enabled
  • View the resource name via the Edit resource name link.
  • Change the resource name to something invalid (ie. contains a space)
  • Verify the Deploy button is disabled
  • Change the resource name to something valid
  • Verify the Deploy button is enabled
  • Save the deployment.
  • Navigate to the Model Serving section
  • Find the new model created, select the kebab and choose Edit
  • Verify the deployment was created with the correct Display name and Resource Name.

• Navigate to a project this model servers and select the Models tab

  • Select Add model server
  • Enter the name for the new model server.
  • View the resource name via the Edit resource name link.
  • Change the resource name to something invalid (ie. contains a space)
  • Verify the submit button is disabled
  • Change the resource name to something valid
  • Verify the submit button is enabled
  • Save the profile.
  • Verify the profile is created with the correct Display name and Resource Name.

• Navigate to a project this model servers and select the Models tab

  • Select the kebab for an existing model server and choose Edit
  • Update the Name field
  • Notice the resource name is not editable
  • Save the model server.
  • Verify the model server is added with the correct Display name and resource name

Test Impact

Updated unit tests for new fields

Request review criteria:

• The developer has manually tested the changes and verified that the changes work
• Testing instructions have been added in the PR body (for PRs involving changes that are not immediately obvious).
• The developer has added tests or explained why testing cannot be added (unit or cypress tests for related changes)
• Included any necessary screenshots or gifs if it was a UI change.
• Included tags to the UX team if it was a UI/UX change.

/cc @simrandhaliw

[codecov]

Codecov Report

Attention: Patch coverage is 93.42105% with 5 lines in your changes missing coverage. Please review.

Project coverage is 85.33%. Comparing base (3ba248d) to head (08ff8b4).
Report is 24 commits behind head on main.

Files with missing lines	Patch %	Lines
...screens/projects/kServeModal/ManageKServeModal.tsx	93.18%	3 Missing ⚠️
...erenceServiceModal/ManageInferenceServiceModal.tsx	92.30%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3464      +/-   ##
==========================================
+ Coverage   85.24%   85.33%   +0.08%     
==========================================
  Files        1355     1353       -2     
  Lines       31074    31100      +26     
  Branches     8663     8684      +21     
==========================================
+ Hits        26489    26539      +50     
+ Misses       4585     4561      -24     

Files with missing lines	Coverage Δ
frontend/src/api/k8s/inferenceServices.ts	96.66% <100.00%> (ø)
...8sNameDescriptionField/K8sNameDescriptionField.tsx	100.00% <100.00%> (ø)
...ofiles/screens/manage/ManageAcceleratorProfile.tsx	100.00% <ø> (ø)
.../manage/ManageAcceleratorProfileDetailsSection.tsx	100.00% <100.00%> (ø)
...projects/NIMServiceModal/ManageNIMServingModal.tsx	87.21% <100.00%> (+0.29%)	⬆️
...d/src/pages/modelServing/screens/projects/utils.ts	93.49% <ø> (-0.06%)	⬇️
...erenceServiceModal/ManageInferenceServiceModal.tsx	93.75% <92.30%> (-0.08%)	⬇️
...screens/projects/kServeModal/ManageKServeModal.tsx	94.07% <93.18%> (+0.07%)	⬆️

... and 60 files with indirect coverage changes

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update aa74ed9...08ff8b4. Read the comment docs.

[emilys314]

I tested out the PR image and everything seems to work good for single and multi model serving. I didn't check model registry changes though

[christianvogt]

@jeff-phillips-18 the resource name isn't being used when deploying a model. It is always setting the resource name to the translated display name.

[christianvogt]

I think it makes sense to drop the section entirely and let the parent manage section considering we previously already removed the margin from the section.

[christianvogt]

/lgtm
/approve

[openshift-ci]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: christianvogt

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

The pull request process is described here

Needs approval from an approver in each of these files:

• frontend/OWNERS [christianvogt]

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