update db charts (supabase#36534)

Author: fsansalvadore

apps/studio/components/ui/Charts/ChartHeader.tsx

@@ -39,13 +39,20 @@ const ChartHeader = ({
         {title}
       </h3>
       {docsUrl && (
-        <Link
-          href={docsUrl}
-          target="_blank"
-          className="text-foreground-lighter hover:text-foreground-light"
-        >
-          <InfoIcon className="w-3.5 h-3.5" />
-        </Link>
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <Link
+              href={docsUrl}
+              target="_blank"
+              className="text-foreground-lighter hover:text-foreground-light"
+            >
+              <InfoIcon className="w-3 h-3" />
+            </Link>
+          </TooltipTrigger>
+          <TooltipContent side="top" align="center">
+            Read docs
+          </TooltipContent>
+        </Tooltip>
       )}
     </div>
   )

apps/studio/data/reports/database-charts.ts

@@ -45,7 +45,7 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
       showLegend: true,
       hideChartType: false,
       defaultChartStyle: 'line',
-      showMaxValue: true,
+      showMaxValue: false,
       showGrid: true,
       syncId: 'database-reports',
       valuePrecision: 2,
@@ -59,36 +59,21 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
           provider: 'infra-monitoring',
           label: 'Used',
           tooltip:
-            'Total RAM currently in use by the system and applications. High usage may indicate memory pressure.',
+            'RAM in use by Postgres and the operating system. Sustained high usage may indicate memory pressure',
         },
         {
           attribute: 'ram_usage_cache_and_buffers',
           provider: 'infra-monitoring',
           label: 'Cache + buffers',
           tooltip:
-            'RAM used for caching and buffering disk operations. Higher values improve read performance.',
+            'RAM used by the operating system page cache and PostgreSQL buffers to accelerate disk reads/writes',
         },
         {
           attribute: 'ram_usage_free',
           provider: 'infra-monitoring',
           label: 'Free',
           tooltip:
-            'Available unused RAM. A small amount is always reserved. High unused RAM present with erratic Used RAM may indicate unoptimized queries disrupting cache.',
-        },
-        {
-          attribute: 'ram_usage_swap',
-          provider: 'infra-monitoring',
-          label: 'Swap',
-          omitFromTotal: false, // we can set this to true if we want to omit the swap from the total
-          tooltip:
-            'Memory swapped to disk when RAM is full. An instance has 1GB of SWAP. High swap with high disk I/O signals memory stress.',
-        },
-        {
-          attribute: 'ram_usage_total',
-          provider: 'infra-monitoring',
-          label: 'Max',
-          isMaxValue: true,
-          tooltip: 'Total RAM',
+            'Unallocated memory available for use. A small portion is always reserved by the operating system',
         },
       ],
     },
@@ -116,23 +101,23 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
           label: 'System',
           format: '%',
           tooltip:
-            'CPU time spent on kernel operations (e.g., process scheduling, memory management). High values may indicate system overhead.',
+            'CPU time spent on kernel operations (e.g., process scheduling, memory management). High values may indicate system overhead',
         },
         {
           attribute: 'cpu_usage_busy_user',
           provider: 'infra-monitoring',
           label: 'User',
           format: '%',
           tooltip:
-            'CPU time used by database queries and user-space processes. High values may suggest CPU-intensive queries.',
+            'CPU time used by database queries and user-space processes. High values may suggest CPU-intensive queries',
         },
         {
           attribute: 'cpu_usage_busy_iowait',
           provider: 'infra-monitoring',
           label: 'IOwait',
           format: '%',
           tooltip:
-            'CPU time waiting for disk or network I/O. High values may indicate disk bottlenecks.',
+            'CPU time waiting for disk or network I/O. High values may indicate disk bottlenecks',
         },
         {
           attribute: 'cpu_usage_busy_irqs',
@@ -147,7 +132,7 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
           label: 'Other',
           format: '%',
           tooltip:
-            'CPU time spent on other tasks (e.g., background processes, software interrupts).',
+            'CPU time spent on other tasks (e.g., background processes, software interrupts)',
         },
         {
           attribute: 'cpu_usage_max',
@@ -161,7 +146,7 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
     },
     {
       id: 'disk-iops',
-      label: 'Disk IOps',
+      label: 'Disk Input/Output operations per second (IOPS)',
       syncId: 'database-reports',
       hide: false,
       showTooltip: true,
@@ -180,16 +165,16 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
         {
           attribute: 'disk_iops_write',
           provider: 'infra-monitoring',
-          label: 'IOps write/s',
+          label: 'write IOPS',
           tooltip:
-            'Number of write operations per second. High values indicate frequent data writes, logging, or transaction activity.',
+            'Number of write operations per second. High values indicate frequent data writes, logging, or transaction activity',
         },
         {
           attribute: 'disk_iops_read',
           provider: 'infra-monitoring',
-          label: 'IOps read/s',
+          label: 'read IOPS',
           tooltip:
-            'Number of read operations per second. High values suggest frequent disk reads due to queries or poor caching.',
+            'Number of read operations per second. High values suggest frequent disk reads due to queries or poor caching',
         },
         {
           attribute: 'disk_iops_max',
@@ -225,7 +210,7 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
           provider: 'infra-monitoring',
           label: 'IO Usage',
           tooltip:
-            'The actual number of IO operations per second that the database is currently using.',
+            'The actual number of IO operations per second that the database is currently using',
         },
       ],
     },
@@ -252,23 +237,23 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
           provider: 'infra-monitoring',
           format: 'bytes',
           label: 'System',
-          tooltip: 'Reserved space for the system to ensure your database runs smoothly.',
+          tooltip: 'Reserved space for the system to ensure your database runs smoothly',
         },
         {
           attribute: 'disk_fs_used_wal',
           provider: 'infra-monitoring',
           format: 'bytes',
           label: 'WAL',
           tooltip:
-            'Disk usage by the write-ahead log. The usage depends on your WAL settings and the amount of data being written to the database.',
+            'Disk usage by the write-ahead log. The usage depends on your WAL settings and the amount of data being written to the database',
         },
 
         {
           attribute: 'pg_database_size',
           provider: 'infra-monitoring',
           format: 'bytes',
           label: 'Database',
-          tooltip: 'Disk usage by your database (tables, indexes, data, ...).',
+          tooltip: 'Disk usage by your database (tables, indexes, data, ...)',
         },
         {
           attribute: 'disk_fs_size',
@@ -306,43 +291,6 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
               }),
       ],
     },
-    {
-      id: 'network-traffic',
-      label: 'Network Traffic',
-      syncId: 'database-reports',
-      valuePrecision: 1,
-      showTooltip: true,
-      showLegend: true,
-      showMaxValue: false,
-      showGrid: true,
-      YAxisProps: {
-        width: 65,
-        tickFormatter: (value: any) => formatBytes(value, 1),
-      },
-      hideChartType: false,
-      defaultChartStyle: 'line',
-      hideHighlightedValue: true,
-      showTotal: false,
-      attributes: [
-        {
-          attribute: 'network_receive_bytes',
-          provider: 'infra-monitoring',
-          label: 'Ingress',
-          manipulateValue: (value: number) => value * -1,
-          tooltip:
-            'Data received by your database from clients. High values may indicate frequent queries, large data inserts, or many incoming connections.',
-          stackId: '1',
-        },
-        {
-          attribute: 'network_transmit_bytes',
-          provider: 'infra-monitoring',
-          label: 'Egress',
-          tooltip:
-            'Data sent from your database to clients. High values may indicate large query results or numerous outgoing connections.',
-          stackId: '2',
-        },
-      ],
-    },
     {
       id: 'client-connections',
       label: 'Database client connections',
@@ -352,46 +300,46 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
       showLegend: true,
       showMaxValue: true,
       hideChartType: false,
+      showGrid: true,
+      YAxisProps: { width: 30 },
       defaultChartStyle: 'line',
       attributes: [
         {
           attribute: 'client_connections_postgres',
           provider: 'infra-monitoring',
           label: 'Postgres',
           tooltip:
-            'Direct connections to the Postgres database from your application and external clients.',
+            'Direct connections to the Postgres database from your application and external clients',
         },
         {
           attribute: 'client_connections_authenticator',
           provider: 'infra-monitoring',
           label: 'PostgREST',
-          tooltip: 'Connections magaged by PostgREST to auto-generate RESTful API.',
+          tooltip: 'Connection pool managed by PostgREST',
         },
         {
           attribute: 'client_connections_supabase_admin',
           provider: 'infra-monitoring',
-          label: 'Admin',
+          label: 'Reserved',
           tooltip:
-            'Administrative connections used by various Supabase services for internal operations and maintenance tasks.',
+            'Administrative connections used by various Supabase services for internal operations and maintenance tasks',
         },
         {
           attribute: 'client_connections_supabase_auth_admin',
           provider: 'infra-monitoring',
           label: 'Auth',
-          tooltip:
-            'Administrative connections used by Supabase Auth service for user management and authentication operations.',
+          tooltip: 'Connection pool managed by Supabase Auth',
         },
         {
           attribute: 'client_connections_supabase_storage_admin',
           provider: 'infra-monitoring',
           label: 'Storage',
-          tooltip:
-            'Administrative connections used by Supabase Storage service for file operations and bucket management.',
+          tooltip: 'Connection pool managed by Supabase Storage',
         },
         {
           attribute: 'client_connections_other',
           provider: 'infra-monitoring',
-          label: 'Other',
+          label: 'Other roles',
           tooltip: "Miscellaneous database connections that don't fall into other categories.",
         },
         {
@@ -406,7 +354,7 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
     },
     {
       id: 'pgbouncer-connections',
-      label: 'Pooler client connections',
+      label: 'Dedicated Pooler client connections',
       syncId: 'database-reports',
       valuePrecision: 0,
       hide: false,
@@ -437,7 +385,7 @@ export const getReportAttributesV2: (org: Organization, project: Project) => Rep
     },
     {
       id: 'supavisor-connections-active',
-      label: 'Supavisor client connections',
+      label: 'Shared Pooler (Supavisor) client connections',
       syncId: 'database-reports',
       valuePrecision: 0,
       hide: isFreePlan,