diff --git a/web/pgadmin/dashboard/static/js/SystemStats/Summary.jsx b/web/pgadmin/dashboard/static/js/SystemStats/Summary.jsx index cc3575f78..0efd3b54d 100644 --- a/web/pgadmin/dashboard/static/js/SystemStats/Summary.jsx +++ b/web/pgadmin/dashboard/static/js/SystemStats/Summary.jsx @@ -49,7 +49,7 @@ const useStyles = makeStyles((theme) => ({ })); const chartsDefault = { - 'hpc_stats': {'Handle': [], 'Process': []}, + 'hpc_stats': {'Process': [], 'Handle': []}, }; const SummaryTable = (props) => { @@ -294,7 +294,7 @@ export function SummaryWrapper(props) { - + diff --git a/web/pgadmin/dashboard/templates/dashboard/sql/default/system_statistics.sql b/web/pgadmin/dashboard/templates/dashboard/sql/default/system_statistics.sql index 236136edc..07c757cd9 100644 --- a/web/pgadmin/dashboard/templates/dashboard/sql/default/system_statistics.sql +++ b/web/pgadmin/dashboard/templates/dashboard/sql/default/system_statistics.sql @@ -19,8 +19,8 @@ {% set add_union = true %} SELECT 'hpc_stats' AS chart_name, pg_catalog.row_to_json(t) AS chart_data FROM (SELECT - (SELECT handle_count FROM pg_sys_os_info()) AS "{{ _('Handle') }}", - (SELECT process_count FROM pg_sys_os_info()) AS "{{ _('Process') }}" + (SELECT process_count FROM pg_sys_os_info()) AS "{{ _('Process') }}", + (SELECT handle_count FROM pg_sys_os_info()) AS "{{ _('Handle') }}" ) t {% endif %} {% if add_union and 'cpu_stats' in chart_names %} @@ -110,4 +110,4 @@ {% if 'pi_stats' in chart_names %} {% set add_union = true %} SELECT 'pi_stats' AS chart_name, pg_catalog.row_to_json(t) AS chart_data FROM (SELECT * FROM pg_sys_process_info()) t -{% endif %} \ No newline at end of file +{% endif %} diff --git a/web/pgadmin/static/js/components/PgChart/StreamingChart.jsx b/web/pgadmin/static/js/components/PgChart/StreamingChart.jsx index 51df2498a..12a32d067 100644 --- a/web/pgadmin/static/js/components/PgChart/StreamingChart.jsx +++ b/web/pgadmin/static/js/components/PgChart/StreamingChart.jsx @@ -15,6 +15,23 @@ const removeExistingTooltips = () => { }); }; +function formatLabel(ticks) { + // Format the label + return ticks.map((value) => { + if(value < 1){ + return value+''; + } + return parseLabel(value); + }); +} + +function parseLabel(label) { + const suffixes = ['', 'k', 'M', 'B', 'T']; + const suffixNum = Math.floor(Math.log10(label) / 3); + const shortValue = (label / Math.pow(1000, suffixNum)).toFixed(1); + return shortValue + ' ' + suffixes[suffixNum]; +} + function tooltipPlugin(refreshRate) { let tooltipTopOffset = -20; let tooltipLeftOffset = 10; @@ -41,9 +58,12 @@ function tooltipPlugin(refreshRate) { return; } showTooltip(); + let tooltipHtml=`
${(u.data[1].length-1-parseInt(u.legend.values[0]['_'])) * refreshRate + gettext(' seconds ago')}
`; for(let i=1; i
${u.series[i].label}: ${u.legend.values[i]['_']}`; + let _tooltip = parseFloat(u.legend.values[i]['_'].replace(/,/g,'')); + if (_tooltip > 1) _tooltip = parseLabel(_tooltip); + tooltipHtml += `
${u.series[i].label}: ${_tooltip}
`; } tooltip.innerHTML = tooltipHtml; @@ -110,18 +130,7 @@ export default function StreamingChart({xRange=75, data, options, showSecondAxis return size; }, // y-axis configuration - values: (self, ticks) => { - // Format the label - return ticks.map((value) => { - if(value < 1){ - return value+''; - } - const suffixes = ['', 'k', 'M', 'B', 'T']; - const suffixNum = Math.floor(Math.log10(value) / 3); - const shortValue = (value / Math.pow(1000, suffixNum)).toFixed(1); - return shortValue + suffixes[suffixNum]; - }); - } + values: (self, ticks) => { return formatLabel(ticks); } }); axes.push({ scale: 'y1', @@ -137,18 +146,7 @@ export default function StreamingChart({xRange=75, data, options, showSecondAxis return size; }, // y-axis configuration - values: (self, ticks) => { - // Format the label - return ticks.map((value) => { - if(value < 1){ - return value+''; - } - const suffixes = ['', 'k', 'M', 'B', 'T']; - const suffixNum = Math.floor(Math.log10(value) / 3); - const shortValue = (value / Math.pow(1000, suffixNum)).toFixed(1); - return shortValue + suffixes[suffixNum]; - }); - } + values: (self, ticks) => { return formatLabel(ticks); } }); } else{ axes.push({ @@ -167,18 +165,7 @@ export default function StreamingChart({xRange=75, data, options, showSecondAxis return size; }, // y-axis configuration - values: (self, ticks) => { - // Format the label - return ticks.map((value) => { - if(value < 1){ - return value+''; - } - const suffixes = ['', 'k', 'M', 'B', 'T']; - const suffixNum = Math.floor(Math.log10(value) / 3); - const shortValue = (value / Math.pow(1000, suffixNum)).toFixed(1); - return shortValue + suffixes[suffixNum]; - }); - } + values: (self, ticks) => { return formatLabel(ticks); } }); }