diff --git a/dashboards-observability/common/constants/metrics.ts b/dashboards-observability/common/constants/metrics.ts
index 066e7373d..0facdc693 100644
--- a/dashboards-observability/common/constants/metrics.ts
+++ b/dashboards-observability/common/constants/metrics.ts
@@ -6,8 +6,8 @@
 // requests constants
 export const VISUALIZATION = 'viz';
 export const SAVED_VISUALIZATION = 'savedVisualization';
-export const PPL_PROMETHEUS_CATALOG_REQUEST =
-  'show catalogs | where CONNECTOR_TYPE="PROMETHEUS" | fields CATALOG_NAME';
+export const PPL_DATASOURCES_REQUEST =
+  'show datasources | where CONNECTOR_TYPE="PROMETHEUS" | fields DATASOURCE_NAME';
 
 // redux
 export const REDUX_SLICE_METRICS = 'metrics';
diff --git a/dashboards-observability/public/components/metrics/index.tsx b/dashboards-observability/public/components/metrics/index.tsx
index 5b2e52eb7..9d8b41694 100644
--- a/dashboards-observability/public/components/metrics/index.tsx
+++ b/dashboards-observability/public/components/metrics/index.tsx
@@ -104,7 +104,7 @@ export const Home = ({ http, chrome, parentBreadcrumb, renderProps, pplService }
   }, [editMode]);
 
   const mainSectionClassName = classNames({
-    'col-md-9': !isSidebarClosed,
+    'col-md-10': !isSidebarClosed,
     'col-md-12': isSidebarClosed,
   });
 
@@ -140,7 +140,7 @@ export const Home = ({ http, chrome, parentBreadcrumb, renderProps, pplService }
                 />
                 <div className="dscAppContainer">
                   <div
-                    className={`col-md-3 dscSidebar__container dscCollapsibleSidebar ${sidebarClassName}`}
+                    className={`col-md-2 dscSidebar__container dscCollapsibleSidebar ${sidebarClassName}`}
                   >
                     <div className="">
                       {!isSidebarClosed && <Sidebar http={http} pplService={pplService} />}
diff --git a/dashboards-observability/public/components/metrics/redux/slices/metrics_slice.ts b/dashboards-observability/public/components/metrics/redux/slices/metrics_slice.ts
index 7d3c9e6b0..3ae737e48 100644
--- a/dashboards-observability/public/components/metrics/redux/slices/metrics_slice.ts
+++ b/dashboards-observability/public/components/metrics/redux/slices/metrics_slice.ts
@@ -5,7 +5,7 @@
 
 import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
 import {
-  PPL_PROMETHEUS_CATALOG_REQUEST,
+  PPL_DATASOURCES_REQUEST,
   REDUX_SLICE_METRICS,
 } from '../../../../../common/constants/metrics';
 import { pplServiceRequestor, getVisualizations, getNewVizDimensions } from '../../helpers/utils';
@@ -44,16 +44,16 @@ const fetchCustomMetrics = async (http: any) => {
 
 const fetchRemoteMetrics = async (pplService: any) => {
   const dataSet = [];
-  const catalogs = await pplServiceRequestor(pplService, PPL_PROMETHEUS_CATALOG_REQUEST);
-  for (const catalog of catalogs.jsonData) {
+  const dataSources = await pplServiceRequestor(pplService, PPL_DATASOURCES_REQUEST);
+  for (const dataSource of dataSources.jsonData) {
     const catalogData = await pplServiceRequestor(
       pplService,
-      `source = ${catalog.CATALOG_NAME}.information_schema.tables`
+      `source = ${dataSource.DATASOURCE_NAME}.information_schema.tables`
     );
     const normalizedData = catalogData.jsonData.map((obj: any) => ({
       id: `${obj.TABLE_CATALOG}.${obj.TABLE_NAME}`,
       name: `${obj.TABLE_CATALOG}.${obj.TABLE_NAME}`,
-      catalog: `${catalog.CATALOG_NAME}`,
+      catalog: `${dataSource.DATASOURCE_NAME}`,
       type: obj.TABLE_TYPE,
       recentlyCreated: false,
     }));
diff --git a/dashboards-observability/public/components/metrics/sidebar/sidebar.scss b/dashboards-observability/public/components/metrics/sidebar/sidebar.scss
index b8217d522..069c5c86c 100644
--- a/dashboards-observability/public/components/metrics/sidebar/sidebar.scss
+++ b/dashboards-observability/public/components/metrics/sidebar/sidebar.scss
@@ -146,12 +146,14 @@
 
 .metricsList {
   line-height:normal;
-  margin-top:10px;
+  margin-top:5px;
+}
+
+.metricsListContainer {
+  margin-left:25px;
+  margin-right:5px;
 }
 
 .metricName {
-  overflow:hidden;
-  white-space:nowrap;
-  text-overflow:ellipsis;
   margin-bottom:10px;
 }
diff --git a/dashboards-observability/public/components/metrics/sidebar/sidebar.tsx b/dashboards-observability/public/components/metrics/sidebar/sidebar.tsx
index f39300f9e..f08665b79 100644
--- a/dashboards-observability/public/components/metrics/sidebar/sidebar.tsx
+++ b/dashboards-observability/public/components/metrics/sidebar/sidebar.tsx
@@ -56,11 +56,11 @@ export const Sidebar = (props: ISidebarProps) => {
               <span>Recently Created Metrics</span>
             </EuiTitle>
           }
-          paddingSize="xs"
+          paddingSize="none"
         >
           <ul className="metricsList">
             {recentlyCreatedMetrics.map((metric: any) => (
-              <li className="metricName" key={metric.id}>
+              <li key={metric.id} className="metricsListContainer">
                 <EuiLink
                   className="metricName eui-textTruncate"
                   title={metric.name}
@@ -81,11 +81,11 @@ export const Sidebar = (props: ISidebarProps) => {
               <span>Selected Metrics</span>
             </EuiTitle>
           }
-          paddingSize="xs"
+          paddingSize="none"
         >
           <ul className="metricsList">
             {selectedMetrics.map((metric: any) => (
-              <li key={metric.id}>
+              <li key={metric.id} className="metricsListContainer">
                 <EuiLink
                   className="metricName eui-textTruncate"
                   title={metric.name}
@@ -106,11 +106,11 @@ export const Sidebar = (props: ISidebarProps) => {
               <span>Available Metrics</span>
             </EuiTitle>
           }
-          paddingSize="xs"
+          paddingSize="none"
         >
           <ul className="metricsList">
             {availableMetrics.slice(0, 100).map((metric: any) => (
-              <li key={metric.id}>
+              <li key={metric.id} className="metricsListContainer">
                 <EuiLink
                   className="metricName eui-textTruncate"
                   title={metric.name}