Merge pull request #4487 from SigNoz/release/v0.38.2

Release/v0.38.2

deploy/docker-swarm/clickhouse-setup/docker-compose.yaml

@@ -146,7 +146,7 @@ services:
         condition: on-failure
 
   query-service:
-    image: signoz/query-service:0.38.1
+    image: signoz/query-service:0.38.2
     command:
       [
         "-config=/root/config/prometheus.yml",
@@ -186,7 +186,7 @@ services:
     <<: *db-depend
 
   frontend:
-    image: signoz/frontend:0.38.1
+    image: signoz/frontend:0.38.2
     deploy:
       restart_policy:
         condition: on-failure
@@ -199,7 +199,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector:
-    image: signoz/signoz-otel-collector:0.88.9
+    image: signoz/signoz-otel-collector:0.88.11
     command:
       [
         "--config=/etc/otel-collector-config.yaml",
@@ -237,7 +237,7 @@ services:
       - query-service
 
   otel-collector-migrator:
-      image: signoz/signoz-schema-migrator:0.88.9
+      image: signoz/signoz-schema-migrator:0.88.11
       deploy:
         restart_policy:
           condition: on-failure

deploy/docker/clickhouse-setup/docker-compose-core.yaml

@@ -66,7 +66,7 @@ services:
       - --storage.path=/data
 
   otel-collector-migrator:
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.9}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.11}
     container_name: otel-migrator
     command:
       - "--dsn=tcp://clickhouse:9000"
@@ -81,7 +81,7 @@ services:
   # Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
   otel-collector:
     container_name: signoz-otel-collector
-    image: signoz/signoz-otel-collector:0.88.9
+    image: signoz/signoz-otel-collector:0.88.11
     command:
       [
         "--config=/etc/otel-collector-config.yaml",

deploy/docker/clickhouse-setup/docker-compose.yaml

@@ -164,7 +164,7 @@ services:
   # Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
 
   query-service:
-    image: signoz/query-service:${DOCKER_TAG:-0.38.1}
+    image: signoz/query-service:${DOCKER_TAG:-0.38.2}
     container_name: signoz-query-service
     command:
       [
@@ -203,7 +203,7 @@ services:
     <<: *db-depend
 
   frontend:
-    image: signoz/frontend:${DOCKER_TAG:-0.38.1}
+    image: signoz/frontend:${DOCKER_TAG:-0.38.2}
     container_name: signoz-frontend
     restart: on-failure
     depends_on:
@@ -215,7 +215,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector-migrator:
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.9}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.11}
     container_name: otel-migrator
     command:
       - "--dsn=tcp://clickhouse:9000"
@@ -229,7 +229,7 @@ services:
 
 
   otel-collector:
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-0.88.9}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-0.88.11}
     container_name: signoz-otel-collector
     command:
       [

frontend/package.json

@@ -210,7 +210,8 @@
 	},
 	"lint-staged": {
 		"*.(js|jsx|ts|tsx)": [
-			"eslint --fix"
+			"eslint --fix",
+			"sh scripts/typecheck-staged.sh"
 		]
 	},
 	"resolutions": {

frontend/scripts/typecheck-staged.sh

@@ -0,0 +1,25 @@
+files="";
+
+# lint-staged will pass all files in $1 $2 $3 etc. iterate and concat.
+for var in "$@"
+do
+    files="$files \"$var\","
+done
+
+# create temporary tsconfig which includes only passed files
+str="{
+  \"extends\": \"./tsconfig.json\",
+  \"include\": [\"src/types/global.d.ts\",\"src/typings/window.ts\", $files]
+}"
+echo $str > tsconfig.tmp
+
+# run typecheck using temp config
+tsc -p ./tsconfig.tmp
+
+# capture exit code of tsc
+code=$?
+
+# delete temp config
+rm ./tsconfig.tmp
+
+exit $code

frontend/src/components/ResizeTable/ResizeTable.tsx

@@ -73,19 +73,12 @@ function ResizeTable({
 		}
 	}, [columns]);
 
-	const paginationConfig = {
-		hideOnSinglePage: true,
-		showTotal: (total: number, range: number[]): string =>
-			`${range[0]}-${range[1]} of ${total} items`,
-		...tableParams.pagination,
-	};
-
 	return onDragColumn ? (
 		<ReactDragListView.DragColumn {...dragColumnParams} onDragEnd={onDragColumn}>
-			<Table {...tableParams} pagination={paginationConfig} />
+			<Table {...tableParams} />
 		</ReactDragListView.DragColumn>
 	) : (
-		<Table {...tableParams} pagination={paginationConfig} />
+		<Table {...tableParams} />
 	);
 }
 

frontend/src/container/GeneralSettingsCloud/GeneralSettingsCloud.styles.scss

@@ -0,0 +1,7 @@
+.general-settings-container {
+	.ant-card-body {
+		display: flex;
+		align-items: center;
+		gap: 16px;
+	}
+}

frontend/src/container/GeneralSettingsCloud/GeneralSettingsCloud.tsx

@@ -0,0 +1,16 @@
+import './GeneralSettingsCloud.styles.scss';
+
+import { Card, Typography } from 'antd';
+import { Info } from 'lucide-react';
+
+export default function GeneralSettingsCloud(): JSX.Element {
+	return (
+		<Card className="general-settings-container">
+			<Info size={16} />
+			<Typography.Text>
+				Please <a href="mailto:cloud-support@signoz.io"> email us </a> or connect
+				with us via intercom support to change the retention period.
+			</Typography.Text>
+		</Card>
+	);
+}

frontend/src/container/GeneralSettingsCloud/index.tsx

@@ -0,0 +1,3 @@
+import GeneralSettingsCloud from './GeneralSettingsCloud';
+
+export default GeneralSettingsCloud;

frontend/src/container/ServiceApplication/ServiceMetrics/ServiceMetricTable.tsx

@@ -91,6 +91,11 @@ function ServiceMetricTable({
 			<ResourceAttributesFilter />
 
 			<ResizeTable
+				pagination={{
+					defaultPageSize: 10,
+					showTotal: (total: number, range: number[]): string =>
+						`${range[0]}-${range[1]} of ${total} items`,
+				}}
 				columns={tableColumns}
 				loading={isLoading}
 				dataSource={services}

frontend/src/container/ServiceApplication/ServiceTraces/ServiceTracesTable.tsx

@@ -49,6 +49,11 @@ function ServiceTraceTable({
 			<ResourceAttributesFilter />
 
 			<ResizeTable
+				pagination={{
+					defaultPageSize: 10,
+					showTotal: (total: number, range: number[]): string =>
+						`${range[0]}-${range[1]} of ${total} items`,
+				}}
 				columns={tableColumns}
 				loading={loading}
 				dataSource={services}

frontend/src/container/SideNav/SideNav.tsx

@@ -253,6 +253,15 @@ function SideNav({
 		}
 	}, [isCloudUserVal, isEnterprise, isFetching]);
 
+	const [isCurrentOrgSettings] = useComponentPermission(
+		['current_org_settings'],
+		role,
+	);
+
+	const settingsRoute = isCurrentOrgSettings
+		? ROUTES.ORG_SETTINGS
+		: ROUTES.SETTINGS;
+
 	return (
 		<div className={cx('sideNav', collapsed ? 'collapsed' : '')}>
 			<div className="brand">
@@ -302,7 +311,9 @@ function SideNav({
 						item={item}
 						isActive={activeMenuKey === item.key}
 						onClick={(): void => {
-							if (item) {
+							if (item.key === ROUTES.SETTINGS) {
+								history.push(settingsRoute);
+							} else if (item) {
 								onClickHandler(item?.key as string);
 							}
 						}}

frontend/src/container/TopNav/DateTimeSelection/config.ts

@@ -96,3 +96,13 @@ export const routesToSkip = [
 ];
 
 export const routesToDisable = [ROUTES.LOGS_EXPLORER, ROUTES.LIVE_LOGS];
+
+export interface LocalStorageTimeRange {
+	localstorageStartTime: string | null;
+	localstorageEndTime: string | null;
+}
+
+export interface TimeRange {
+	startTime: string;
+	endTime: string;
+}

frontend/src/container/TopNav/DateTimeSelection/index.tsx

@@ -15,6 +15,7 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import GetMinMax from 'lib/getMinMax';
 import getTimeString from 'lib/getTimeString';
 import history from 'lib/history';
+import { isObject } from 'lodash-es';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { connect, useSelector } from 'react-redux';
 import { RouteComponentProps, withRouter } from 'react-router-dom';
@@ -27,7 +28,13 @@ import { GlobalReducer } from 'types/reducer/globalTime';
 
 import AutoRefresh from '../AutoRefresh';
 import CustomDateTimeModal, { DateTimeRangeType } from '../CustomDateTimeModal';
-import { getDefaultOption, getOptions, Time } from './config';
+import {
+	getDefaultOption,
+	getOptions,
+	LocalStorageTimeRange,
+	Time,
+	TimeRange,
+} from './config';
 import RefreshText from './Refresh';
 import { Form, FormContainer, FormItem } from './styles';
 
@@ -44,8 +51,35 @@ function DateTimeSelection({
 	const searchStartTime = urlQuery.get('startTime');
 	const searchEndTime = urlQuery.get('endTime');
 
-	const localstorageStartTime = getLocalStorageKey('startTime');
-	const localstorageEndTime = getLocalStorageKey('endTime');
+	const {
+		localstorageStartTime,
+		localstorageEndTime,
+	} = ((): LocalStorageTimeRange => {
+		const routes = getLocalStorageKey(LOCALSTORAGE.METRICS_TIME_IN_DURATION);
+
+		if (routes !== null) {
+			const routesObject = JSON.parse(routes || '{}');
+			const selectedTime = routesObject[location.pathname];
+
+			if (selectedTime) {
+				let parsedSelectedTime: TimeRange;
+				try {
+					parsedSelectedTime = JSON.parse(selectedTime);
+				} catch {
+					parsedSelectedTime = selectedTime;
+				}
+
+				if (isObject(parsedSelectedTime)) {
+					return {
+						localstorageStartTime: parsedSelectedTime.startTime,
+						localstorageEndTime: parsedSelectedTime.endTime,
+					};
+				}
+				return { localstorageStartTime: null, localstorageEndTime: null };
+			}
+		}
+		return { localstorageStartTime: null, localstorageEndTime: null };
+	})();
 
 	const getTime = useCallback((): [number, number] | undefined => {
 		if (searchEndTime && searchStartTime) {
@@ -118,6 +152,15 @@ function DateTimeSelection({
 			const selectedTime = routesObject[pathName];
 
 			if (selectedTime) {
+				let parsedSelectedTime: TimeRange;
+				try {
+					parsedSelectedTime = JSON.parse(selectedTime);
+				} catch {
+					parsedSelectedTime = selectedTime;
+				}
+				if (isObject(parsedSelectedTime)) {
+					return 'custom';
+				}
 				return selectedTime;
 			}
 		}
@@ -125,7 +168,7 @@ function DateTimeSelection({
 		return defaultSelectedOption;
 	};
 
-	const updateLocalStorageForRoutes = (value: Time): void => {
+	const updateLocalStorageForRoutes = (value: Time | string): void => {
 		const preRoutes = getLocalStorageKey(LOCALSTORAGE.METRICS_TIME_IN_DURATION);
 		if (preRoutes !== null) {
 			const preRoutesObject = JSON.parse(preRoutes);
@@ -220,9 +263,9 @@ function DateTimeSelection({
 					startTimeMoment?.toDate().getTime() || 0,
 					endTimeMoment?.toDate().getTime() || 0,
 				]);
-				setLocalStorageKey('startTime', startTimeMoment.toString());
-				setLocalStorageKey('endTime', endTimeMoment.toString());
-				updateLocalStorageForRoutes('custom');
+				updateLocalStorageForRoutes(
+					JSON.stringify({ startTime: startTimeMoment, endTime: endTimeMoment }),
+				);
 				if (!isLogsExplorerPage) {
 					urlQuery.set(
 						QueryParams.startTime,

frontend/src/lib/getChartData.ts

@@ -88,9 +88,11 @@ const getChartData = ({
 	const allLabels = modifiedData.map((e) => e.label);
 
 	const updatedDataSet = updatedSortedData.map((e, index) => {
+		const label = allLabels[index];
+
 		const datasetBaseConfig = {
 			index,
-			label: allLabels[index],
+			label,
 			borderColor: colors[index % colors.length] || 'red',
 			data: e.second,
 			borderWidth: 1.5,

frontend/src/lib/uPlotLib/plugins/tooltipPlugin.ts

@@ -1,11 +1,12 @@
 import { getToolTipValue } from 'components/Graph/yAxisConfig';
+import { themeColors } from 'constants/theme';
 import dayjs from 'dayjs';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
 import getLabelName from 'lib/getLabelName';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 
-import { colors } from '../../getRandomColor';
 import { placement } from '../placement';
+import { generateColor } from '../utils/generateColor';
 
 dayjs.extend(customParseFormat);
 
@@ -54,12 +55,14 @@ const generateTooltipContent = (
 				const value = data[index][idx];
 				const label = getLabelName(metric, queryName || '', legend || '');
 
+				const color = generateColor(label, themeColors.chartcolors);
+
 				if (Number.isFinite(value)) {
 					const tooltipValue = getToolTipValue(value, yAxisUnit);
 
 					const dataObj = {
 						show: item.show || false,
-						color: colors[(index - 1) % colors.length],
+						color,
 						label,
 						// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 						// @ts-ignore

frontend/src/lib/uPlotLib/utils/generateColor.ts

@@ -0,0 +1,20 @@
+/* eslint-disable no-bitwise */
+export function hashFn(str: string): number {
+	let hash = 5381;
+	for (let i = 0; i < str.length; i++) {
+		hash = (hash * 33) ^ str.charCodeAt(i);
+	}
+
+	return hash >>> 0;
+}
+
+export function generateColor(
+	key: string,
+	colorMap: Record<string, string>,
+): string {
+	const hashValue = hashFn(key);
+	const keys = Object.keys(colorMap);
+	const colorIndex = hashValue % keys.length;
+	const selectedKey = keys[colorIndex];
+	return colorMap[selectedKey];
+}

frontend/src/lib/uPlotLib/utils/getSeriesData.ts

@@ -1,8 +1,9 @@
+import { themeColors } from 'constants/theme';
 import getLabelName from 'lib/getLabelName';
-import { colors } from 'lib/getRandomColor';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 import { QueryData } from 'types/api/widgets/getQuery';
 
+import { generateColor } from './generateColor';
 import getRenderer, { drawStyles, lineInterpolations } from './getRenderer';
 
 const paths = (
@@ -36,8 +37,6 @@ const getSeries = (
 	const newGraphVisibilityStates = graphsVisibilityStates?.slice(1);
 
 	for (let i = 0; i < seriesList?.length; i += 1) {
-		const color = colors[i % colors.length]; // Use modulo to loop through colors if there are more series than colors
-
 		const { metric = {}, queryName = '', legend = '' } = widgetMetaData[i] || {};
 
 		const label = getLabelName(
@@ -46,6 +45,8 @@ const getSeries = (
 			legend || '',
 		);
 
+		const color = generateColor(label, themeColors.chartcolors);
+
 		const pointSize = seriesList[i].values.length > 1 ? 5 : 10;
 		const showPoints = !(seriesList[i].values.length > 1);
 

frontend/src/pages/Settings/config.ts

@@ -2,17 +2,21 @@ import { RouteTabProps } from 'components/RouteTab/types';
 import ROUTES from 'constants/routes';
 import AlertChannels from 'container/AllAlertChannels';
 import GeneralSettings from 'container/GeneralSettings';
+import GeneralSettingsCloud from 'container/GeneralSettingsCloud';
 import IngestionSettings from 'container/IngestionSettings/IngestionSettings';
 import OrganizationSettings from 'container/OrganizationSettings';
 import { TFunction } from 'i18next';
 
-export const commonRoutes = (t: TFunction): RouteTabProps['routes'] => [
+export const organizationSettings = (t: TFunction): RouteTabProps['routes'] => [
 	{
-		Component: GeneralSettings,
-		name: t('routes:general').toString(),
-		route: ROUTES.SETTINGS,
-		key: ROUTES.SETTINGS,
+		Component: OrganizationSettings,
+		name: t('routes:organization_settings').toString(),
+		route: ROUTES.ORG_SETTINGS,
+		key: ROUTES.ORG_SETTINGS,
 	},
+];
+
+export const alertChannels = (t: TFunction): RouteTabProps['routes'] => [
 	{
 		Component: AlertChannels,
 		name: t('routes:alert_channels').toString(),
@@ -30,11 +34,20 @@ export const ingestionSettings = (t: TFunction): RouteTabProps['routes'] => [
 	},
 ];
 
-export const organizationSettings = (t: TFunction): RouteTabProps['routes'] => [
+export const generalSettings = (t: TFunction): RouteTabProps['routes'] => [
 	{
-		Component: OrganizationSettings,
-		name: t('routes:organization_settings').toString(),
-		route: ROUTES.ORG_SETTINGS,
-		key: ROUTES.ORG_SETTINGS,
+		Component: GeneralSettings,
+		name: t('routes:general').toString(),
+		route: ROUTES.SETTINGS,
+		key: ROUTES.SETTINGS,
+	},
+];
+
+export const generalSettingsCloud = (t: TFunction): RouteTabProps['routes'] => [
+	{
+		Component: GeneralSettingsCloud,
+		name: t('routes:general').toString(),
+		route: ROUTES.SETTINGS,
+		key: ROUTES.SETTINGS,
 	},
 ];

frontend/src/pages/Settings/utils.ts

@@ -3,7 +3,9 @@ import { TFunction } from 'i18next';
 import { isCloudUser } from 'utils/app';
 
 import {
-	commonRoutes,
+	alertChannels,
+	generalSettings,
+	generalSettingsCloud,
 	ingestionSettings,
 	organizationSettings,
 } from './config';
@@ -12,15 +14,20 @@ export const getRoutes = (
 	isCurrentOrgSettings: boolean,
 	t: TFunction,
 ): RouteTabProps['routes'] => {
-	let common = commonRoutes(t);
+	const settings = [];
 
 	if (isCurrentOrgSettings) {
-		common = [...common, ...organizationSettings(t)];
+		settings.push(...organizationSettings(t));
 	}
 
 	if (isCloudUser()) {
-		common = [...common, ...ingestionSettings(t)];
+		settings.push(...ingestionSettings(t));
+		settings.push(...alertChannels(t));
+		settings.push(...generalSettingsCloud(t));
+	} else {
+		settings.push(...alertChannels(t));
+		settings.push(...generalSettings(t));
 	}
 
-	return common;
+	return settings;
 };

go.mod

@@ -5,7 +5,7 @@ go 1.21
 require (
 	github.com/ClickHouse/clickhouse-go/v2 v2.15.0
 	github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb
-	github.com/SigNoz/signoz-otel-collector v0.88.9
+	github.com/SigNoz/signoz-otel-collector v0.88.11
 	github.com/SigNoz/zap_otlp/zap_otlp_encoder v0.0.0-20230822164844-1b861a431974
 	github.com/SigNoz/zap_otlp/zap_otlp_sync v0.0.0-20230822164844-1b861a431974
 	github.com/antonmedv/expr v1.15.3

go.sum

@@ -98,8 +98,8 @@ github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb h1:bneLSKPf9YUSFm
 github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb/go.mod h1:JznGDNg9x1cujDKa22RaQOimOvvEfy3nxzDGd8XDgmA=
 github.com/SigNoz/prometheus v1.9.78 h1:bB3yuDrRzi/Mv00kWayR9DZbyjTuGfendSqISyDcXiY=
 github.com/SigNoz/prometheus v1.9.78/go.mod h1:MffmFu2qFILQrOHehx3D0XjYtaZMVfI+Ppeiv98x4Ww=
-github.com/SigNoz/signoz-otel-collector v0.88.9 h1:7bbJSXrSZcQsdEVVLsjsNXm/bWe9MhKu8qfXp8MlXQM=
-github.com/SigNoz/signoz-otel-collector v0.88.9/go.mod h1:7I4FWwraVSnDywsPNbo8TdHDsPxShtYkGU5usr6dTtk=
+github.com/SigNoz/signoz-otel-collector v0.88.11 h1:w9IVcXg5T+o37c0HVtBfxdKxkPYyiGX1YaOrCexpjrc=
+github.com/SigNoz/signoz-otel-collector v0.88.11/go.mod h1:2ddO2lcb/4kMONIJXwfXxegRsi7FYPSWtXTgji3qsp8=
 github.com/SigNoz/zap_otlp v0.1.0 h1:T7rRcFN87GavY8lDGZj0Z3Xv6OhJA6Pj3I9dNPmqvRc=
 github.com/SigNoz/zap_otlp v0.1.0/go.mod h1:lcHvbDbRgvDnPxo9lDlaL1JK2PyOyouP/C3ynnYIvyo=
 github.com/SigNoz/zap_otlp/zap_otlp_encoder v0.0.0-20230822164844-1b861a431974 h1:PKVgdf83Yw+lZJbFtNGBgqXiXNf3+kOXW2qZ7Ms7OaY=

pkg/query-service/tests/test-deploy/docker-compose.yaml

@@ -192,7 +192,7 @@ services:
     <<: *db-depend
 
   otel-collector-migrator:
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.9}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.11}
     container_name: otel-migrator
     command:
       - "--dsn=tcp://clickhouse:9000"
@@ -205,7 +205,7 @@ services:
       #   condition: service_healthy
 
   otel-collector:
-    image: signoz/signoz-otel-collector:0.88.9
+    image: signoz/signoz-otel-collector:0.88.11
     container_name: signoz-otel-collector
     command:
       [