feat: show y Axis and corresponding grid lines for Metrics tab in Services/API Endpoints/Backend (#1381)

* feat(metrics): show y Axis and corresponding grid lines

* refactor: remove max series data points from y axis config

* feat: added y axis grid lines for metrics tab in API view

* feat: added y axis grid lines for metrics tab in Backends view

Author: jaywalker21

projects/observability/src/pages/apis/api-detail/metrics/api-metrics.dashboard.ts

@@ -201,6 +201,12 @@ export const apiMetricsDashboard: DashboardDefaultConfiguration = {
             'color-palette': RED_COLOR_PALETTE,
             'selectable-interval': true,
             'legend-position': LegendPosition.TopLeft,
+            'show-y-axis': true,
+            'y-axis': {
+              type: 'cartesian-axis',
+              'show-grid-lines': true,
+              'min-upper-limit': 25
+            },
             bands: [
               {
                 type: 'band',
@@ -383,6 +389,12 @@ export const apiMetricsDashboard: DashboardDefaultConfiguration = {
         type: 'cartesian-widget',
         'selectable-interval': true,
         'legend-position': LegendPosition.None,
+        'show-y-axis': true,
+        'y-axis': {
+          type: 'cartesian-axis',
+          'show-grid-lines': true,
+          'min-upper-limit': 25
+        },
         series: [
           {
             type: 'series',

projects/observability/src/pages/apis/backend-detail/metrics/backend-metrics.dashboard.ts

@@ -201,6 +201,12 @@ export const backendMetricsDashboard: DashboardDefaultConfiguration = {
             'color-palette': RED_COLOR_PALETTE,
             'selectable-interval': true,
             'legend-position': LegendPosition.TopLeft,
+            'show-y-axis': true,
+            'y-axis': {
+              type: 'cartesian-axis',
+              'show-grid-lines': true,
+              'min-upper-limit': 25
+            },
             series: [
               {
                 type: 'series',
@@ -351,6 +357,12 @@ export const backendMetricsDashboard: DashboardDefaultConfiguration = {
         type: 'cartesian-widget',
         'selectable-interval': true,
         'legend-position': LegendPosition.None,
+        'show-y-axis': true,
+        'y-axis': {
+          type: 'cartesian-axis',
+          'show-grid-lines': true,
+          'min-upper-limit': 25
+        },
         series: [
           {
             type: 'series',

projects/observability/src/pages/apis/service-detail/metrics/service-metrics.dashboard.ts

@@ -201,6 +201,12 @@ export const serviceMetricsDashboard: DashboardDefaultConfiguration = {
             'color-palette': RED_COLOR_PALETTE,
             'selectable-interval': true,
             'legend-position': LegendPosition.TopLeft,
+            'show-y-axis': true,
+            'y-axis': {
+              type: 'cartesian-axis',
+              'show-grid-lines': true,
+              'min-upper-limit': 25
+            },
             bands: [
               {
                 type: 'band',
@@ -383,6 +389,12 @@ export const serviceMetricsDashboard: DashboardDefaultConfiguration = {
         type: 'cartesian-widget',
         'selectable-interval': true,
         'legend-position': LegendPosition.None,
+        'show-y-axis': true,
+        'y-axis': {
+          type: 'cartesian-axis',
+          'show-grid-lines': true,
+          'min-upper-limit': 25
+        },
         series: [
           {
             type: 'series',