prometheus: Add support for external Prometheus URLs

Co-authored-by: Tusharjamdade <tusharnjamdade@gmail.com>
Signed-off-by: Evangelos Skopelitis <eskopelitis@microsoft.com>

Author: Tusharjamdade

prometheus/src/components/Settings/Settings.tsx

@@ -11,17 +11,29 @@ import Switch from '@mui/material/Switch';
 import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
 import { useEffect, useState } from 'react';
+import { isHttpUrl } from '../../helpers';
 
 /**
- * Validates if the given address string is in the correct format.
- * The format should be: namespace/service:port
+ * Validates whether the given address is in a supported format.
+ * Supports namespace/service:port and HTTP/HTTPS URLs.
+ * Examples: monitoring/prometheus:9090, https://prometheus.example.com
  *
  * @param {string} address - The address string to validate.
  * @returns {boolean} True if the address is valid, false otherwise.
  */
 function isValidAddress(address: string): boolean {
-  const regex = /^[a-z0-9-]+\/[a-z0-9-]+:[0-9]+$/;
-  return regex.test(address);
+  if (!address) return false;
+
+  const value = address.trim();
+
+  // namespace/service:port
+  const k8sRegex = /^[a-z0-9-]+\/[a-z0-9-]+:[0-9]+$/;
+  if (k8sRegex.test(value)) {
+    return true;
+  }
+
+  // http(s)://...
+  return isHttpUrl(value);
 }
 
 /**
@@ -173,8 +185,8 @@ export function Settings(props: SettingsProps) {
               disabled={!isAddressFieldEnabled}
               helperText={
                 addressError
-                  ? 'Invalid format. Use: namespace/service-name:port'
-                  : 'Address of the Prometheus Service, only used when auto-detection is disabled. Format: namespace/service-name:port'
+                  ? 'Invalid format. Use: namespace/service-name:port or https://prometheus.example.com'
+                  : 'Address of Prometheus. Used only when auto-detection is disabled. Examples: namespace/service-name:port or https://prometheus.example.com'
               }
               error={addressError}
               value={selectedClusterData.address || ''}

prometheus/src/helpers.ts

@@ -0,0 +1,14 @@
+/**
+ * Checks whether the given string is a valid HTTP or HTTPS URL.
+ *
+ * @param {string} value - The value to validate.
+ * @returns {boolean} True if the value is a valid http/https URL, otherwise false.
+ */
+export function isHttpUrl(value: string): boolean {
+  try {
+    const url = new URL(value);
+    return url.protocol === 'http:' || url.protocol === 'https:';
+  } catch {
+    return false;
+  }
+}

prometheus/src/request.tsx

@@ -1,4 +1,5 @@
 import { ApiProxy } from '@kinvolk/headlamp-plugin/lib';
+import { isHttpUrl } from './helpers';
 
 const request = ApiProxy.request;
 
@@ -280,7 +281,7 @@ async function testPrometheusQuery(
 /**
  * Fetches metrics data from Prometheus using the provided parameters.
  * @param {object} data - The parameters for fetching metrics.
- * @param {string} data.prefix - The namespace prefix.
+ * @param {string} data.prefix - Either a Kubernetes proxy prefix (namespace/services/service-name:port) or a full HTTP/HTTPS Prometheus base URL.
  * @param {string} data.query - The Prometheus query string.
  * @param {number} data.from - The start time for the query (Unix timestamp).
  * @param {number} data.to - The end time for the query (Unix timestamp).
@@ -309,17 +310,58 @@ export async function fetchMetrics(data: {
   if (data.query) {
     params.append('query', data.query);
   }
-  var url = `/api/v1/namespaces/${data.prefix}/proxy/api/v1/query_range?${params.toString()}`;
-  if (data.subPath && data.subPath !== '') {
-    if (data.subPath.startsWith('/')) {
-      data.subPath = data.subPath.slice(1);
+
+  const isExternal = isHttpUrl(data.prefix);
+  var url: string;
+
+  if (isExternal) {
+    let base = data.prefix;
+    if (base.endsWith('/')) {
+      base = base.slice(0, -1);
+    }
+
+    let apiPath = 'api/v1/query_range';
+    if (data.subPath && data.subPath !== '') {
+      if (data.subPath.startsWith('/')) {
+        data.subPath = data.subPath.slice(1);
+      }
+      if (data.subPath.endsWith('/')) {
+        data.subPath = data.subPath.slice(0, -1);
+      }
+      apiPath = `${data.subPath}/api/v1/query_range`;
     }
-    if (data.subPath.endsWith('/')) {
-      data.subPath = data.subPath.slice(0, -1);
+
+    url = `${base}/${apiPath}?${params.toString()}`;
+  } else {
+    url = `/api/v1/namespaces/${data.prefix}/proxy/api/v1/query_range?${params.toString()}`;
+    if (data.subPath && data.subPath !== '') {
+      if (data.subPath.startsWith('/')) {
+        data.subPath = data.subPath.slice(1);
+      }
+      if (data.subPath.endsWith('/')) {
+        data.subPath = data.subPath.slice(0, -1);
+      }
+      url = `/api/v1/namespaces/${data.prefix}/proxy/${
+        data.subPath
+      }/api/v1/query_range?${params.toString()}`;
+    }
+  }
+
+  if (isExternal) {
+    const response = await fetch(url, { method: 'GET' });
+    if (response.ok) {
+      return response.json();
+    }
+    let message = `Request failed with status ${response.status} ${response.statusText}`;
+    try {
+      const bodyText = await response.text();
+      if (bodyText) {
+        message += `: ${bodyText}`;
+      }
+    } catch {
+      // Ignore errors while reading the error body; fallback to status-only message.
     }
-    url = `/api/v1/namespaces/${data.prefix}/proxy/${
-      data.subPath
-    }/api/v1/query_range?${params.toString()}`;
+    throw new Error(message);
   }
 
   const response = await request(url, {

prometheus/src/util.test.ts

@@ -1,14 +1,153 @@
-import { getTimeRangeAndStepSize } from './util';
+import { getTimeRangeAndStepSize, getPrometheusPrefix } from './util';
+import { isHttpUrl } from './helpers';
+import { KubernetesType } from './request';
 
-beforeAll(async () => {
+vitest.mock('./request', () => ({
+  isPrometheusInstalled: vitest.fn(),
+  KubernetesType: {
+    none: 'none',
+    services: 'services',
+    pods: 'pods',
+  },
+}));
+
+vitest.mock('@kinvolk/headlamp-plugin/lib', () => ({
+  ConfigStore: vitest.fn(),
+}));
+
+import { isPrometheusInstalled } from './request';
+import { ConfigStore } from '@kinvolk/headlamp-plugin/lib';
+
+const mockIsPrometheusInstalled = vitest.mocked(isPrometheusInstalled);
+const MockConfigStore = vitest.mocked(ConfigStore);
+
+beforeAll(() => {
   global.TextEncoder = require('util').TextEncoder;
   global.TextDecoder = require('util').TextDecoder;
 });
 
+function mockClusterConfig(clusterName: string, config: Record<string, unknown> | null) {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  (MockConfigStore as any).mockImplementation(() => ({
+    get: () => (config ? { [clusterName]: config } : null),
+  }));
+}
+
+describe('isHttpUrl', () => {
+  test.each([
+    ['http://prometheus.example.com', true],
+    ['https://prometheus.example.com', true],
+    ['http://prometheus.example.com:9090', true],
+    ['https://prometheus.example.com/api/v1', true],
+    ['', false],
+    ['monitoring/prometheus', false],
+    ['ftp://example.com', false],
+    ['not a url', false],
+  ])('isHttpUrl(%s) returns %s', (input, expected) => {
+    expect(isHttpUrl(input)).toBe(expected);
+  });
+});
+
+describe('getPrometheusPrefix', () => {
+  beforeEach(() => {
+    vitest.clearAllMocks();
+  });
+
+  describe('auto-detect mode', () => {
+    test('returns detected endpoint when prometheus is found', async () => {
+      mockClusterConfig('test-cluster', { autoDetect: true });
+      mockIsPrometheusInstalled.mockResolvedValue({
+        type: KubernetesType.services,
+        namespace: 'monitoring',
+        name: 'prometheus',
+        port: '9090',
+      });
+
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBe('monitoring/services/prometheus:9090');
+    });
+
+    test('returns endpoint without port when port is empty', async () => {
+      mockClusterConfig('test-cluster', { autoDetect: true });
+      mockIsPrometheusInstalled.mockResolvedValue({
+        type: KubernetesType.services,
+        namespace: 'monitoring',
+        name: 'prometheus',
+        port: '',
+      });
+
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBe('monitoring/services/prometheus');
+    });
+
+    test('returns null when no prometheus is found', async () => {
+      mockClusterConfig('test-cluster', { autoDetect: true });
+      mockIsPrometheusInstalled.mockResolvedValue({
+        type: KubernetesType.none,
+        namespace: '',
+        name: '',
+        port: '',
+      });
+
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBeNull();
+    });
+
+    test('takes priority over manual address', async () => {
+      mockClusterConfig('test-cluster', {
+        autoDetect: true,
+        address: 'https://manual-address.com',
+      });
+      mockIsPrometheusInstalled.mockResolvedValue({
+        type: KubernetesType.services,
+        namespace: 'monitoring',
+        name: 'prometheus',
+        port: '9090',
+      });
+
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBe('monitoring/services/prometheus:9090');
+    });
+  });
+
+  describe('manual address mode', () => {
+    test.each([
+      ['http://prometheus.example.com:9090', 'http://prometheus.example.com:9090'],
+      ['https://prometheus.example.com', 'https://prometheus.example.com'],
+      ['https://prometheus.example.com/', 'https://prometheus.example.com'], // strips trailing slash
+      ['monitoring/prometheus', 'monitoring/services/prometheus'], // k8s service path
+      ['  monitoring/prometheus  ', 'monitoring/services/prometheus'], // trims whitespace
+    ])('address "%s" returns "%s"', async (address, expected) => {
+      mockClusterConfig('test-cluster', { autoDetect: false, address });
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBe(expected);
+    });
+
+    test('returns null for invalid address format', async () => {
+      mockClusterConfig('test-cluster', { autoDetect: false, address: 'invalid-format' });
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBeNull();
+    });
+  });
+
+  describe('no configuration', () => {
+    test('returns null when cluster config is null', async () => {
+      mockClusterConfig('test-cluster', null);
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBeNull();
+    });
+
+    test('returns null when neither autoDetect nor address is set', async () => {
+      mockClusterConfig('test-cluster', {});
+      const result = await getPrometheusPrefix('test-cluster');
+      expect(result).toBeNull();
+    });
+  });
+});
+
 describe('getTimeRangeAndStepSize', () => {
-  // Mock the current timestamp for consistent testing
   const mockNow = 1700000000;
-  const day = 86400; // seconds in a day
+  const day = 86400;
 
   beforeEach(() => {
     vitest.spyOn(Date, 'now').mockImplementation(() => mockNow * 1000);
@@ -29,77 +168,26 @@ describe('getTimeRangeAndStepSize', () => {
       {
         from: mockNow - (mockNow % day),
         to: mockNow,
-        step: Math.max(
-          Math.floor(((mockNow - (mockNow - (mockNow % day))) * 1000) / 250 / 1000),
-          1
-        ),
-      },
-    ],
-    [
-      'yesterday',
-      'medium',
-      {
-        from: mockNow - (mockNow % day) - day,
-        to: mockNow - (mockNow % day),
-        step: 345,
+        step: Math.max(Math.floor(((mockNow - (mockNow - (mockNow % day))) * 1000) / 250 / 1000), 1),
       },
     ],
+    ['yesterday', 'medium', { from: mockNow - (mockNow % day) - day, to: mockNow - (mockNow % day), step: 345 }],
     ['week', 'medium', { from: mockNow - 7 * day, to: mockNow, step: 2419 }],
-    [
-      'lastweek',
-      'medium',
-      {
-        from: mockNow - 14 * day,
-        to: mockNow - 7 * day,
-        step: 2419,
-      },
-    ],
-
-    // Different resolutions with same interval
-    ['1h', 'low', { from: mockNow - 3600, to: mockNow, step: 36 }], // timeRange / 100
-    ['1h', 'medium', { from: mockNow - 3600, to: mockNow, step: 14 }], // timeRange / 250
-    ['1h', 'high', { from: mockNow - 3600, to: mockNow, step: 4 }], // timeRange / 750
-
-    // Fixed step sizes with same interval
+    ['lastweek', 'medium', { from: mockNow - 14 * day, to: mockNow - 7 * day, step: 2419 }],
+    // Different resolutions
+    ['1h', 'low', { from: mockNow - 3600, to: mockNow, step: 36 }],
+    ['1h', 'medium', { from: mockNow - 3600, to: mockNow, step: 14 }],
+    ['1h', 'high', { from: mockNow - 3600, to: mockNow, step: 4 }],
+    // Fixed step sizes
     ['1h', '30s', { from: mockNow - 3600, to: mockNow, step: 30 }],
     ['1h', '15m', { from: mockNow - 3600, to: mockNow, step: 900 }],
     ['1h', '1h', { from: mockNow - 3600, to: mockNow, step: 3600 }],
-
     // Edge cases
-    ['1m', 'medium', { from: mockNow - 60, to: mockNow, step: 1 }], // Minimum step size is 1
-    ['14d', 'medium', { from: mockNow - 14 * day, to: mockNow, step: 4838 }], // Large time range
-    [
-      'invalid', // Falls back to 10 minutes interval
-      'medium',
-      {
-        from: mockNow - 600,
-        to: mockNow,
-        step: 2,
-      },
-    ],
-    [
-      '1h',
-      'invalid', // Falls back to medium resolution
-      { from: mockNow - 3600, to: mockNow, step: 14 },
-    ],
-  ])(
-    'should return correct timeRange and stepSize for %s interval and %s resolution',
-    (interval, resolution, expected) => {
-      const result = getTimeRangeAndStepSize(interval, resolution);
-      expect(result).toEqual(expected);
-    }
-  );
-
-  test('should handle different timestamps correctly', () => {
-    // Test with a specific timestamp
-    const specificTime = 1600000000;
-    vitest.spyOn(Date, 'now').mockImplementation(() => specificTime * 1000);
-
-    const result = getTimeRangeAndStepSize('1h', 'medium');
-    expect(result).toEqual({
-      from: specificTime - 3600,
-      to: specificTime,
-      step: 14,
-    });
+    ['1m', 'medium', { from: mockNow - 60, to: mockNow, step: 1 }],
+    ['14d', 'medium', { from: mockNow - 14 * day, to: mockNow, step: 4838 }],
+    ['invalid', 'medium', { from: mockNow - 600, to: mockNow, step: 2 }], // falls back to 10m
+    ['1h', 'invalid', { from: mockNow - 3600, to: mockNow, step: 14 }], // falls back to medium
+  ])('interval=%s resolution=%s', (interval, resolution, expected) => {
+    expect(getTimeRangeAndStepSize(interval, resolution)).toEqual(expected);
   });
 });