Fix tooltips messages in the graphs at DR Policy dashboard #1061

TimothyAsirJeyasing · 2023-10-03T08:14:53Z

https://bugzilla.redhat.com/show_bug.cgi?id=2239093 https://bugzilla.redhat.com/show_bug.cgi?id=2239096 https://bugzilla.redhat.com/show_bug.cgi?id=2239101

TimothyAsirJeyasing · 2023-10-03T08:15:53Z

@GowthamShanmugam Please review

openshift-merge-robot · 2023-10-03T09:30:33Z

@TimothyAsirJeyasing: The following test failed, say /retest to rerun all failed tests or /retest-required to rerun all mandatory failed tests:

Test name	Commit	Details	Required	Rerun command
ci/prow/odf-console-e2e-aws	`3dc217c`	link	true	`/test odf-console-e2e-aws`

Full PR test history. Your PR dashboard.

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository. I understand the commands that are listed here.

SanjalKatiyar · 2023-10-03T09:55:37Z

plz add screenshots to the PR (all pages where changes have been made)...

GowthamShanmugam · 2023-10-03T11:09:04Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+              <p className="odf-dashboard-body">
+                Note: Only inbound values are displayed exclusively for block
+                volumes (ceph rbd) and include snapshots from all applications
+                excluding apps using file voluems (cephfs).


Suggested change

excluding apps using file voluems (cephfs).

excluding apps using file volumes (cephfs).

Here all text under Note should be muted

GowthamShanmugam · 2023-10-03T11:11:40Z

packages/mco/components/mco-dashboard/data-policy/alert-card/alert-card.tsx

@@ -16,6 +19,12 @@ export const AlertsCard: React.FC = () => {
          alerts={alerts}
          AlertItemComponent={AlertItem}
          alertsFilter={filterDRAlerts}
+          titleToolTip={
+            <Trans t={t}>
+              <b>Note:</b> Alerts are deployed for both <b>ApplicationsSet</b>{' '}


Suggested change

Note: Alerts are deployed for both ApplicationsSet{' '}

Note: Alerts are deployed for both ApplicationSet{' '}

GowthamShanmugam · 2023-10-03T11:16:26Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+              <p className="odf-dashboard-body">
+                Note: Only inbound values are displayed exclusively for block
+                volumes (ceph rbd) and include snapshots from all applications
+                excluding apps using file voluems (cephfs).


Suggested change

excluding apps using file voluems (cephfs).

excluding apps using file volumes (cephfs).

GowthamShanmugam · 2023-10-03T11:23:14Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+                This graph provides an overview of the total number of snapshots
+                synced across your clusters.
+              </p>
+              <p className="odf-dashboard-body">


Suggested change





incase mco-cluster-app__text--margin-top is giving too much space try to create new class

GowthamShanmugam · 2023-10-03T11:24:02Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+                for the cluster i.e, rate at which data is replicated within the
+                cluster.
+              </p>
+              <p className="odf-dashboard-body">


Suggested change



refer: https://github.com/red-hat-storage/odf-console/pull/1061/files#r1343941666

GowthamShanmugam · 2023-10-03T11:27:23Z

packages/mco/components/mco-dashboard/data-policy/summary-card/summary-card.tsx

+                <FieldLevelHelp>
+                  <Trans t={t}>
+                    <b>Note:</b> The applications count displayed herein pertain
+                    exclusively to <b>ApplicationsSet</b> type applications.


Suggested change

exclusively to ApplicationsSet type applications.

exclusively to ApplicationSet type applications.

this comment is still active

GowthamShanmugam · 2023-10-03T11:30:12Z

You missed two changes from UX:

Change Application: All ApplicationSet (On application name dropdown)
The Total PVC count card has been changed to Protected PVCs and Protected PVCs with issues. (Remove PVCsSection completely and re-use ProtectedPVCsSection component), Also move ProtectedPVCsSection to common.tsx

TimothyAsirJeyasing · 2023-10-03T15:31:41Z

GowthamShanmugam · 2023-10-04T06:38:11Z

packages/mco/components/mco-dashboard/data-policy/alert-card/alert-card.tsx

@@ -16,6 +19,12 @@ export const AlertsCard: React.FC = () => {
          alerts={alerts}
          AlertItemComponent={AlertItem}
          alertsFilter={filterDRAlerts}
+          titleToolTip={
+            <Trans t={t}>
+              <b>Note:</b> Alerts are deployed for both <b>ApplicationSet</b>{' '}


Suggested change

Note: Alerts are deployed for both ApplicationSet{' '}

Note: Alerts are displayed for both ApplicationSet{' '}

GowthamShanmugam · 2023-10-04T06:39:56Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster-app-card.tsx

          protectedPVCData={protectedPVCData}
-          clusterName={clusterName}
+          selectedAppSet={null}


Suggested change

selectedAppSet={null}

check this comment

GowthamShanmugam · 2023-10-04T07:12:56Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/common.tsx

+  const updateProtectedPVC = React.useCallback(() => {
+    const placementInfo = selectedAppSet?.placementInfo?.[0];
+
+    const issueCount =
+      protectedPVCData?.reduce((acc, protectedPVCItem) => {
+        const drpcChecks =
+          selectedAppSet &&
+          protectedPVCItem?.drpcName === placementInfo?.drpcName &&
+          protectedPVCItem?.drpcNamespace === placementInfo?.drpcNamespace;
+
+        const replicationHealth = getVolumeReplicationHealth(
+          getTimeDifferenceInSeconds(protectedPVCItem?.lastSyncTime),
+          protectedPVCItem?.schedulingInterval
+        )[0];
+
+        if (
+          (!selectedAppSet &&
+            replicationHealth !== VOLUME_REPLICATION_HEALTH.HEALTHY) ||
+          (selectedAppSet &&
+            drpcChecks &&
+            replicationHealth !== VOLUME_REPLICATION_HEALTH.HEALTHY)
+        ) {
+          return acc + 1;
+        } else {
+          return acc;
+        }
+      }, 0) || 0;
+
+    setProtectedPVC([protectedPVCData?.length || 0, issueCount]);
+  }, [selectedAppSet, protectedPVCData, setProtectedPVC]);


Suggested change

const updateProtectedPVC = React.useCallback(() => {

const placementInfo = selectedAppSet?.placementInfo?.[0];

const issueCount =

protectedPVCData?.reduce((acc, protectedPVCItem) => {

const drpcChecks =

selectedAppSet &&

protectedPVCItem?.drpcName === placementInfo?.drpcName &&

protectedPVCItem?.drpcNamespace === placementInfo?.drpcNamespace;

const replicationHealth = getVolumeReplicationHealth(

getTimeDifferenceInSeconds(protectedPVCItem?.lastSyncTime),

protectedPVCItem?.schedulingInterval

)[0];

if (

(!selectedAppSet &&

replicationHealth !== VOLUME_REPLICATION_HEALTH.HEALTHY) ||

(selectedAppSet &&

drpcChecks &&

replicationHealth !== VOLUME_REPLICATION_HEALTH.HEALTHY)

) {

return acc + 1;

} else {

return acc;

}

}, 0) || 0;

setProtectedPVC([protectedPVCData?.length || 0, issueCount]);

}, [selectedAppSet, protectedPVCData, setProtectedPVC]);

const updateProtectedPVC = React.useCallback(() => {

const placementInfo = selectedAppSet?.placementInfo?.[0];

const issueCount =

protectedPVCData?.reduce((acc, protectedPVCItem) => {

const replicationHealth = getVolumeReplicationHealth(

getTimeDifferenceInSeconds(protectedPVCItem?.lastSyncTime),

protectedPVCItem?.schedulingInterval

)[0];

!!selectedAppSet :

protectedPVCItem?.drpcName === placementInfo?.drpcName &&

protectedPVCItem?.drpcNamespace === placementInfo?.drpcNamespace &&

replicationHealth !== VOLUME_REPLICATION_HEALTH.HEALTHY && acc ++

? replicationHealth !== VOLUME_REPLICATION_HEALTH.HEALTHY && acc ++

return acc;

}, 0) || 0;

setProtectedPVC([protectedPVCData?.length || 0, issueCount]);

}, [selectedAppSet, protectedPVCData, setProtectedPVC]);

GowthamShanmugam · 2023-10-04T07:17:13Z

packages/mco/components/mco-dashboard/data-policy/summary-card/summary-card.tsx

+                <FieldLevelHelp>
+                  <Trans t={t}>
+                    <b>Note:</b> The applications count displayed herein pertain
+                    exclusively to <b>ApplicationsSet</b> type applications.


this comment is still active

GowthamShanmugam · 2023-10-04T07:17:59Z

packages/mco/constants/dashboard.ts

@@ -1,4 +1,4 @@
-export const ALL_APPS = 'All applications';
+export const ALL_APPS = 'All applicationSet';


Suggested change

export const ALL_APPS = 'All applicationSet';

export const ALL_APPS = 'All ApplicationSet';

GowthamShanmugam · 2023-10-04T07:23:21Z

Test this with some affected PVC, I want to see the PVC count (Total, as well as affected)here for the cluster and application view.

Create at least two apps under the same cluster and protect PVCs. one app with PVC replication affected and the other one with all healthy.

TimothyAsirJeyasing · 2023-10-04T11:00:17Z

TimothyAsirJeyasing · 2023-10-04T14:03:19Z

/retest

GowthamShanmugam · 2023-10-05T07:13:51Z

/cherry-pick release-4.14

openshift-cherrypick-robot · 2023-10-05T07:13:52Z

@GowthamShanmugam: once the present PR merges, I will cherry-pick it on top of release-4.14 in a new PR and assign it to you.

In response to this:

/cherry-pick release-4.14

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

GowthamShanmugam · 2023-10-05T07:14:25Z

/cherry-pick release-4.14-compatibility

openshift-cherrypick-robot · 2023-10-05T07:14:27Z

@GowthamShanmugam: once the present PR merges, I will cherry-pick it on top of release-4.14-compatibility in a new PR and assign it to you.

In response to this:

/cherry-pick release-4.14-compatibility

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

GowthamShanmugam · 2023-10-05T07:17:38Z

/approve

GowthamShanmugam · 2023-10-05T10:58:54Z

/retest

TimothyAsirJeyasing · 2023-10-06T12:03:24Z

GowthamShanmugam · 2023-10-06T12:45:58Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+          titleToolTip={
+            <Trans t={t}>
+              The graph displays the total number of block volumes inbound
+              snapshots, by cluster, from all AppicationSet and Subscription


Suggested change

snapshots, by cluster, from all AppicationSet and Subscription

snapshots, by cluster, from all ApplicationSet and Subscription

GowthamShanmugam · 2023-10-06T12:49:08Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+            <Trans t={t}>
+              The graph displays the total number of block volumes inbound
+              snapshots, by cluster, from all AppicationSet and Subscription
+              type applications. Applications that use file volumes are excluded
+              in the total snapshot count.
+            </Trans>


Suggested change

<Trans t={t}>

The graph displays the total number of block volumes inbound

snapshots, by cluster, from all AppicationSet and Subscription

type applications. Applications that use file volumes are excluded

in the total snapshot count.

</Trans>

t("

The graph displays the total number of block volumes inbound

snapshots, by cluster, from all AppicationSet and Subscription

type applications. Applications that use file volumes are excluded

in the total snapshot count.")

try t instead of , we dont have any tags inside the string. And test once how it looks like in tooltip,

GowthamShanmugam · 2023-10-06T12:53:10Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

+            <Trans t={t}>
+              The graph displays the average replication throughput inbound, by
+              cluster, from all ApplicationSet and Subscription type
+              applications. Applications that use file volumes are excluded in
+              the replication throughput.
+            </Trans>


same here, use t instead of

TimothyAsirJeyasing · 2023-10-06T19:41:44Z

/retest

GowthamShanmugam · 2023-10-09T08:58:50Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster-app-card.tsx

 import {
  HealthSection,
  PeerConnectionSection,
  ApplicationsSection,
-  PVCsSection,
+  // PVCsSection,


Suggested change

// PVCsSection,

GowthamShanmugam · 2023-10-09T09:12:51Z

/hold cancel

GowthamShanmugam · 2023-10-09T09:23:01Z

/hold

GowthamShanmugam · 2023-10-09T09:25:46Z

packages/mco/components/mco-dashboard/data-policy/cluster-app-card/cluster.tsx

@@ -228,33 +221,6 @@ export const ApplicationsSection: React.FC<ApplicationsSectionProps> = ({
  );
 };

-export const PVCsSection: React.FC<PVCsSectionProps> = ({


Remove dead code for PVCsSection component(All count_persistentvolumeclaim_total metrics-related queries have to be removed).

https://bugzilla.redhat.com/show_bug.cgi?id=2239093 https://bugzilla.redhat.com/show_bug.cgi?id=2239096 https://bugzilla.redhat.com/show_bug.cgi?id=2239101 Signed-off-by: Timothy Asir Jeyasingh <[email protected]>

openshift-ci · 2023-10-09T09:50:16Z

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: GowthamShanmugam, SanjalKatiyar, TimothyAsirJeyasing

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:

~~OWNERS~~ [SanjalKatiyar]

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

GowthamShanmugam · 2023-10-09T09:50:33Z

/ hold cancel

GowthamShanmugam · 2023-10-09T09:50:41Z

/hold cancel

openshift-cherrypick-robot · 2023-10-09T11:11:38Z

@GowthamShanmugam: new pull request created: #1070

In response to this:

/cherry-pick release-4.14

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

openshift-cherrypick-robot · 2023-10-09T11:12:17Z

@GowthamShanmugam: new pull request created: #1071

In response to this:

/cherry-pick release-4.14-compatibility

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

GowthamShanmugam reviewed Oct 3, 2023

View reviewed changes

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch 2 times, most recently from 39006b2 to 6280876 Compare October 3, 2023 15:27

GowthamShanmugam reviewed Oct 4, 2023

View reviewed changes

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from 6280876 to 863b650 Compare October 4, 2023 11:00

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from 863b650 to 4de03e6 Compare October 4, 2023 12:12

GowthamShanmugam approved these changes Oct 4, 2023

View reviewed changes

openshift-ci bot assigned GowthamShanmugam Oct 4, 2023

openshift-ci bot added the lgtm label Oct 4, 2023

GowthamShanmugam approved these changes Oct 5, 2023

View reviewed changes

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from 4de03e6 to d7b9561 Compare October 5, 2023 11:25

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from d7b9561 to b7e5c7e Compare October 6, 2023 12:01

openshift-ci bot removed the lgtm label Oct 6, 2023

GowthamShanmugam reviewed Oct 6, 2023

View reviewed changes

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from b7e5c7e to d25df0f Compare October 6, 2023 13:12

GowthamShanmugam reviewed Oct 9, 2023

View reviewed changes

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from d25df0f to ad9e5b7 Compare October 9, 2023 09:11

GowthamShanmugam approved these changes Oct 9, 2023

View reviewed changes

openshift-ci bot added the lgtm label Oct 9, 2023

openshift-ci bot removed the do-not-merge/hold label Oct 9, 2023

openshift-ci bot added the do-not-merge/hold label Oct 9, 2023

GowthamShanmugam reviewed Oct 9, 2023

View reviewed changes

Fix tooltips messages in the graphs at DR Policy dashboard

7a65f75

https://bugzilla.redhat.com/show_bug.cgi?id=2239093 https://bugzilla.redhat.com/show_bug.cgi?id=2239096 https://bugzilla.redhat.com/show_bug.cgi?id=2239101 Signed-off-by: Timothy Asir Jeyasingh <[email protected]>

TimothyAsirJeyasing force-pushed the bz-2239101-2239093-2239096 branch from ad9e5b7 to 7a65f75 Compare October 9, 2023 09:39

openshift-ci bot removed the lgtm label Oct 9, 2023

GowthamShanmugam approved these changes Oct 9, 2023

View reviewed changes

openshift-ci bot added the lgtm label Oct 9, 2023

openshift-ci bot removed the do-not-merge/hold label Oct 9, 2023

openshift-ci bot merged commit 1ac3c70 into red-hat-storage:master Oct 9, 2023
3 checks passed

openshift-cherrypick-robot mentioned this pull request Oct 9, 2023

[release-4.14] Bug 2239093: Fix tooltips messages in the graphs at DR Policy dashboard #1070

Closed

openshift-cherrypick-robot mentioned this pull request Oct 9, 2023

[release-4.14-compatibility] Bug 2239093: Fix tooltips messages in the graphs at DR Policy dashboard #1071

Closed

openshift-ci bot mentioned this pull request Oct 11, 2023

Bug 2239093: [release-4.14] Fix tooltips messages in the graphs at DR Policy dashboard #1074

Merged

	excluding apps using file voluems (cephfs).
	excluding apps using file volumes (cephfs).

	<b>Note:</b> Alerts are deployed for both <b>ApplicationsSet</b>{' '}
	<b>Note:</b> Alerts are deployed for both <b>ApplicationSet</b>{' '}

	<p className="odf-dashboard-body">
	<p className="text-muted mco-cluster-app__text--margin-top">

	exclusively to <b>ApplicationsSet</b> type applications.
	exclusively to <b>ApplicationSet</b> type applications.

	<b>Note:</b> Alerts are deployed for both <b>ApplicationSet</b>{' '}
	<b>Note:</b> Alerts are displayed for both <b>ApplicationSet</b>{' '}

		@@ -1,4 +1,4 @@
		export const ALL_APPS = 'All applications';
		export const ALL_APPS = 'All applicationSet';

	snapshots, by cluster, from all AppicationSet and Subscription
	snapshots, by cluster, from all ApplicationSet and Subscription

Fix tooltips messages in the graphs at DR Policy dashboard #1061

Fix tooltips messages in the graphs at DR Policy dashboard #1061

Conversation

TimothyAsirJeyasing commented Oct 3, 2023

TimothyAsirJeyasing commented Oct 3, 2023

openshift-merge-robot commented Oct 3, 2023

SanjalKatiyar commented Oct 3, 2023

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

GowthamShanmugam commented Oct 3, 2023 • edited Loading

TimothyAsirJeyasing commented Oct 3, 2023

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

GowthamShanmugam commented Oct 4, 2023

TimothyAsirJeyasing commented Oct 4, 2023

TimothyAsirJeyasing commented Oct 4, 2023

GowthamShanmugam commented Oct 5, 2023

openshift-cherrypick-robot commented Oct 5, 2023

GowthamShanmugam commented Oct 5, 2023

openshift-cherrypick-robot commented Oct 5, 2023

GowthamShanmugam commented Oct 5, 2023

GowthamShanmugam commented Oct 5, 2023

TimothyAsirJeyasing commented Oct 6, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

TimothyAsirJeyasing commented Oct 6, 2023

Choose a reason for hiding this comment

GowthamShanmugam commented Oct 9, 2023

GowthamShanmugam commented Oct 9, 2023

Choose a reason for hiding this comment

openshift-ci bot commented Oct 9, 2023

GowthamShanmugam commented Oct 9, 2023

GowthamShanmugam commented Oct 9, 2023

openshift-cherrypick-robot commented Oct 9, 2023

openshift-cherrypick-robot commented Oct 9, 2023

GowthamShanmugam commented Oct 3, 2023 •

edited

Loading