Merge branch 'main' into feat/disable-releaseinfo

Author: germanosin

api/src/main/java/io/kafbat/ui/service/metrics/RawMetric.java

@@ -2,6 +2,7 @@
 
 import io.prometheus.metrics.core.metrics.Gauge;
 import io.prometheus.metrics.model.snapshots.MetricSnapshot;
+import io.prometheus.metrics.model.snapshots.PrometheusNaming;
 import java.math.BigDecimal;
 import java.util.Arrays;
 import java.util.Collection;
@@ -26,13 +27,19 @@ static RawMetric create(String name, Map<String, String> labels, BigDecimal valu
   static Stream<MetricSnapshot> groupIntoSnapshot(Collection<RawMetric> rawMetrics) {
     Map<String, Gauge> map = new LinkedHashMap<>();
     for (RawMetric m : rawMetrics) {
-      var lbls = m.labels().keySet().toArray(String[]::new);
-      var lblVals = Arrays.stream(lbls).map(l -> m.labels().get(l)).toArray(String[]::new);
+      var lbls = m.labels().keySet()
+          .stream()
+          .map(PrometheusNaming::sanitizeLabelName)
+          .toArray(String[]::new);
+      var lblVals = Arrays.stream(lbls)
+          .map(l -> m.labels().get(l))
+          .toArray(String[]::new);
+      var sanitizedName = PrometheusNaming.sanitizeMetricName(m.name());
       var gauge = map.computeIfAbsent(
-          m.name(),
+          sanitizedName,
           n -> Gauge.builder()
-              .name(m.name())
-              .help(m.name())
+              .name(sanitizedName)
+              .help(sanitizedName)
               .labelNames(lbls)
               .build()
       );

e2e-tests/src/main/java/io/kafbat/ui/screens/topics/enums/TimeToRetain.java

@@ -5,6 +5,9 @@
 @Getter
 public enum TimeToRetain {
 
+  BTN_1_HOUR("1 hour", "3600000"),
+  BTN_3_HOURS("3 hours", "10800000"),
+  BTN_6_HOURS("6 hours", "21600000"),
   BTN_12_HOURS("12 hours", "43200000"),
   BTN_1_DAY("1 day", "86400000"),
   BTN_2_DAYS("2 days", "172800000"),

frontend/package.json

@@ -54,7 +54,7 @@
   },
   "devDependencies": {
     "@jest/types": "29.6.3",
-    "@openapitools/openapi-generator-cli": "2.13.4",
+    "@openapitools/openapi-generator-cli": "2.22.0",
     "@swc/core": "1.3.107",
     "@swc/jest": "0.2.36",
     "@testing-library/dom": "10.0.0",
@@ -88,7 +88,7 @@
     "eslint-plugin-react-hooks": "4.6.0",
     "fetch-mock": "9.11.0",
     "jest": "29.7.0",
-    "jest-environment-jsdom": "29.7.0",
+    "jest-environment-jsdom": "30.0.5",
     "jest-sonar-reporter": "2.0.0",
     "jest-styled-components": "7.1.1",
     "jest-watch-typeahead": "2.2.2",

frontend/pnpm-lock.yaml

@@ -3,7 +3,7 @@ import Filters, {
   FiltersProps,
 } from 'components/Topics/Topic/Messages/Filters/Filters';
 import { render, WithRoute } from 'lib/testHelpers';
-import { screen } from '@testing-library/react';
+import { act, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { clusterTopicPath } from 'lib/paths';
 import { useTopicDetails } from 'lib/hooks/api/topics';
@@ -119,10 +119,6 @@ describe('Filters component', () => {
       await selectDropdownAndCheckInput('From offset', 'Offset');
     });
 
-    it('offset input To offset option', async () => {
-      await selectDropdownAndCheckInput('To offset', 'Offset');
-    });
-
     it('timestamp input since time', async () => {
       await selectDropdownAndCheckInput('Since time', 'Select timestamp');
     });
@@ -132,6 +128,32 @@ describe('Filters component', () => {
     });
   });
 
+  describe('change from and to offset filter', () => {
+    const inputValue = 'Hello World!';
+
+    it('saves filter value', async () => {
+      await act(() => renderComponent());
+
+      const seekTypeSelect = getSeekTypeSelect();
+      const option = screen.getAllByRole('option');
+
+      await userEvent.click(seekTypeSelect);
+      await userEvent.selectOptions(seekTypeSelect, ['From offset']);
+
+      expect(option[0]).toHaveTextContent('From offset');
+      const timestampInput = screen.getByPlaceholderText('Offset');
+      expect(timestampInput).toHaveValue('');
+      await userEvent.type(timestampInput, inputValue);
+
+      expect(timestampInput).toHaveValue(inputValue);
+
+      await userEvent.click(seekTypeSelect);
+      await userEvent.selectOptions(seekTypeSelect, ['To offset']);
+
+      expect(timestampInput).toHaveValue(inputValue);
+    });
+  });
+
   describe('checks the input values when data comes from the url', () => {
     const renderAndCheckSelectType = (
       mode: PollingMode,

frontend/src/components/Topics/Topic/Messages/Filters/__tests__/Filters.spec.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { MILLISECONDS_IN_DAY } from 'lib/constants';
+import { MILLISECONDS_IN_DAY, MILLISECONDS_IN_HOUR } from 'lib/constants';
 import styled from 'styled-components';
 
 import TimeToRetainBtn from './TimeToRetainBtn';
@@ -17,10 +17,25 @@ const TimeToRetainBtnsWrapper = styled.div`
 
 const TimeToRetainBtns: React.FC<Props> = ({ name }) => (
   <TimeToRetainBtnsWrapper>
+    <TimeToRetainBtn
+      text="1 hour"
+      inputName={name}
+      value={MILLISECONDS_IN_HOUR}
+    />
+    <TimeToRetainBtn
+      text="3 hours"
+      inputName={name}
+      value={MILLISECONDS_IN_HOUR * 3}
+    />
+    <TimeToRetainBtn
+      text="6 hours"
+      inputName={name}
+      value={MILLISECONDS_IN_HOUR * 6}
+    />
     <TimeToRetainBtn
       text="12 hours"
       inputName={name}
-      value={MILLISECONDS_IN_DAY / 2}
+      value={MILLISECONDS_IN_HOUR * 12}
     />
     <TimeToRetainBtn
       text="1 day"

frontend/src/components/Topics/shared/Form/TimeToRetainBtns.tsx

@@ -27,6 +27,6 @@ describe('TimeToRetainBtns', () => {
 
   it('should test the normal view rendering of the component', () => {
     SetUpComponent();
-    expect(screen.getAllByRole('button')).toHaveLength(5);
+    expect(screen.getAllByRole('button')).toHaveLength(8);
   });
 });

frontend/src/components/Topics/shared/Form/__tests__/TimeToRetainBtns.spec.tsx

@@ -47,7 +47,11 @@ describe('TopicForm', () => {
       'spinbutton',
       'Time to retain data (in ms)'
     );
+    expectByRoleAndNameToBeInDocument('button', '1 hour');
+    expectByRoleAndNameToBeInDocument('button', '3 hours');
+    expectByRoleAndNameToBeInDocument('button', '6 hours');
     expectByRoleAndNameToBeInDocument('button', '12 hours');
+    expectByRoleAndNameToBeInDocument('button', '1 day');
     expectByRoleAndNameToBeInDocument('button', '2 days');
     expectByRoleAndNameToBeInDocument('button', '7 days');
     expectByRoleAndNameToBeInDocument('button', '4 weeks');

frontend/src/components/Topics/shared/Form/__tests__/TopicForm.spec.tsx

@@ -49,6 +49,7 @@ export const TOPIC_CUSTOM_PARAMS: Record<string, string> = {
 
 export const MILLISECONDS_IN_WEEK = 604_800_000;
 export const MILLISECONDS_IN_DAY = 86_400_000;
+export const MILLISECONDS_IN_HOUR = 3_600_000;
 export const MILLISECONDS_IN_SECOND = 1_000;
 
 export const NOT_SET = -1;