[RHOAI-14745]: Apply Final Microcopy Changes #3403

jenny-s51 · 2024-10-30T18:00:39Z

https://issues.redhat.com/browse/RHOAIENG-14745

Description

Before

Environment Variable: Default Help Text

Environment Variable: Error Text

Environment Variable: Warning Text

"Attach existing connection" button tooltip in workbench creation form:

"Create connection" button in Connections tab of project view (tooltip does not exist here):

After

Environment Variable: Default Help Text

Environment Variable: Error Text

Environment Variable: Warning Text
'

"Attach existing connections" button tooltip in "Create workbench" form:

"Create connection" button tooltip in Connections tab of project view:

How Has This Been Tested?

Add field modal:
Connection Types -> "Edit" in kebab dropdown for connection type -> "Add field"

In workbench creation form:
Disable all connection types -> Navigate into a DSP -> Create workbench -> Verify "Attach existing connections" button is disabled and has correct microcopy on tooltip when hovered: "No connection types available".

In "Connections" tab of a DSP:
Disable all connection types -> Navigate into a DSP -> Go to "Connections" tab -> Verify "Create connection" button is disabled and has correct microcopy on tooltip when hovered: "No connection types available".

Test Impact

N/A - updates to microcopy

Request review criteria:

Self checklist (all need to be checked):

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)

If you have UI 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.

After the PR is posted & before it merges:

The developer has tested their solution on a cluster by using the image produced by the PR to main

codecov · 2024-10-30T18:56:55Z

Codecov Report

Attention: Patch coverage is 88.88889% with 2 lines in your changes missing coverage. Please review.

Project coverage is 85.96%. Comparing base (fdcdd51) to head (cbd718e).
Report is 2 commits behind head on main.

Files with missing lines	Patch %	Lines
...cts/screens/detail/connections/ConnectionsList.tsx	81.81%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3403      +/-   ##
==========================================
+ Coverage   85.94%   85.96%   +0.01%     
==========================================
  Files        1339     1339              
  Lines       30310    30323      +13     
  Branches     8369     8378       +9     
==========================================
+ Hits        26051    26068      +17     
+ Misses       4259     4255       -4

Files with missing lines	Coverage Δ
...nd/src/concepts/connectionTypes/validationUtils.ts	`100.00% <ø> (ø)`
...ctionTypes/manage/ConnectionTypeDataFieldModal.tsx	`85.48% <ø> (ø)`
...ens/spawner/connections/ConnectionsFormSection.tsx	`81.70% <100.00%> (+1.44%)`	⬆️
...cts/screens/detail/connections/ConnectionsList.tsx	`93.93% <81.81%> (+1.63%)`	⬆️

... and 2 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 fdcdd51...cbd718e. Read the comment docs.

christianvogt · 2024-10-30T19:58:57Z

frontend/src/pages/projects/screens/spawner/connections/ConnectionsFormSection.tsx

-                id="no-connections-tooltip"
-                content="No existing connections available"
+                id="no-connection-types-tooltip"
+                content="No connection types available"


We are attaching connections and not connection types.

Suggested change

content="No connection types available"

content="No connections available"

Furthermore, the create button may be disabled if there are no connection types.

Thanks @christianvogt , nice catch!

Wondering if we should then add another tooltip to the disabled create button for that case when there are no connection types, i.e.:

Currently if a user clicks the create button and toggles the modal, both the dropdown and the create button in the modal are disabled when there are no connection types:

When you have a moment would be great to get your thoughts on the best approach here @simrandhaliw

@jenny-s51, we should disable the button and display the tooltip upon hover. The tooltip text above also looks good to me.

Thank you @simrandhaliw , updated

christianvogt · 2024-10-30T20:42:49Z

frontend/src/pages/projects/screens/detail/connections/ConnectionsList.tsx

+                Create connection
+              </Button>
+              {enabledConnectionTypes.length === 0 && (
+                <Tooltip
+                  id="no-connection-types-tooltip"
+                  content="No connection types available"
+                  triggerRef={tooltipRef}
+                />
+              )}


We also have an Add connection that gets disabled just the same if there's no connection types. But right now there's no tooltip.
@simrandhaliw i think this button should also be named Add connection, no? Other pages don't mix create and add actions labels.

All instances of connection creation should use "Create" instead of "Add," since the opposite action is "Delete". If the opposite action were "Remove," then "Add" would be appropriate.

Also, we should update the preview drawer's modal heading from "Add connection" to "Create connection," as this is consistent with the terminology used for connection creation modals.

We also have an Add connection that gets disabled just the same if there's no connection types. But right now there's no tooltip.

@christianvogt Do you mean the "Create connection" action in the Connections tab of the Project details view? Yes, that is another instance where the same tooltip would be displayed for the disabled button.

There's several inconsistencies with other tabs. Perhaps it's best to create an issue to align them all instead of part of this PR.

frontend/src/pages/projects/screens/detail/connections/ConnectionsList.tsx

frontend/src/pages/projects/screens/spawner/connections/ConnectionsFormSection.tsx

christianvogt · 2024-11-04T21:21:44Z

frontend/src/pages/projects/screens/detail/connections/ConnectionsList.tsx

+                  Create connection
+                </Button>
+                {enabledConnectionTypes.length === 0 && (
+                  <Tooltip content="No connection types available" triggerRef={tooltipRef} />


Missing ID to go with the aria-describedby attribute.

Suggested change

<Tooltip content="No connection types available" triggerRef={tooltipRef} />

<Tooltip id="no-connection-types-tooltip" content="No connection types available" triggerRef={tooltipRef} />

Also noticed that the Add connection button doesn't have a tooltip when there is an existing connection but no connection types.

Thank you @christianvogt - applied these fixes

remove unused import disable create connection button and show tooltip on hover remove key, add aria-describedBy,format remove duplicate ID on button fix aria-describedBy check to match disabled check add ID, apply tooltip to disabled Add Connection button

christianvogt · 2024-11-04T21:55:58Z

/lgtm
/approve

openshift-ci · 2024-11-04T21:56:05Z

[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

openshift-ci bot requested review from Gkrumbach07 and pnaik1 October 30, 2024 18:00

jenny-s51 requested review from jeff-phillips-18, christianvogt and simrandhaliw and removed request for Gkrumbach07 and pnaik1 October 30, 2024 18:01

jenny-s51 force-pushed the RHOAIENG-14745 branch from 0a7864c to 85f2193 Compare October 30, 2024 18:04

christianvogt reviewed Oct 30, 2024

View reviewed changes

christianvogt reviewed Nov 4, 2024

View reviewed changes

jenny-s51 force-pushed the RHOAIENG-14745 branch 2 times, most recently from c525c96 to b43187b Compare November 4, 2024 19:44

christianvogt reviewed Nov 4, 2024

View reviewed changes

jenny-s51 force-pushed the RHOAIENG-14745 branch from fa4dfc6 to 4b414fd Compare November 4, 2024 21:40

jenny-s51 force-pushed the RHOAIENG-14745 branch from 4b414fd to cbd718e Compare November 4, 2024 21:41

openshift-ci bot assigned christianvogt Nov 4, 2024

openshift-ci bot added the lgtm label Nov 4, 2024

openshift-ci bot added the approved label Nov 4, 2024

openshift-merge-bot bot merged commit e44b1c6 into opendatahub-io:main Nov 4, 2024
6 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[RHOAI-14745]: Apply Final Microcopy Changes #3403

[RHOAI-14745]: Apply Final Microcopy Changes #3403

jenny-s51 commented Oct 30, 2024

codecov bot commented Oct 30, 2024 •

edited

Loading

christianvogt Oct 30, 2024

jenny-s51 Oct 30, 2024 •

edited

Loading

simrandhaliw Nov 1, 2024

jenny-s51 Nov 4, 2024

christianvogt Oct 30, 2024

simrandhaliw Nov 1, 2024

simrandhaliw Nov 1, 2024

christianvogt Nov 1, 2024

christianvogt Nov 4, 2024

jenny-s51 Nov 4, 2024

christianvogt commented Nov 4, 2024

openshift-ci bot commented Nov 4, 2024

	content="No connection types available"
	content="No connections available"

	<Tooltip content="No connection types available" triggerRef={tooltipRef} />
	<Tooltip id="no-connection-types-tooltip" content="No connection types available" triggerRef={tooltipRef} />

[RHOAI-14745]: Apply Final Microcopy Changes #3403

[RHOAI-14745]: Apply Final Microcopy Changes #3403

Conversation

jenny-s51 commented Oct 30, 2024

Description

How Has This Been Tested?

Test Impact

Request review criteria:

codecov bot commented Oct 30, 2024 • edited Loading

Codecov Report

Choose a reason for hiding this comment

jenny-s51 Oct 30, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

christianvogt commented Nov 4, 2024

openshift-ci bot commented Nov 4, 2024

codecov bot commented Oct 30, 2024 •

edited

Loading

jenny-s51 Oct 30, 2024 •

edited

Loading