@odigos/ui-kit 0.0.68 → 0.0.69

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [0.0.69](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.68...ui-kit-v0.0.69) (2025-08-04)
4
+
5
+
6
+ ### Features
7
+
8
+ * better tooltips for all fields (system settings) ([#281](https://github.com/odigos-io/ui-kit/issues/281)) ([8b19a2f](https://github.com/odigos-io/ui-kit/commit/8b19a2f081f77a52ec08ce91134e1eb4ca6ae15b))
9
+
3
10
  ## [0.0.68](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.67...ui-kit-v0.0.68) (2025-07-23)
4
11
 
5
12
 
@@ -1,9 +1,10 @@
1
- import React, { CSSProperties, PropsWithChildren, ReactNode } from 'react';
2
- interface PopupProps extends PropsWithChildren {
1
+ import React, { type CSSProperties, type HTMLAttributes, type PropsWithChildren, type ReactNode } from 'react';
2
+ interface PopupProps extends PropsWithChildren, HTMLAttributes<HTMLDivElement> {
3
3
  header?: ReactNode;
4
4
  footer?: ReactNode;
5
5
  isOpen: boolean;
6
6
  asPortal?: boolean;
7
+ withPointerEvents?: boolean;
7
8
  top?: number;
8
9
  bottom?: number;
9
10
  left?: number;
@@ -1,6 +1,6 @@
1
1
  import { type DetailedHTMLProps, type FC, type HTMLAttributes, type ReactNode } from 'react';
2
2
  interface TextProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
3
- children: ReactNode;
3
+ children?: ReactNode;
4
4
  color?: string;
5
5
  size?: number;
6
6
  weight?: number;
package/lib/components.js CHANGED
@@ -1,16 +1,16 @@
1
- import { B as Button } from './index-5772129e.js';
2
- export { A as AutocompleteInput, a as Badge, a6 as CenterThis, C as Checkbox, b as Code, c as ConditionDetails, D as DataCard, e as DataCardFieldTypes, d as DataCardFields, f as DataFinger, g as DataTab, h as DescribeRow, i as Divider, j as DocsButton, k as Drawer, m as DrawerFooter, l as DrawerHeader, n as Dropdown, E as ExtendArrow, F as FadeLoader, o as FieldError, p as FieldLabel, a5 as FlexColumn, a4 as FlexRow, H as Header, I as IconButton, q as IconGroup, r as IconTitleBadge, s as IconWrapped, t as IconsNav, u as ImageControlled, v as Input, w as InputList, x as InputTable, y as InteractiveTable, K as KeyValueInputsList, M as Modal, a9 as ModalBody, z as MonitorsCheckboxes, G as MonitorsIcons, N as NavigationButtons, J as NoDataFound, L as NotificationNote, a8 as Overlay, P as Popup, O as PopupForm, S as ScrollX, Q as SectionTitle, R as Segment, U as SelectionButton, V as SkeletonLoader, W as Status, X as Stepper, Y as TabList, aa as TableContainer, ab as TableTitleWrap, ac as TableWrap, Z as Tag, _ as Text, $ as TextArea, a0 as Toggle, T as ToggleCodeComponent, a1 as Tooltip, a2 as TraceLoader, a7 as VerticalScroll, a3 as WarningModal } from './index-5772129e.js';
3
- export { C as CancelWarning, D as DeleteWarning } from './index-847d188f.js';
1
+ import { B as Button } from './index-728cf83d.js';
2
+ export { A as AutocompleteInput, a as Badge, a6 as CenterThis, C as Checkbox, b as Code, c as ConditionDetails, D as DataCard, e as DataCardFieldTypes, d as DataCardFields, f as DataFinger, g as DataTab, h as DescribeRow, i as Divider, j as DocsButton, k as Drawer, m as DrawerFooter, l as DrawerHeader, n as Dropdown, E as ExtendArrow, F as FadeLoader, o as FieldError, p as FieldLabel, a5 as FlexColumn, a4 as FlexRow, H as Header, I as IconButton, q as IconGroup, r as IconTitleBadge, s as IconWrapped, t as IconsNav, u as ImageControlled, v as Input, w as InputList, x as InputTable, y as InteractiveTable, K as KeyValueInputsList, M as Modal, a9 as ModalBody, z as MonitorsCheckboxes, G as MonitorsIcons, N as NavigationButtons, J as NoDataFound, L as NotificationNote, a8 as Overlay, P as Popup, O as PopupForm, S as ScrollX, Q as SectionTitle, R as Segment, U as SelectionButton, V as SkeletonLoader, W as Status, X as Stepper, Y as TabList, aa as TableContainer, ab as TableTitleWrap, ac as TableWrap, Z as Tag, _ as Text, $ as TextArea, a0 as Toggle, T as ToggleCodeComponent, a1 as Tooltip, a2 as TraceLoader, a7 as VerticalScroll, a3 as WarningModal } from './index-728cf83d.js';
3
+ export { C as CancelWarning, D as DeleteWarning } from './index-b3808507.js';
4
4
  import React, { createContext, Component, createElement } from 'react';
5
- import { T as Theme } from './index-bd48e6e2.js';
5
+ import { T as Theme } from './index-8fc2f11e.js';
6
6
  import 'styled-components';
7
- import './index-391844c6.js';
7
+ import './index-fed7fc91.js';
8
8
  import './types.js';
9
9
  import './index-5e5f7bda.js';
10
- import './index-58440c5c.js';
11
- import './index-50101bec.js';
10
+ import './index-281d9862.js';
11
+ import './index-89b23a82.js';
12
12
  import 'react-dom';
13
- import './useTransition-c2aef0e4.js';
13
+ import './useTransition-26bd4722.js';
14
14
 
15
15
  const ErrorBoundaryContext = createContext(null);
16
16
 
package/lib/constants.js CHANGED
@@ -1,4 +1,4 @@
1
- export { A as ACTION_OPTIONS, B as BUTTON_TEXTS, a as DEFAULT_DATA_STREAM_NAME, D as DISPLAY_LANGUAGES, b as DISPLAY_TITLES, F as FORM_ALERTS, I as INSTRUMENTATION_RULE_OPTIONS, L as LANGUAGE_OPTIONS, M as MONITORS_OPTIONS, S as STORAGE_KEYS } from './index-bd48e6e2.js';
1
+ export { A as ACTION_OPTIONS, B as BUTTON_TEXTS, a as DEFAULT_DATA_STREAM_NAME, D as DISPLAY_LANGUAGES, b as DISPLAY_TITLES, F as FORM_ALERTS, I as INSTRUMENTATION_RULE_OPTIONS, L as LANGUAGE_OPTIONS, M as MONITORS_OPTIONS, S as STORAGE_KEYS } from './index-8fc2f11e.js';
2
2
  export { D as DESTINATION_CATEGORIES } from './index-1cb4f9e2.js';
3
3
  import 'react';
4
4
  import './types.js';
@@ -1,4 +1,5 @@
1
1
  import type { DropdownOption } from '@/components';
2
- import { AgentEnvVarsInjectionMethod, MountMethod } from '@/types';
2
+ import { AgentEnvVarsInjectionMethod, MountMethod, Profile } from '@/types';
3
3
  export declare const MOUNT_METHOD_OPTIONS: DropdownOption<MountMethod>[];
4
4
  export declare const AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS: DropdownOption<AgentEnvVarsInjectionMethod>[];
5
+ export declare const PROFILE_OPTIONS: DropdownOption<Profile>[];
@@ -7,6 +7,7 @@ export declare enum SettingsTabs {
7
7
  CollectorGateway = "Collector Gateway"
8
8
  }
9
9
  export interface SettingsProps {
10
+ isAdvanced: boolean;
10
11
  formData: OdigosConfig;
11
12
  handleFormChange: (key: keyof OdigosConfig | string, value: any) => void;
12
13
  }
package/lib/containers.js CHANGED
@@ -1,21 +1,21 @@
1
1
  import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle, useMemo, Fragment, useCallback, Children } from 'react';
2
2
  import styled, { css } from 'styled-components';
3
- import { b as DISPLAY_TITLES, T as Theme, U as usePendingStore, V as useNotificationStore, O as useDrawerStore, B as BUTTON_TEXTS, W as useEntityStore, A as ACTION_OPTIONS, g as getActionIcon, z as useModalStore, F as FORM_ALERTS, X as useFilterStore, D as DISPLAY_LANGUAGES, M as MONITORS_OPTIONS, d as getInstrumentationRuleIcon, Y as useDataStreamStore, Z as useInstrumentStore, c as getEntityId, S as STORAGE_KEYS, a as DEFAULT_DATA_STREAM_NAME, _ as useSetupStore, e as getProgrammingLanguageIcon, I as INSTRUMENTATION_RULE_OPTIONS, $ as useSelectedStore, j as ImageErrorIcon, a0 as useDarkMode } from './index-bd48e6e2.js';
4
- import { ActionType, ActionKeyTypes, InputTypes, FieldTypes, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, EdgeTypes, AddNodeTypes, SignalType, HeadersCollectionKeyTypes, CustomInstrumentationsKeyTypes, CodeAttributesKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType, K8sResourceKind, MountMethod, AgentEnvVarsInjectionMethod, InstallationMethod } from './types.js';
5
- import { e as DataCardFieldTypes, p as FieldLabel, C as Checkbox, o as FieldError, v as Input, x as InputTable, K as KeyValueInputsList, w as InputList, _ as Text, R as Segment, Q as SectionTitle, j as DocsButton, z as MonitorsCheckboxes, $ as TextArea, k as Drawer, c as ConditionDetails, D as DataCard, a5 as FlexColumn, M as Modal, N as NavigationButtons, a9 as ModalBody, L as NotificationNote, A as AutocompleteInput, i as Divider, W as Status, a4 as FlexRow, a1 as Tooltip, s as IconWrapped, G as MonitorsIcons, aa as TableContainer, ab as TableTitleWrap, r as IconTitleBadge, ac as TableWrap, y as InteractiveTable, a6 as CenterThis, J as NoDataFound, a2 as TraceLoader, a as Badge, E as ExtendArrow, a7 as VerticalScroll, U as SelectionButton, B as Button, n as Dropdown, ad as nodeConfig, ae as useNodesState, af as useEdgesState, ag as Flow, ah as applyNodeChanges, P as Popup, a0 as Toggle, I as IconButton, ai as AddButton, F as FadeLoader, g as DataTab, X as Stepper, d as DataCardFields, Z as Tag, aj as MarkerType, t as IconsNav, ak as CopyText, h as DescribeRow, al as PodContainer, am as SourceContainer, q as IconGroup, O as PopupForm } from './index-5772129e.js';
3
+ import { b as DISPLAY_TITLES, T as Theme, U as usePendingStore, V as useNotificationStore, O as useDrawerStore, B as BUTTON_TEXTS, W as useEntityStore, A as ACTION_OPTIONS, g as getActionIcon, z as useModalStore, F as FORM_ALERTS, X as useFilterStore, D as DISPLAY_LANGUAGES, M as MONITORS_OPTIONS, d as getInstrumentationRuleIcon, Y as useDataStreamStore, Z as useInstrumentStore, c as getEntityId, S as STORAGE_KEYS, a as DEFAULT_DATA_STREAM_NAME, _ as useSetupStore, e as getProgrammingLanguageIcon, I as INSTRUMENTATION_RULE_OPTIONS, $ as useSelectedStore, j as ImageErrorIcon, a0 as useDarkMode } from './index-8fc2f11e.js';
4
+ import { ActionType, ActionKeyTypes, InputTypes, FieldTypes, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, EdgeTypes, AddNodeTypes, SignalType, HeadersCollectionKeyTypes, CustomInstrumentationsKeyTypes, CodeAttributesKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType, K8sResourceKind, MountMethod, AgentEnvVarsInjectionMethod, Profile, InstallationMethod } from './types.js';
5
+ import { e as DataCardFieldTypes, p as FieldLabel, C as Checkbox, o as FieldError, v as Input, x as InputTable, K as KeyValueInputsList, w as InputList, _ as Text, R as Segment, Q as SectionTitle, j as DocsButton, z as MonitorsCheckboxes, $ as TextArea, k as Drawer, c as ConditionDetails, D as DataCard, a5 as FlexColumn, M as Modal, N as NavigationButtons, a9 as ModalBody, L as NotificationNote, A as AutocompleteInput, i as Divider, W as Status, a4 as FlexRow, a1 as Tooltip, s as IconWrapped, G as MonitorsIcons, aa as TableContainer, ab as TableTitleWrap, r as IconTitleBadge, ac as TableWrap, y as InteractiveTable, a6 as CenterThis, J as NoDataFound, a2 as TraceLoader, a as Badge, E as ExtendArrow, a7 as VerticalScroll, U as SelectionButton, B as Button, n as Dropdown, ad as nodeConfig, ae as useNodesState, af as useEdgesState, ag as Flow, ah as applyNodeChanges, P as Popup, a0 as Toggle, I as IconButton, ai as AddButton, F as FadeLoader, g as DataTab, X as Stepper, d as DataCardFields, Z as Tag, aj as MarkerType, t as IconsNav, ak as CopyText, h as DescribeRow, al as PodContainer, am as SourceContainer, q as IconGroup, O as PopupForm } from './index-728cf83d.js';
6
6
  import { i as isEmpty, s as safeJsonParse, d as deepClone } from './index-5e5f7bda.js';
7
- import { C as CheckCircledIcon, O as OdigosLogo } from './index-50101bec.js';
8
- import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, A as ArrowIcon, R as RefreshLeftArrowIcon, N as NotificationIcon, U as UserIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon, G as GearIcon } from './index-c1df4281.js';
7
+ import { C as CheckCircledIcon, O as OdigosLogo } from './index-89b23a82.js';
8
+ import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, A as ArrowIcon, R as RefreshLeftArrowIcon, N as NotificationIcon, U as UserIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon, G as GearIcon } from './index-35e207a1.js';
9
9
  import { useActionFormData, useSessionStorage, useDataStreamFormData, useDestinationFormData, useClickNotification, useSourceFormData, useSourceSelectionFormData } from './hooks.js';
10
- import { u as useKeyDown, a as useOnClickOutside, b as useContainerSize, c as useClickNode, d as usePopup, e as useInstrumentationRuleFormData, f as useTransition, g as useTimeAgo, h as useCopy, i as useGenericForm } from './useTransition-c2aef0e4.js';
11
- import { E as EditIcon, T as TrashIcon, S as SearchIcon, h as CheckIcon, P as PlusIcon, a as CopyIcon } from './index-391844c6.js';
12
- import { D as DeleteWarning, C as CancelWarning } from './index-847d188f.js';
13
- import { g as getConditionsBooleans, m as mapConditions, b as getStatusIcon, h as splitCamelString, c as capitalizeFirstLetter, i as isStringABoolean, p as parseBooleanFromString } from './index-58440c5c.js';
14
- import { f as filterActions, l as getEntityLabel, k as getEntityIcon, v as sleep, n as getPlatformIcon, o as getPlatformLabel, g as formatBytes, i as getContainersIcons, p as getValueForRange, j as getDestinationIcon, e as filterSourcesByStream, d as filterSources, b as filterDestinationsByStream, a as filterDestinations, u as mapDestinationFieldsForDisplay, c as compareCondition, r as getYamlFieldsForDestination, m as getMetricForEntity, q as getWorkloadId, s as hasUnhealthyInstances, h as getContainersInstrumentedCount, t as isOverTime } from './index-42f40e7c.js';
10
+ import { u as useKeyDown, a as useOnClickOutside, b as useContainerSize, c as useClickNode, d as usePopup, e as useInstrumentationRuleFormData, f as useTransition, g as useTimeAgo, h as useCopy, i as useGenericForm } from './useTransition-26bd4722.js';
11
+ import { E as EditIcon, T as TrashIcon, S as SearchIcon, h as CheckIcon, P as PlusIcon, a as CopyIcon } from './index-fed7fc91.js';
12
+ import { D as DeleteWarning, C as CancelWarning } from './index-b3808507.js';
13
+ import { g as getConditionsBooleans, m as mapConditions, b as getStatusIcon, h as splitCamelString, c as capitalizeFirstLetter, i as isStringABoolean, p as parseBooleanFromString } from './index-281d9862.js';
14
+ import { f as filterActions, l as getEntityLabel, k as getEntityIcon, v as sleep, n as getPlatformIcon, o as getPlatformLabel, g as formatBytes, i as getContainersIcons, p as getValueForRange, j as getDestinationIcon, e as filterSourcesByStream, d as filterSources, b as filterDestinationsByStream, a as filterDestinations, u as mapDestinationFieldsForDisplay, c as compareCondition, r as getYamlFieldsForDestination, m as getMetricForEntity, q as getWorkloadId, s as hasUnhealthyInstances, h as getContainersInstrumentedCount, t as isOverTime } from './index-ed649685.js';
15
15
  import { m as mapExportedSignals } from './index-6a6bea6e.js';
16
16
  import { NoteBackToSummary, EditButton } from './snippets.js';
17
17
  import { D as DESTINATION_CATEGORIES } from './index-1cb4f9e2.js';
18
- import { a6 as RulesIcon, a7 as SourcesIcon, a3 as ActionsIcon, a4 as DestinationsIcon } from './index-acc7c7dd.js';
18
+ import { a6 as RulesIcon, a7 as SourcesIcon, a3 as ActionsIcon, a4 as DestinationsIcon } from './index-5102bee6.js';
19
19
  import 'react-dom';
20
20
 
21
21
  const buildCard$3 = (action) => {
@@ -4605,7 +4605,7 @@ const ExpiresAt = ({ expiresAt }) => {
4605
4605
  ")"));
4606
4606
  };
4607
4607
 
4608
- const Relative = styled.div `
4608
+ const Relative$1 = styled.div `
4609
4609
  position: relative;
4610
4610
  `;
4611
4611
  const TokenActions = ({ token, saveToken }) => {
@@ -4627,7 +4627,7 @@ const TokenActions = ({ token, saveToken }) => {
4627
4627
  return (React.createElement(FlexRow, { "$gap": 0 },
4628
4628
  React.createElement(IconButton, { size: 32, onClick: () => clickCopy(token) }, isCopied ? React.createElement(SuccessIcon, null) : React.createElement(CopyIcon, null)),
4629
4629
  React.createElement(Divider, { orientation: 'vertical', length: '12px' }),
4630
- React.createElement(Relative, null,
4630
+ React.createElement(Relative$1, null,
4631
4631
  React.createElement(IconButton, { size: 32, onClick: onOpenEdit },
4632
4632
  React.createElement(EditIcon, null)),
4633
4633
  isEdit && (React.createElement(PopupForm, { flipX: true, clientX: 36, isOpen: isEdit, onClose: onCloseEdit, onSave: onSave, title: 'Enter a new API Token', titleTooltip: 'Contact us to generate a new one' },
@@ -4755,32 +4755,30 @@ const RowOfFields = styled(FlexRow) `
4755
4755
  justify-content: space-between;
4756
4756
  `;
4757
4757
 
4758
- const UiSettings = forwardRef(({ formData, handleFormChange }, ref) => {
4759
- const [isAdvanced, setIsAdvanced] = useState(false);
4758
+ const UiSettings = forwardRef(({ isAdvanced, formData, handleFormChange }, ref) => {
4760
4759
  return (React.createElement(Card, { ref: ref, id: SettingsTabs.Ui },
4761
4760
  React.createElement(RowOfFields, null,
4762
- React.createElement(CardTitle, null, "UI"),
4763
- React.createElement(Toggle, { title: 'Advanced Settings', tooltip: 'Show advanced settings. Note: these are not recommended to be changed unless you know what you are doing.', initialValue: isAdvanced, onChange: () => setIsAdvanced((prev) => !prev), flipHorizontally: true })),
4764
- isAdvanced && (React.createElement(Input, { status: StatusType.Warning, title: 'UI Pagination Limit (Advanced)', tooltip: 'Pagination limit for fetching data from the UI backend, bigger limit means more data will be fetched at once, and less requests will be made to the backend', type: 'number', required: true, value: formData.uiPaginationLimit?.toString() || '', onChange: (e) => {
4765
- const { value } = e.target;
4766
- handleFormChange('uiPaginationLimit', value === '' ? null : Number(value));
4767
- } })),
4768
- React.createElement(Input, { title: 'Central Backend URL', tooltip: 'URL of the central backend', required: true, value: formData.centralBackendURL || '', onChange: (e) => {
4761
+ React.createElement(CardTitle, null, "UI")),
4762
+ React.createElement(Input, { title: 'Central Backend URL', tooltip: 'When running the Centralized UI, you need to specify the URL of the central backend. <a href="https://docs.odigos.io/features/central">Learn more</a>.', required: true, value: formData.centralBackendURL || '', onChange: (e) => {
4769
4763
  const { value } = e.target;
4770
4764
  handleFormChange('centralBackendURL', value || null);
4771
4765
  } }),
4772
- React.createElement(Input, { title: 'OIDC Tenant URL', tooltip: 'URL of the OIDC tenant', required: true, value: formData.oidc?.tenantUrl || '', onChange: (e) => {
4766
+ React.createElement(Input, { title: 'OIDC Tenant URL', tooltip: 'If you need to restrict access to the Community UI, you can setup an OIDC provider. To do so you need to specify the URL of the OIDC tenant. <a href="https://docs.odigos.io/features/oidc">Learn more</a>.', required: true, value: formData.oidc?.tenantUrl || '', onChange: (e) => {
4773
4767
  const { value } = e.target;
4774
4768
  handleFormChange('oidc.tenantUrl', value || null);
4775
4769
  } }),
4776
- React.createElement(Input, { title: 'OIDC Client ID', tooltip: 'Client ID of the OIDC application', required: true, value: formData.oidc?.clientId || '', onChange: (e) => {
4770
+ React.createElement(Input, { title: 'OIDC Client ID', tooltip: 'If you need to restrict access to the Community UI, you can setup an OIDC provider. To do so you need to specify the Client ID of the OIDC application. <a href="https://docs.odigos.io/features/oidc">Learn more</a>.', required: true, value: formData.oidc?.clientId || '', onChange: (e) => {
4777
4771
  const { value } = e.target;
4778
4772
  handleFormChange('oidc.clientId', value || null);
4779
4773
  } }),
4780
- React.createElement(Input, { title: 'OIDC Client Secret', tooltip: 'Client Secret of the OIDC application', type: 'password', required: true, value: formData.oidc?.clientSecret || '', onChange: (e) => {
4774
+ React.createElement(Input, { title: 'OIDC Client Secret', tooltip: 'If you need to restrict access to the Community UI, you can setup an OIDC provider. To do so you need to specify the Client Secret of the OIDC application. <a href="https://docs.odigos.io/features/oidc">Learn more</a>.', type: 'password', required: true, value: formData.oidc?.clientSecret || '', onChange: (e) => {
4781
4775
  const { value } = e.target;
4782
4776
  handleFormChange('oidc.clientSecret', value || null);
4783
- } })));
4777
+ } }),
4778
+ isAdvanced && (React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) UI Pagination Limit', tooltip: 'The pagination limit for fetching data from the UI backend. A larger limit means more data will be fetched at once, reducing the number of requests to the backend. This might increase or decrease the performance of the UI - depending on your environment.', type: 'number', required: true, value: formData.uiPaginationLimit?.toString() || '', onChange: (e) => {
4779
+ const { value } = e.target;
4780
+ handleFormChange('uiPaginationLimit', value === '' ? null : Number(value));
4781
+ } }))));
4784
4782
  });
4785
4783
  UiSettings.displayName = UiSettings.name;
4786
4784
 
@@ -4794,39 +4792,61 @@ const AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS = [
4794
4792
  { id: AgentEnvVarsInjectionMethod.PodManifest, value: 'Pod Manifest' },
4795
4793
  { id: AgentEnvVarsInjectionMethod.LoaderFallbackToPodManifest, value: 'Loader Fallback to Pod Manifest' },
4796
4794
  ];
4795
+ const PROFILE_OPTIONS = [
4796
+ // { id: Profile.CategoryAttributes, value: 'Category Attributes' },
4797
+ { id: Profile.CodeAttributes, value: 'Code Attributes' },
4798
+ // { id: Profile.CopyScope, value: 'Copy Scope' },
4799
+ // { id: Profile.HostnameAsPodname, value: 'Hostname as Podname' },
4800
+ { id: Profile.FullPayloadCollection, value: 'Full Payload Collection' },
4801
+ { id: Profile.DbPayloadCollection, value: 'DB Payload Collection' },
4802
+ { id: Profile.QueryOperationDetector, value: 'Query Operation Detector' },
4803
+ // { id: Profile.Semconv, value: 'Semconv' },
4804
+ // { id: Profile.ReduceSpanNameCardinality, value: 'Reduce Span Name Cardinality' },
4805
+ { id: Profile.AllowConcurrentAgents, value: 'Allow Concurrent Agents' },
4806
+ { id: Profile.JavaEbpfInstrumentations, value: 'Java EBPF Instrumentations' },
4807
+ { id: Profile.JavaNativeInstrumentations, value: 'Java Native Instrumentations' },
4808
+ // { id: Profile.LegacyDotnetInstrumentation, value: 'Legacy .NET Instrumentation' },
4809
+ // { id: Profile.MountMethodK8sHostPath, value: 'Mount Method K8s Host Path' },
4810
+ // { id: Profile.MountMethodK8sVirtualDevice, value: 'Mount Method K8s Virtual Device' },
4811
+ // { id: Profile.PodManifestEnvVarInjection, value: 'Pod Manifest Env Var Injection' },
4812
+ // { id: Profile.DisableGin, value: 'Disable Gin' },
4813
+ // { id: Profile.SmallBatches, value: 'Small Batches' },
4814
+ { id: Profile.SizeS, value: 'Size S' },
4815
+ { id: Profile.SizeM, value: 'Size M' },
4816
+ { id: Profile.SizeL, value: 'Size L' },
4817
+ ];
4797
4818
 
4798
- const GeneralSettings = forwardRef(({ formData, handleFormChange }, ref) => {
4799
- const [isAdvanced, setIsAdvanced] = useState(false);
4819
+ const GeneralSettings = forwardRef(({ isAdvanced, formData, handleFormChange }, ref) => {
4800
4820
  return (React.createElement(Card, { ref: ref, id: SettingsTabs.General },
4801
4821
  React.createElement(RowOfFields, null,
4802
- React.createElement(CardTitle, null, "General"),
4803
- React.createElement(Toggle, { title: 'Advanced Settings', tooltip: 'Show advanced settings. Note: these are not recommended to be changed unless you know what you are doing.', initialValue: isAdvanced, onChange: () => setIsAdvanced((prev) => !prev), flipHorizontally: true })),
4804
- isAdvanced && (React.createElement(React.Fragment, null,
4805
- React.createElement(Dropdown, { status: StatusType.Warning, title: 'Mount Method (Advanced)', tooltip: 'Method used to mount volume', options: MOUNT_METHOD_OPTIONS, required: true, value: MOUNT_METHOD_OPTIONS.find((option) => option.id === formData.mountMethod) || undefined, onSelect: (option) => handleFormChange('mountMethod', option.id) }),
4806
- React.createElement(Dropdown, { status: StatusType.Warning, title: 'Agent Envs Injection Method (Advanced)', tooltip: 'How to inject environment variables into agents', options: AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS, required: true, value: AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS.find((option) => option.id === formData.agentEnvVarsInjectionMethod) || undefined, onSelect: (option) => handleFormChange('agentEnvVarsInjectionMethod', option.id) }),
4807
- React.createElement(Input, { status: StatusType.Warning, title: 'Odiglet Health Probe Bind Port (Advanced)', tooltip: 'Port to bind the health probe', type: 'number', required: true, value: formData.odigletHealthProbeBindPort?.toString() || '', onChange: (e) => {
4808
- const { value } = e.target;
4809
- handleFormChange('odigletHealthProbeBindPort', value === '' ? null : Number(value));
4810
- } }),
4811
- React.createElement(Input, { status: StatusType.Warning, title: 'Custom Container Runtime Socket Path (Advanced)', tooltip: 'Path to the custom container runtime socket', required: true, value: formData.customContainerRuntimeSocketPath || '', onChange: (e) => {
4812
- const { value } = e.target;
4813
- handleFormChange('customContainerRuntimeSocketPath', value || null);
4814
- } }))),
4815
- React.createElement(Toggle, { title: 'Karpenter Enabled', tooltip: 'Enable Karpenter support', initialValue: formData.karpenterEnabled || false, onChange: (bool) => handleFormChange('karpenterEnabled', bool) }),
4816
- React.createElement(Toggle, { title: 'Allow Concurrent Agents', tooltip: 'Allow concurrent running agents', initialValue: formData.allowConcurrentAgents || false, onChange: (bool) => handleFormChange('allowConcurrentAgents', bool) }),
4817
- React.createElement(Toggle, { title: 'Automatic Rollout Disabled', tooltip: 'Disable automatic rollout of pods after instrumentation', initialValue: formData.rollout?.automaticRolloutDisabled || false, onChange: (bool) => handleFormChange('rollout.automaticRolloutDisabled', bool) }),
4818
- React.createElement(Input, { title: 'Cluster Name', tooltip: 'Name of the cluster', required: true, value: formData.clusterName || '', onChange: (e) => {
4822
+ React.createElement(CardTitle, null, "General")),
4823
+ React.createElement(Input, { title: 'Cluster Name', tooltip: 'Name of the cluster, this is optional, but required in the Centralized UI. <a href="https://docs.odigos.io/features/central">Learn more</a>.', required: true, value: formData.clusterName || '', onChange: (e) => {
4819
4824
  const { value } = e.target;
4820
4825
  handleFormChange('clusterName', value || null);
4821
4826
  } }),
4822
- React.createElement(Input, { title: 'Image Prefix', tooltip: 'Docker image prefix for all Odigos components', disabled: true, required: true, value: formData.imagePrefix || '', onChange: (e) => {
4827
+ React.createElement(Toggle, { title: 'Enable the Karpenter Integration', tooltip: '<a href="https://docs.odigos.io/setup/odigos-with-karpenter">Learn how to configure Karpenter</a>. Once the Karpenter tainting setup is complete, inform Odigos to disable node affinity and rely on the taint mechanism.', initialValue: formData.karpenterEnabled || false, onChange: (bool) => handleFormChange('karpenterEnabled', bool) }),
4828
+ React.createElement(Toggle, { title: 'Allow Odigos Alongisde Other Agents', tooltip: 'By default Odigos does not instrument applications that are already instrumented by other agents. If you want to allow Odigos to instrument applications that are already instrumented by other agents, enable this option. Note: this is not recommended and should be used only if you know what you are doing.', initialValue: formData.allowConcurrentAgents || false, onChange: (bool) => handleFormChange('allowConcurrentAgents', bool) }),
4829
+ React.createElement(Toggle, { title: 'Disable Automatic Rollout', tooltip: 'By default, Odigos automatically rolls out the pods after the instrumentation is complete. If you want to disable rollouts and do it manually, toggle this option.', initialValue: formData.rollout?.automaticRolloutDisabled || false, onChange: (bool) => handleFormChange('rollout.automaticRolloutDisabled', bool) }),
4830
+ React.createElement(Input, { title: 'Image Prefix', tooltip: 'Docker image prefix for all Odigos components. This is disabled because this setting requires a CLI update.', disabled: true, required: true, value: formData.imagePrefix || '', onChange: (e) => {
4823
4831
  const { value } = e.target;
4824
4832
  handleFormChange('imagePrefix', value || null);
4825
4833
  } }),
4826
4834
  React.createElement(KeyValueInputsList, { title: 'Node Selector', tooltip: 'NodeSelector is a map of key-value Kubernetes NodeSelector labels to apply to all Odigos components. Note that Odigos will only be able to instrument applications on the same node. This setting can be applied only via the CLI.', disabled: true, required: true, value: Object.entries(formData.nodeSelector || {}).map(([key, value]) => ({ key, value })) }),
4835
+ React.createElement(Dropdown, { title: 'Profiles', tooltip: 'Enable custom profiles to customize the Odigos instrumentation.', isMulti: true, options: PROFILE_OPTIONS, value: PROFILE_OPTIONS.filter((option) => formData.profiles?.includes(option.id)), onSelect: (option) => handleFormChange('profiles', [...(formData.profiles || []), option.id]), onDeselect: (option) => handleFormChange('profiles', formData.profiles?.filter((p) => p !== option.id) || []) }),
4827
4836
  React.createElement(RowOfFields, null,
4828
- React.createElement(InputList, { title: 'Ignored Namespaces', tooltip: 'List of namespaces to exclude from instrumentation', required: true, value: formData.ignoredNamespaces || [], onChange: (arr) => handleFormChange('ignoredNamespaces', arr) }),
4829
- React.createElement(InputList, { title: 'Ignored Containers', tooltip: 'List of container names to exclude from instrumentation, this is a global setting and will be applied to all applications', required: true, value: formData.ignoredContainers || [], onChange: (arr) => handleFormChange('ignoredContainers', arr) }))));
4837
+ React.createElement(InputList, { title: 'Ignored Namespaces', tooltip: 'List of namespaces to exclude from instrumentation. Note: you cannot remove the default namespaces from the list, but you are able to add more namespaces.', required: true, value: formData.ignoredNamespaces || [], onChange: (arr) => handleFormChange('ignoredNamespaces', arr) }),
4838
+ React.createElement(InputList, { title: 'Ignored Containers', tooltip: 'List of container names to exclude from instrumentation, this is a global setting and will be applied to all applications', required: true, value: formData.ignoredContainers || [], onChange: (arr) => handleFormChange('ignoredContainers', arr) })),
4839
+ isAdvanced && (React.createElement(React.Fragment, null,
4840
+ React.createElement(Dropdown, { status: StatusType.Warning, title: '(Advanced) Mount Method', tooltip: 'For Odigos agents to run inside instrumented pod containers, certain files must be mounted into the container. In Kubernetes, these files are mounted under `/var/odigos` directory, with subdirectories for each agent. <a href="https://docs.odigos.io/instrumentations/configuration/mount-method#agent-mount-method">Learn more</a>.', options: MOUNT_METHOD_OPTIONS, required: true, value: MOUNT_METHOD_OPTIONS.find((option) => option.id === formData.mountMethod) || undefined, onSelect: (option) => handleFormChange('mountMethod', option.id) }),
4841
+ React.createElement(Dropdown, { status: StatusType.Warning, title: '(Advanced) Agent Envs Injection Method', tooltip: 'In order for Odigos to instrument applications, it needs to inject environment variables into the application. This setting controls how Odigos injects these environment variables.', options: AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS, required: true, value: AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS.find((option) => option.id === formData.agentEnvVarsInjectionMethod) || undefined, onSelect: (option) => handleFormChange('agentEnvVarsInjectionMethod', option.id) }),
4842
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Odiglet Health Probe Port', tooltip: 'If the Odiglet is running with a host network, it may conflict with the port of other processes. This setting allows you to specify a different port for the health probe.', type: 'number', required: true, value: formData.odigletHealthProbeBindPort?.toString() || '', onChange: (e) => {
4843
+ const { value } = e.target;
4844
+ handleFormChange('odigletHealthProbeBindPort', value === '' ? null : Number(value));
4845
+ } }),
4846
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Custom Container Runtime Socket Path', tooltip: 'If containerd is located in a different path than the default supported path by Odigos, then you can specify the socket path here.', required: true, value: formData.customContainerRuntimeSocketPath || '', onChange: (e) => {
4847
+ const { value } = e.target;
4848
+ handleFormChange('customContainerRuntimeSocketPath', value || null);
4849
+ } })))));
4830
4850
  });
4831
4851
  GeneralSettings.displayName = GeneralSettings.name;
4832
4852
 
@@ -4835,113 +4855,109 @@ const RollbackSettings = forwardRef(({ formData, handleFormChange }, ref) => {
4835
4855
  React.createElement(CardTitle, null, "Rollback"),
4836
4856
  React.createElement(Toggle, { title: 'Rollback Disabled', tooltip: 'Disable rollback', initialValue: formData.rollbackDisabled || false, onChange: (bool) => handleFormChange('rollbackDisabled', bool) }),
4837
4857
  React.createElement(RowOfFields, null,
4838
- React.createElement(Input, { title: 'Rollback Grace Time', tooltip: 'Grace time for rollback', required: true, value: formData.rollbackGraceTime || '', onChange: (e) => {
4858
+ React.createElement(Input, { title: 'Rollback Grace Time', tooltip: 'This is the amount of time that a pod should be in the `CrashLoopBackoff` state before it is rolled back. Pods that are in the `CrashLoopBackoff` state for longer than this time will be rolled back.', required: true, value: formData.rollbackGraceTime || '', onChange: (e) => {
4839
4859
  const { value } = e.target;
4840
4860
  handleFormChange('rollbackGraceTime', value || null);
4841
4861
  } }),
4842
- React.createElement(Input, { title: 'Rollback Stability Window', tooltip: 'Stability window for rollback', required: true, value: formData.rollbackStabilityWindow || '', onChange: (e) => {
4862
+ React.createElement(Input, { title: 'Rollback Stability Window', tooltip: 'This is the time-window in which the pod should be in the `CrashLoopBackoff` state before it is rolled back. Pods that are in the `CrashLoopBackoff` state after this window will not be rolled back.', required: true, value: formData.rollbackStabilityWindow || '', onChange: (e) => {
4843
4863
  const { value } = e.target;
4844
4864
  handleFormChange('rollbackStabilityWindow', value || null);
4845
4865
  } }))));
4846
4866
  });
4847
4867
  RollbackSettings.displayName = RollbackSettings.name;
4848
4868
 
4849
- const CollectorNodeSettings = forwardRef(({ formData, handleFormChange }, ref) => {
4850
- const [isAdvanced, setIsAdvanced] = useState(false);
4869
+ const CollectorNodeSettings = forwardRef(({ isAdvanced, formData, handleFormChange }, ref) => {
4851
4870
  return (React.createElement(Card, { ref: ref, id: SettingsTabs.CollectorNode },
4852
4871
  React.createElement(RowOfFields, null,
4853
- React.createElement(CardTitle, null, "Collector Node"),
4854
- React.createElement(Toggle, { title: 'Advanced Settings', tooltip: 'Show advanced settings. Note: these are not recommended to be changed unless you know what you are doing.', initialValue: isAdvanced, onChange: () => setIsAdvanced((prev) => !prev), flipHorizontally: true })),
4872
+ React.createElement(CardTitle, null, "Collector Node")),
4873
+ React.createElement(RowOfFields, null,
4874
+ React.createElement(Input, { title: 'Request Memory', tooltip: 'You can optionally specify how much memory the collector node should request (in megabytes).', type: 'number', required: true, value: formData.collectorNode?.requestMemoryMiB?.toString() || '', onChange: (e) => {
4875
+ const { value } = e.target;
4876
+ handleFormChange('collectorNode.requestMemoryMiB', value === '' ? null : Number(value));
4877
+ } }),
4878
+ React.createElement(Input, { title: 'Limit Memory', tooltip: 'You can optionally specify how much memory the collector node should limit (in megabytes).', type: 'number', required: true, value: formData.collectorNode?.limitMemoryMiB?.toString() || '', onChange: (e) => {
4879
+ const { value } = e.target;
4880
+ handleFormChange('collectorNode.limitMemoryMiB', value === '' ? null : Number(value));
4881
+ } })),
4882
+ React.createElement(RowOfFields, null,
4883
+ React.createElement(Input, { title: 'Request CPU', tooltip: 'You can optionally specify how much CPU the collector node should request (in millicores).', type: 'number', required: true, value: formData.collectorNode?.requestCPUm?.toString() || '', onChange: (e) => {
4884
+ const { value } = e.target;
4885
+ handleFormChange('collectorNode.requestCPUm', value === '' ? null : Number(value));
4886
+ } }),
4887
+ React.createElement(Input, { title: 'Limit CPU', tooltip: 'You can optionally specify how much CPU the collector node should limit (in millicores).', type: 'number', required: true, value: formData.collectorNode?.limitCPUm?.toString() || '', onChange: (e) => {
4888
+ const { value } = e.target;
4889
+ handleFormChange('collectorNode.limitCPUm', value === '' ? null : Number(value));
4890
+ } })),
4855
4891
  isAdvanced && (React.createElement(React.Fragment, null,
4856
- React.createElement(Input, { status: StatusType.Warning, title: 'K8s Node Logs Directory', tooltip: 'Target directory for K8s logs if `/var/log` is a symlink', required: true, value: formData.collectorNode?.k8sNodeLogsDirectory || '', onChange: (e) => {
4892
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) K8s Node Logs Directory', tooltip: 'If `/var/log` is a symlink, you can specify the target directory for Kubernetes logs here.', required: true, value: formData.collectorNode?.k8sNodeLogsDirectory || '', onChange: (e) => {
4857
4893
  const { value } = e.target;
4858
4894
  handleFormChange('collectorNode.k8sNodeLogsDirectory', value || null);
4859
4895
  } }),
4860
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Node Own Metrics Port', tooltip: "Port for the collector node's own Prometheus metrics", type: 'number', required: true, value: formData.collectorNode?.collectorOwnMetricsPort?.toString() || '', onChange: (e) => {
4896
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Own Metrics Port', tooltip: 'If the collector node is running with a host network, it may conflict with the port of other processes. This setting allows you to specify a different port for the own metrics.', type: 'number', required: true, value: formData.collectorNode?.collectorOwnMetricsPort?.toString() || '', onChange: (e) => {
4861
4897
  const { value } = e.target;
4862
4898
  handleFormChange('collectorNode.collectorOwnMetricsPort', value === '' ? null : Number(value));
4863
4899
  } }),
4864
4900
  React.createElement(RowOfFields, null,
4865
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Node Memory Limiter Limit (MB)', tooltip: 'Memory limiter limit for the collector node in Megabytes', type: 'number', required: true, value: formData.collectorNode?.memoryLimiterLimitMiB?.toString() || '', onChange: (e) => {
4901
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Memory Limiter Limit', tooltip: 'You can optionally specify how much memory the collector node should limit (in megabytes).', type: 'number', required: true, value: formData.collectorNode?.memoryLimiterLimitMiB?.toString() || '', onChange: (e) => {
4866
4902
  const { value } = e.target;
4867
4903
  handleFormChange('collectorNode.memoryLimiterLimitMiB', value === '' ? null : Number(value));
4868
4904
  } }),
4869
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Node Memory Limiter Spike Limit (MB)', tooltip: 'Memory limiter spike limit for the collector node in Megabytes', type: 'number', required: true, value: formData.collectorNode?.memoryLimiterSpikeLimitMiB?.toString() || '', onChange: (e) => {
4905
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Memory Limiter Spike Limit', tooltip: 'You can optionally specify how much memory the collector node should limit (in megabytes).', type: 'number', required: true, value: formData.collectorNode?.memoryLimiterSpikeLimitMiB?.toString() || '', onChange: (e) => {
4870
4906
  const { value } = e.target;
4871
4907
  handleFormChange('collectorNode.memoryLimiterSpikeLimitMiB', value === '' ? null : Number(value));
4872
4908
  } })),
4873
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Node Go Memory Limit (MB)', tooltip: 'Go memory limit for the collector node in Megabytes', type: 'number', required: true, value: formData.collectorNode?.goMemLimitMiB?.toString() || '', onChange: (e) => {
4909
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Go Memory Limit', tooltip: 'Sets the GOMEMLIMIT environment variable to control Go runtime memory usage. This soft memory limit helps the garbage collector prevent out-of-memory conditions in Kubernetes by triggering more aggressive garbage collection as memory usage approaches the limit (in megabytes).', type: 'number', required: true, value: formData.collectorNode?.goMemLimitMiB?.toString() || '', onChange: (e) => {
4874
4910
  const { value } = e.target;
4875
4911
  handleFormChange('collectorNode.goMemLimitMiB', value === '' ? null : Number(value));
4876
- } }))),
4877
- React.createElement(RowOfFields, null,
4878
- React.createElement(Input, { title: 'Request Memory (MB)', tooltip: 'Request memory for the collector node in Megabytes', type: 'number', required: true, value: formData.collectorNode?.requestMemoryMiB?.toString() || '', onChange: (e) => {
4879
- const { value } = e.target;
4880
- handleFormChange('collectorNode.requestMemoryMiB', value === '' ? null : Number(value));
4881
- } }),
4882
- React.createElement(Input, { title: 'Limit Memory (MB)', tooltip: 'Limit memory for the collector node in Megabytes', type: 'number', required: true, value: formData.collectorNode?.limitMemoryMiB?.toString() || '', onChange: (e) => {
4883
- const { value } = e.target;
4884
- handleFormChange('collectorNode.limitMemoryMiB', value === '' ? null : Number(value));
4885
- } })),
4886
- React.createElement(RowOfFields, null,
4887
- React.createElement(Input, { title: 'Request CPU (m)', tooltip: 'Request CPU for the collector node in Millicores', type: 'number', required: true, value: formData.collectorNode?.requestCPUm?.toString() || '', onChange: (e) => {
4888
- const { value } = e.target;
4889
- handleFormChange('collectorNode.requestCPUm', value === '' ? null : Number(value));
4890
- } }),
4891
- React.createElement(Input, { title: 'Limit CPU (m)', tooltip: 'Limit CPU for the collector node in Millicores', type: 'number', required: true, value: formData.collectorNode?.limitCPUm?.toString() || '', onChange: (e) => {
4892
- const { value } = e.target;
4893
- handleFormChange('collectorNode.limitCPUm', value === '' ? null : Number(value));
4894
- } }))));
4912
+ } })))));
4895
4913
  });
4896
4914
  CollectorNodeSettings.displayName = CollectorNodeSettings.name;
4897
4915
 
4898
- const CollectorGatewaySettings = forwardRef(({ formData, handleFormChange }, ref) => {
4899
- const [isAdvanced, setIsAdvanced] = useState(false);
4916
+ const CollectorGatewaySettings = forwardRef(({ isAdvanced, formData, handleFormChange }, ref) => {
4900
4917
  return (React.createElement(Card, { ref: ref, id: SettingsTabs.CollectorGateway },
4901
4918
  React.createElement(RowOfFields, null,
4902
- React.createElement(CardTitle, null, "Collector Gateway"),
4903
- React.createElement(Toggle, { title: 'Advanced Settings', tooltip: 'Show advanced settings. Note: these are not recommended to be changed unless you know what you are doing.', initialValue: isAdvanced, onChange: () => setIsAdvanced((prev) => !prev), flipHorizontally: true })),
4904
- isAdvanced && (React.createElement(React.Fragment, null,
4905
- React.createElement(RowOfFields, null,
4906
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Gateway Memory Limiter Limit (MB)', tooltip: 'Memory limiter limit for the collector gateway in Megabytes', type: 'number', required: true, value: formData.collectorGateway?.memoryLimiterLimitMiB?.toString() || '', onChange: (e) => {
4907
- const { value } = e.target;
4908
- handleFormChange('collectorGateway.memoryLimiterLimitMiB', value === '' ? null : Number(value));
4909
- } }),
4910
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Gateway Memory Limiter Spike Limit (MB)', tooltip: 'Memory limiter spike limit for the collector gateway in Megabytes', type: 'number', required: true, value: formData.collectorGateway?.memoryLimiterSpikeLimitMiB?.toString() || '', onChange: (e) => {
4911
- const { value } = e.target;
4912
- handleFormChange('collectorGateway.memoryLimiterSpikeLimitMiB', value === '' ? null : Number(value));
4913
- } })),
4914
- React.createElement(Input, { status: StatusType.Warning, title: 'Coll. Gateway Go Memory Limit (MB)', tooltip: 'Go memory limit for the collector gateway in Megabytes', type: 'number', required: true, value: formData.collectorGateway?.goMemLimitMiB?.toString() || '', onChange: (e) => {
4915
- const { value } = e.target;
4916
- handleFormChange('collectorGateway.goMemLimitMiB', value === '' ? null : Number(value));
4917
- } }))),
4919
+ React.createElement(CardTitle, null, "Collector Gateway")),
4918
4920
  React.createElement(RowOfFields, null,
4919
- React.createElement(Input, { title: 'Autoscaler Min. Replicas', tooltip: 'Minimum number of replicas for the collector gateway', type: 'number', required: true, value: formData.collectorGateway?.minReplicas?.toString() || '', onChange: (e) => {
4921
+ React.createElement(Input, { title: 'Autoscaler Min. Replicas', tooltip: 'You can optionally specify the minimum number of replicas for the collector gateway.', type: 'number', required: true, value: formData.collectorGateway?.minReplicas?.toString() || '', onChange: (e) => {
4920
4922
  const { value } = e.target;
4921
4923
  handleFormChange('collectorGateway.minReplicas', value === '' ? null : Number(value));
4922
4924
  } }),
4923
- React.createElement(Input, { title: 'Autoscaler Max. Replicas', tooltip: 'Maximum number of replicas for the collector gateway', type: 'number', required: true, value: formData.collectorGateway?.maxReplicas?.toString() || '', onChange: (e) => {
4925
+ React.createElement(Input, { title: 'Autoscaler Max. Replicas', tooltip: 'You can optionally specify the maximum number of replicas for the collector gateway.', type: 'number', required: true, value: formData.collectorGateway?.maxReplicas?.toString() || '', onChange: (e) => {
4924
4926
  const { value } = e.target;
4925
4927
  handleFormChange('collectorGateway.maxReplicas', value === '' ? null : Number(value));
4926
4928
  } })),
4927
4929
  React.createElement(RowOfFields, null,
4928
- React.createElement(Input, { title: 'Request Memory (MB)', tooltip: 'Request memory for the collector gateway in Megabytes', type: 'number', required: true, value: formData.collectorGateway?.requestMemoryMiB?.toString() || '', onChange: (e) => {
4930
+ React.createElement(Input, { title: 'Request Memory', tooltip: 'You can optionally specify how much memory the collector gateway should request (in megabytes).', type: 'number', required: true, value: formData.collectorGateway?.requestMemoryMiB?.toString() || '', onChange: (e) => {
4929
4931
  const { value } = e.target;
4930
4932
  handleFormChange('collectorGateway.requestMemoryMiB', value === '' ? null : Number(value));
4931
4933
  } }),
4932
- React.createElement(Input, { title: 'Limit Memory (MB)', tooltip: 'Limit memory for the collector gateway in Megabytes', type: 'number', required: true, value: formData.collectorGateway?.limitMemoryMiB?.toString() || '', onChange: (e) => {
4934
+ React.createElement(Input, { title: 'Limit Memory', tooltip: 'You can optionally specify how much memory the collector gateway should limit (in megabytes).', type: 'number', required: true, value: formData.collectorGateway?.limitMemoryMiB?.toString() || '', onChange: (e) => {
4933
4935
  const { value } = e.target;
4934
4936
  handleFormChange('collectorGateway.limitMemoryMiB', value === '' ? null : Number(value));
4935
4937
  } })),
4936
4938
  React.createElement(RowOfFields, null,
4937
- React.createElement(Input, { title: 'Request CPU (m)', tooltip: 'Request CPU for the collector gateway in Millicores', type: 'number', required: true, value: formData.collectorGateway?.requestCPUm?.toString() || '', onChange: (e) => {
4939
+ React.createElement(Input, { title: 'Request CPU', tooltip: 'You can optionally specify how much CPU the collector gateway should request (in millicores).', type: 'number', required: true, value: formData.collectorGateway?.requestCPUm?.toString() || '', onChange: (e) => {
4938
4940
  const { value } = e.target;
4939
4941
  handleFormChange('collectorGateway.requestCPUm', value === '' ? null : Number(value));
4940
4942
  } }),
4941
- React.createElement(Input, { title: 'Limit CPU (m)', tooltip: 'Limit CPU for the collector gateway in Millicores', type: 'number', required: true, value: formData.collectorGateway?.limitCPUm?.toString() || '', onChange: (e) => {
4943
+ React.createElement(Input, { title: 'Limit CPU', tooltip: 'You can optionally specify how much CPU the collector gateway should limit (in millicores).', type: 'number', required: true, value: formData.collectorGateway?.limitCPUm?.toString() || '', onChange: (e) => {
4942
4944
  const { value } = e.target;
4943
4945
  handleFormChange('collectorGateway.limitCPUm', value === '' ? null : Number(value));
4944
- } }))));
4946
+ } })),
4947
+ isAdvanced && (React.createElement(React.Fragment, null,
4948
+ React.createElement(RowOfFields, null,
4949
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Memory Limiter Limit', tooltip: 'You can optionally specify how much memory the collector gateway should limit (in megabytes).', type: 'number', required: true, value: formData.collectorGateway?.memoryLimiterLimitMiB?.toString() || '', onChange: (e) => {
4950
+ const { value } = e.target;
4951
+ handleFormChange('collectorGateway.memoryLimiterLimitMiB', value === '' ? null : Number(value));
4952
+ } }),
4953
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Memory Limiter Spike Limit', tooltip: 'You can optionally specify how much memory the collector gateway should limit (in megabytes).', type: 'number', required: true, value: formData.collectorGateway?.memoryLimiterSpikeLimitMiB?.toString() || '', onChange: (e) => {
4954
+ const { value } = e.target;
4955
+ handleFormChange('collectorGateway.memoryLimiterSpikeLimitMiB', value === '' ? null : Number(value));
4956
+ } })),
4957
+ React.createElement(Input, { status: StatusType.Warning, title: '(Advanced) Go Memory Limit', tooltip: 'Sets the GOMEMLIMIT environment variable to control Go runtime memory usage. This soft memory limit helps the garbage collector prevent out-of-memory conditions in Kubernetes by triggering more aggressive garbage collection as memory usage approaches the limit (in megabytes).', type: 'number', required: true, value: formData.collectorGateway?.goMemLimitMiB?.toString() || '', onChange: (e) => {
4958
+ const { value } = e.target;
4959
+ handleFormChange('collectorGateway.goMemLimitMiB', value === '' ? null : Number(value));
4960
+ } })))));
4945
4961
  });
4946
4962
  CollectorGatewaySettings.displayName = CollectorGatewaySettings.name;
4947
4963
 
@@ -4952,14 +4968,19 @@ const DataContainer = styled.div `
4952
4968
  max-height: 100vh;
4953
4969
  overflow-y: auto;
4954
4970
  `;
4971
+ const Relative = styled.div `
4972
+ position: relative;
4973
+ `;
4955
4974
  const DRAWER_WIDTH = '750px';
4956
4975
  const TITLE_TEXT = 'System Settings';
4957
4976
  const SystemSettings = ({ installationMethod, fetchSettings, onSave }) => {
4958
- const [isSaving, setIsSaving] = useState(false);
4959
4977
  const [settings, setSettings] = useState(undefined);
4960
- const { formData, handleFormChange, resetFormData, isFormDirty } = useGenericForm(settings);
4978
+ const [isSaving, setIsSaving] = useState(false);
4979
+ const [isAdvanced, setIsAdvanced] = useState(false);
4961
4980
  const [isOpen, setIsOpen] = useState(false);
4962
4981
  const toggleOpen = () => setIsOpen((prev) => !prev);
4982
+ const { popupRef, popupOpen, setPopupOpen } = usePopup();
4983
+ const { formData, handleFormChange, resetFormData, isFormDirty } = useGenericForm(settings);
4963
4984
  useEffect(() => {
4964
4985
  if (isOpen)
4965
4986
  fetchSettings().then(setSettings);
@@ -5013,22 +5034,21 @@ const SystemSettings = ({ installationMethod, fetchSettings, onSave }) => {
5013
5034
  behavior: 'smooth',
5014
5035
  });
5015
5036
  };
5016
- const onScroll = (e) => {
5017
- const scrollContainer = scrollContainerRef.current;
5018
- if (!scrollContainer)
5019
- return;
5020
- const scrollTop = e.currentTarget.scrollTop;
5021
- for (let i = 0; i < refsArray.length; i++) {
5022
- const curr = refsArray[i].current;
5023
- if (curr) {
5024
- const containerRect = scrollContainer.getBoundingClientRect();
5025
- const targetRect = curr.getBoundingClientRect();
5026
- const relativeTop = targetRect.top - containerRect.top + scrollContainer.scrollTop;
5027
- if (relativeTop <= scrollTop)
5028
- setSelectedTab(tabsArray[i]);
5029
- }
5030
- }
5031
- };
5037
+ // Note: this is commented out because the different sections are too small (they don't cover the entire drawer height), due to this the "selected tab" logic is not working as expected
5038
+ // const onScroll = (e: React.UIEvent<HTMLDivElement>) => {
5039
+ // const scrollContainer = scrollContainerRef.current;
5040
+ // if (!scrollContainer) return;
5041
+ // const scrollTop = e.currentTarget.scrollTop;
5042
+ // for (let i = 0; i < refsArray.length; i++) {
5043
+ // const curr = refsArray[i].current;
5044
+ // if (curr) {
5045
+ // const containerRect = scrollContainer.getBoundingClientRect();
5046
+ // const targetRect = curr.getBoundingClientRect();
5047
+ // const relativeTop = targetRect.top - containerRect.top + scrollContainer.scrollTop;
5048
+ // if (relativeTop <= scrollTop) setSelectedTab(tabsArray[i]);
5049
+ // }
5050
+ // }
5051
+ // };
5032
5052
  const handleTabChange = (tab) => {
5033
5053
  setSelectedTab(tab);
5034
5054
  scrollTo(tab);
@@ -5039,32 +5059,17 @@ const SystemSettings = ({ installationMethod, fetchSettings, onSave }) => {
5039
5059
  React.createElement(Drawer, { width: DRAWER_WIDTH, isOpen: isOpen, onClose: () => handleWithCancelWarning(toggleOpen), header: {
5040
5060
  icons: [GearIcon],
5041
5061
  title: TITLE_TEXT,
5042
- tabs: [
5043
- {
5044
- label: SettingsTabs.General,
5045
- onClick: () => handleTabChange(SettingsTabs.General),
5046
- selected: selectedTab === SettingsTabs.General,
5047
- },
5048
- {
5049
- label: SettingsTabs.Ui,
5050
- onClick: () => handleTabChange(SettingsTabs.Ui),
5051
- selected: selectedTab === SettingsTabs.Ui,
5052
- },
5053
- {
5054
- label: SettingsTabs.Rollback,
5055
- onClick: () => handleTabChange(SettingsTabs.Rollback),
5056
- selected: selectedTab === SettingsTabs.Rollback,
5057
- },
5058
- {
5059
- label: SettingsTabs.CollectorNode,
5060
- onClick: () => handleTabChange(SettingsTabs.CollectorNode),
5061
- selected: selectedTab === SettingsTabs.CollectorNode,
5062
- },
5063
- {
5064
- label: SettingsTabs.CollectorGateway,
5065
- onClick: () => handleTabChange(SettingsTabs.CollectorGateway),
5066
- selected: selectedTab === SettingsTabs.CollectorGateway,
5067
- },
5062
+ tabs: tabsArray.map((tab) => ({
5063
+ label: tab,
5064
+ onClick: () => handleTabChange(tab),
5065
+ selected: selectedTab === tab,
5066
+ })),
5067
+ actions: [
5068
+ React.createElement(Relative, { key: 'actions' },
5069
+ React.createElement(IconButton, { withBorder: true, onClick: () => setPopupOpen((prev) => !prev) },
5070
+ React.createElement(Text, { size: 10 }, "\u2022\u2022\u2022")),
5071
+ React.createElement(Popup, { ref: popupRef, isOpen: popupOpen, top: 36, right: 0, padding: '24px', width: '270px' },
5072
+ React.createElement(Toggle, { title: 'Enable Advanced Mode', tooltip: 'Show advanced settings. Note: these are not recommended to be changed unless you know what you are doing.', initialValue: isAdvanced, onChange: () => setIsAdvanced((prev) => !prev), flipHorizontally: true }))),
5068
5073
  ],
5069
5074
  }, footer: {
5070
5075
  isOpen: isFormDirty,
@@ -5082,13 +5087,13 @@ const SystemSettings = ({ installationMethod, fetchSettings, onSave }) => {
5082
5087
  children: BUTTON_TEXTS.SAVE,
5083
5088
  },
5084
5089
  ],
5085
- } }, formData?.imagePrefix !== undefined && !isSaving ? (React.createElement(DataContainer, { ref: scrollContainerRef, onScroll: onScroll },
5090
+ } }, formData?.imagePrefix !== undefined && !isSaving ? (React.createElement(DataContainer, { ref: scrollContainerRef },
5086
5091
  installationMethod === InstallationMethod.Helm && React.createElement(NotificationNote, { type: StatusType.Warning, title: 'Helm', message: "Changes won't persist unless you update the `values.yaml` file" }),
5087
- React.createElement(GeneralSettings, { ref: generalRef, formData: formData, handleFormChange: handleFormChange }),
5088
- React.createElement(UiSettings, { ref: uiRef, formData: formData, handleFormChange: handleFormChange }),
5089
- React.createElement(RollbackSettings, { ref: rollbackRef, formData: formData, handleFormChange: handleFormChange }),
5090
- React.createElement(CollectorNodeSettings, { ref: collectorNodeRef, formData: formData, handleFormChange: handleFormChange }),
5091
- React.createElement(CollectorGatewaySettings, { ref: collectorGatewayRef, formData: formData, handleFormChange: handleFormChange }))) : (React.createElement(CenterThis, null,
5092
+ React.createElement(GeneralSettings, { ref: generalRef, isAdvanced: isAdvanced, formData: formData, handleFormChange: handleFormChange }),
5093
+ React.createElement(UiSettings, { ref: uiRef, isAdvanced: isAdvanced, formData: formData, handleFormChange: handleFormChange }),
5094
+ React.createElement(RollbackSettings, { ref: rollbackRef, isAdvanced: isAdvanced, formData: formData, handleFormChange: handleFormChange }),
5095
+ React.createElement(CollectorNodeSettings, { ref: collectorNodeRef, isAdvanced: isAdvanced, formData: formData, handleFormChange: handleFormChange }),
5096
+ React.createElement(CollectorGatewaySettings, { ref: collectorGatewayRef, isAdvanced: isAdvanced, formData: formData, handleFormChange: handleFormChange }))) : (React.createElement(CenterThis, null,
5092
5097
  React.createElement(FadeLoader, { scale: 1.2 })))),
5093
5098
  React.createElement(CancelWarning, { isOpen: cancelWarningOpen, name: TITLE_TEXT, onApprove: () => {
5094
5099
  cancelApproveCallback?.();
@@ -1,2 +1,3 @@
1
1
  import { StatusType, type SVG } from '@/types';
2
- export declare const getStatusIcon: (type: StatusType, theme: Record<"text", Record<StatusType, string>>) => SVG;
2
+ import type { DefaultTheme } from 'styled-components';
3
+ export declare const getStatusIcon: (type: StatusType, theme: DefaultTheme) => SVG;
package/lib/functions.js CHANGED
@@ -1,13 +1,13 @@
1
- export { c as capitalizeFirstLetter, f as flattenObjectKeys, g as getConditionsBooleans, a as getMonitorIcon, b as getStatusIcon, i as isStringABoolean, d as isValidVersion, m as mapConditions, n as numbersOnly, p as parseBooleanFromString, e as parseJsonStringToPrettyString, r as removeEmptyValuesFromObject, s as safeJsonStringify, h as splitCamelString } from './index-58440c5c.js';
2
- export { c as compareCondition, f as filterActions, a as filterDestinations, b as filterDestinationsByStream, d as filterSources, e as filterSourcesByStream, g as formatBytes, i as getContainersIcons, h as getContainersInstrumentedCount, j as getDestinationIcon, k as getEntityIcon, l as getEntityLabel, m as getMetricForEntity, n as getPlatformIcon, o as getPlatformLabel, p as getValueForRange, q as getWorkloadId, r as getYamlFieldsForDestination, s as hasUnhealthyInstances, t as isOverTime, u as mapDestinationFieldsForDisplay, v as sleep } from './index-42f40e7c.js';
1
+ export { c as capitalizeFirstLetter, f as flattenObjectKeys, g as getConditionsBooleans, a as getMonitorIcon, b as getStatusIcon, i as isStringABoolean, d as isValidVersion, m as mapConditions, n as numbersOnly, p as parseBooleanFromString, e as parseJsonStringToPrettyString, r as removeEmptyValuesFromObject, s as safeJsonStringify, h as splitCamelString } from './index-281d9862.js';
2
+ export { c as compareCondition, f as filterActions, a as filterDestinations, b as filterDestinationsByStream, d as filterSources, e as filterSourcesByStream, g as formatBytes, i as getContainersIcons, h as getContainersInstrumentedCount, j as getDestinationIcon, k as getEntityIcon, l as getEntityLabel, m as getMetricForEntity, n as getPlatformIcon, o as getPlatformLabel, p as getValueForRange, q as getWorkloadId, r as getYamlFieldsForDestination, s as hasUnhealthyInstances, t as isOverTime, u as mapDestinationFieldsForDisplay, v as sleep } from './index-ed649685.js';
3
3
  export { d as deepClone, i as isEmpty, s as safeJsonParse } from './index-5e5f7bda.js';
4
- export { g as getActionIcon, c as getEntityId, d as getInstrumentationRuleIcon, e as getProgrammingLanguageIcon } from './index-bd48e6e2.js';
4
+ export { g as getActionIcon, c as getEntityId, d as getInstrumentationRuleIcon, e as getProgrammingLanguageIcon } from './index-8fc2f11e.js';
5
5
  export { g as getIdFromSseTarget, i as isLegalK8sLabel, m as mapExportedSignals } from './index-6a6bea6e.js';
6
6
  import { ProgrammingLanguages, EntityTypes } from './types.js';
7
7
  import 'react';
8
8
  import 'styled-components';
9
- import './index-50101bec.js';
10
- import './index-acc7c7dd.js';
9
+ import './index-89b23a82.js';
10
+ import './index-5102bee6.js';
11
11
 
12
12
  const cleanObjectEmptyStringsValues = (obj) => {
13
13
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
package/lib/hooks.js CHANGED
@@ -1,10 +1,10 @@
1
1
  import { ActionKeyTypes, ActionType, StatusType, EntityTypes, FieldTypes } from './types.js';
2
- import { V as useNotificationStore, F as FORM_ALERTS, O as useDrawerStore, W as useEntityStore, Y as useDataStreamStore, _ as useSetupStore } from './index-bd48e6e2.js';
2
+ import { V as useNotificationStore, F as FORM_ALERTS, O as useDrawerStore, W as useEntityStore, Y as useDataStreamStore, _ as useSetupStore } from './index-8fc2f11e.js';
3
3
  import { useState, useEffect, useMemo } from 'react';
4
4
  import 'styled-components';
5
5
  import { i as isEmpty, s as safeJsonParse } from './index-5e5f7bda.js';
6
- import { i as useGenericForm } from './useTransition-c2aef0e4.js';
7
- export { c as useClickNode, b as useContainerSize, h as useCopy, e as useInstrumentationRuleFormData, u as useKeyDown, a as useOnClickOutside, d as usePopup, g as useTimeAgo, f as useTransition } from './useTransition-c2aef0e4.js';
6
+ import { i as useGenericForm } from './useTransition-26bd4722.js';
7
+ export { c as useClickNode, b as useContainerSize, h as useCopy, e as useInstrumentationRuleFormData, u as useKeyDown, a as useOnClickOutside, d as usePopup, g as useTimeAgo, f as useTransition } from './useTransition-26bd4722.js';
8
8
  import { g as getIdFromSseTarget, i as isLegalK8sLabel, m as mapExportedSignals } from './index-6a6bea6e.js';
9
9
 
10
10
  const INITIAL$2 = {
package/lib/icons.js CHANGED
@@ -1,10 +1,10 @@
1
- import { T as Theme } from './index-bd48e6e2.js';
2
- export { f as AddClusterInfoIcon, n as CPlusPlusLogo, o as CSharpLogo, C as CodeAttributesIcon, l as CustomInstrumentationIcon, h as DeleteAttributeIcon, p as DotnetLogo, E as ElixirLogo, G as GoLogo, H as HeadersCollectionIcon, j as ImageErrorIcon, J as JavaLogo, K as K8sLogo, k as KafkaLogo, q as MysqlLogo, N as NginxLogo, r as NodejsLogo, m as PayloadCollectionIcon, s as PhpLogo, P as PiiMaskingIcon, t as PostgresLogo, u as PythonLogo, v as RedisLogo, R as RenameAttributeIcon, w as RubyLogo, x as RustLogo, i as SamplerIcon, y as SwiftLogo } from './index-bd48e6e2.js';
3
- export { C as CheckCircledIcon, E as ErrorTriangleIcon, I as InfoIcon, L as LogsIcon, M as MetricsIcon, O as OdigosLogo, T as TracesIcon, W as WarningTriangleIcon } from './index-50101bec.js';
4
- export { A as ArrowIcon, C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, G as GearIcon, K as KeyIcon, N as NotificationIcon, O as OdigosLogoText, a as OverviewIcon, R as RefreshLeftArrowIcon, S as SlackLogo, T as TerminalIcon, U as UserIcon } from './index-c1df4281.js';
1
+ import { T as Theme } from './index-8fc2f11e.js';
2
+ export { f as AddClusterInfoIcon, n as CPlusPlusLogo, o as CSharpLogo, C as CodeAttributesIcon, l as CustomInstrumentationIcon, h as DeleteAttributeIcon, p as DotnetLogo, E as ElixirLogo, G as GoLogo, H as HeadersCollectionIcon, j as ImageErrorIcon, J as JavaLogo, K as K8sLogo, k as KafkaLogo, q as MysqlLogo, N as NginxLogo, r as NodejsLogo, m as PayloadCollectionIcon, s as PhpLogo, P as PiiMaskingIcon, t as PostgresLogo, u as PythonLogo, v as RedisLogo, R as RenameAttributeIcon, w as RubyLogo, x as RustLogo, i as SamplerIcon, y as SwiftLogo } from './index-8fc2f11e.js';
3
+ export { C as CheckCircledIcon, E as ErrorTriangleIcon, I as InfoIcon, L as LogsIcon, M as MetricsIcon, O as OdigosLogo, T as TracesIcon, W as WarningTriangleIcon } from './index-89b23a82.js';
4
+ export { A as ArrowIcon, C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, G as GearIcon, K as KeyIcon, N as NotificationIcon, O as OdigosLogoText, a as OverviewIcon, R as RefreshLeftArrowIcon, S as SlackLogo, T as TerminalIcon, U as UserIcon } from './index-35e207a1.js';
5
5
  import React from 'react';
6
- export { h as CheckIcon, C as CodeIcon, a as CopyIcon, i as CrossIcon, E as EditIcon, b as EditedIcon, c as ExtendArrowIcon, f as EyeClosedIcon, g as EyeOpenIcon, L as ListIcon, M as MinusIcon, N as NoDataIcon, d as NotebookIcon, P as PlusIcon, S as SearchIcon, e as SortArrowsIcon, T as TrashIcon, X as XIcon } from './index-391844c6.js';
7
- export { a3 as ActionsIcon, A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, c as AwsCloudwatchLogo, d as AwsS3Logo, e as AwsXrayLogo, f as AxiomLogo, B as BetterStackLogo, g as BlobStorageLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, a4 as DestinationsIcon, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, G as GigapipeLogo, p as GoogleCloudPlatformLogo, q as GrafanaLogo, r as GreptimeLogo, s as GroundcoverLogo, H as HoneycombLogo, t as HyperDxLogo, I as InstanaLogo, J as JaegerLogo, K as KloudmateLogo, L as Last9Logo, u as LightstepLogo, v as LogzioLogo, w as LokiLogo, x as LumigoLogo, M as MiddlewareLogo, a5 as NamespacesIcon, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, F as OpenTelemetryLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, T as QuickwitLogo, a6 as RulesIcon, U as SeqLogo, W as SignozLogo, a7 as SourcesIcon, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, V as VmLogo } from './index-acc7c7dd.js';
6
+ export { h as CheckIcon, C as CodeIcon, a as CopyIcon, i as CrossIcon, E as EditIcon, b as EditedIcon, c as ExtendArrowIcon, f as EyeClosedIcon, g as EyeOpenIcon, L as ListIcon, M as MinusIcon, N as NoDataIcon, d as NotebookIcon, P as PlusIcon, S as SearchIcon, e as SortArrowsIcon, T as TrashIcon, X as XIcon } from './index-fed7fc91.js';
7
+ export { a3 as ActionsIcon, A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, c as AwsCloudwatchLogo, d as AwsS3Logo, e as AwsXrayLogo, f as AxiomLogo, B as BetterStackLogo, g as BlobStorageLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, a4 as DestinationsIcon, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, G as GigapipeLogo, p as GoogleCloudPlatformLogo, q as GrafanaLogo, r as GreptimeLogo, s as GroundcoverLogo, H as HoneycombLogo, t as HyperDxLogo, I as InstanaLogo, J as JaegerLogo, K as KloudmateLogo, L as Last9Logo, u as LightstepLogo, v as LogzioLogo, w as LokiLogo, x as LumigoLogo, M as MiddlewareLogo, a5 as NamespacesIcon, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, F as OpenTelemetryLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, T as QuickwitLogo, a6 as RulesIcon, U as SeqLogo, W as SignozLogo, a7 as SourcesIcon, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, V as VmLogo } from './index-5102bee6.js';
8
8
  import './types.js';
9
9
  import 'styled-components';
10
10
 
@@ -1,8 +1,8 @@
1
1
  import { StatusType, OtherStatus, SignalType } from './types.js';
2
2
  import 'react';
3
- import './index-bd48e6e2.js';
3
+ import './index-8fc2f11e.js';
4
4
  import 'styled-components';
5
- import { L as LogsIcon, M as MetricsIcon, T as TracesIcon, C as CheckCircledIcon, E as ErrorTriangleIcon, W as WarningTriangleIcon, I as InfoIcon, O as OdigosLogo } from './index-50101bec.js';
5
+ import { L as LogsIcon, M as MetricsIcon, T as TracesIcon, C as CheckCircledIcon, E as ErrorTriangleIcon, W as WarningTriangleIcon, I as InfoIcon, O as OdigosLogo } from './index-89b23a82.js';
6
6
 
7
7
  const capitalizeFirstLetter = (string) => {
8
8
  return string.charAt(0).toUpperCase() + string.slice(1);
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-bd48e6e2.js';
2
+ import { T as Theme } from './index-8fc2f11e.js';
3
3
 
4
4
  const OdigosLogoText = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-bd48e6e2.js';
2
+ import { T as Theme } from './index-8fc2f11e.js';
3
3
 
4
4
  const VmLogo = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }) => {
5
5
  const theme = Theme.useTheme();
@@ -1,13 +1,13 @@
1
- import React, { useState, useEffect, useRef, forwardRef, useMemo, createElement, useCallback, Fragment, createContext, memo, useContext, useLayoutEffect } from 'react';
2
- import { T as Theme, B as BUTTON_TEXTS, j as ImageErrorIcon, M as MONITORS_OPTIONS, a1 as styleInject, U as usePendingStore, $ as useSelectedStore, Z as useInstrumentStore, Q as useActiveNodeStore, V as useNotificationStore, b as DISPLAY_TITLES, L as LANGUAGE_OPTIONS, F as FORM_ALERTS, D as DISPLAY_LANGUAGES, e as getProgrammingLanguageIcon } from './index-bd48e6e2.js';
1
+ import React, { useState, useEffect, useRef, forwardRef, useMemo, Fragment, createElement, useCallback, createContext, memo, useContext, useLayoutEffect } from 'react';
2
+ import { T as Theme, B as BUTTON_TEXTS, j as ImageErrorIcon, M as MONITORS_OPTIONS, a1 as styleInject, U as usePendingStore, $ as useSelectedStore, Z as useInstrumentStore, Q as useActiveNodeStore, V as useNotificationStore, b as DISPLAY_TITLES, L as LANGUAGE_OPTIONS, F as FORM_ALERTS, D as DISPLAY_LANGUAGES, e as getProgrammingLanguageIcon } from './index-8fc2f11e.js';
3
3
  import styled, { css } from 'styled-components';
4
- import { M as MinusIcon$1, h as CheckIcon, L as ListIcon, C as CodeIcon, c as ExtendArrowIcon, P as PlusIcon$1, a as CopyIcon, E as EditIcon, b as EditedIcon, e as SortArrowsIcon, d as NotebookIcon, X as XIcon, f as EyeClosedIcon, g as EyeOpenIcon, N as NoDataIcon, i as CrossIcon, S as SearchIcon, T as TrashIcon } from './index-391844c6.js';
4
+ import { M as MinusIcon$1, h as CheckIcon, L as ListIcon, C as CodeIcon, c as ExtendArrowIcon, P as PlusIcon$1, a as CopyIcon, E as EditIcon, b as EditedIcon, e as SortArrowsIcon, d as NotebookIcon, X as XIcon, f as EyeClosedIcon, g as EyeOpenIcon, N as NoDataIcon, i as CrossIcon, S as SearchIcon, T as TrashIcon } from './index-fed7fc91.js';
5
5
  import { StatusType, OtherStatus, EntityTypes, NodeTypes, AddNodeTypes, EdgeTypes, ProgrammingLanguages, IntrumentationStatus, SortDirection, InputTypes, FieldTypes } from './types.js';
6
6
  import { s as safeJsonParse, i as isEmpty } from './index-5e5f7bda.js';
7
- import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, g as getConditionsBooleans, c as capitalizeFirstLetter, a as getMonitorIcon, i as isStringABoolean, p as parseBooleanFromString, d as isValidVersion, h as splitCamelString, e as parseJsonStringToPrettyString, n as numbersOnly } from './index-58440c5c.js';
7
+ import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, g as getConditionsBooleans, c as capitalizeFirstLetter, a as getMonitorIcon, i as isStringABoolean, p as parseBooleanFromString, d as isValidVersion, h as splitCamelString, e as parseJsonStringToPrettyString, n as numbersOnly } from './index-281d9862.js';
8
8
  import ReactDOM, { createPortal } from 'react-dom';
9
- import { d as usePopup, h as useCopy, c as useClickNode, i as useGenericForm, b as useContainerSize, f as useTransition, u as useKeyDown, a as useOnClickOutside } from './useTransition-c2aef0e4.js';
10
- import { I as InfoIcon } from './index-50101bec.js';
9
+ import { d as usePopup, h as useCopy, c as useClickNode, i as useGenericForm, b as useContainerSize, f as useTransition, u as useKeyDown, a as useOnClickOutside } from './useTransition-26bd4722.js';
10
+ import { I as InfoIcon } from './index-89b23a82.js';
11
11
 
12
12
  const TextWrapper$2 = styled.div `
13
13
  color: ${({ $color, theme }) => $color || theme.text.secondary};
@@ -362,7 +362,7 @@ const Container$G = styled.div `
362
362
  max-width: ${({ $maxWidth }) => ($maxWidth !== undefined ? $maxWidth : 'unset')};
363
363
  width: ${({ $width }) => ($width !== undefined ? $width : 'unset')};
364
364
 
365
- ${({ $asPortal }) => $asPortal && `pointer-events: none;`}
365
+ ${({ $asPortal, $withPointerEvents }) => $asPortal && !$withPointerEvents && `pointer-events: none;`}
366
366
  `;
367
367
  const Header$3 = styled.div `
368
368
  padding: ${({ $padding }) => ($padding !== undefined ? $padding : '12px')};
@@ -377,8 +377,8 @@ const Footer$1 = styled.div `
377
377
  `;
378
378
  const Popup = forwardRef(({ isOpen, asPortal, ...props }, ref) => {
379
379
  const Element = useMemo(() => {
380
- const { children, top, bottom, left, right, borderRadius, padding, maxWidth, width, header, footer } = props;
381
- return (React.createElement(Container$G, { ref: ref, "$top": top, "$bottom": bottom, "$left": left, "$right": right, "$borderRadius": borderRadius, "$padding": padding, "$maxWidth": maxWidth, "$width": width, "$asPortal": asPortal },
380
+ const { children, top, bottom, left, right, borderRadius, padding, maxWidth, width, header, footer, withPointerEvents, ...rest } = props;
381
+ return (React.createElement(Container$G, { ref: ref, "$top": top, "$bottom": bottom, "$left": left, "$right": right, "$borderRadius": borderRadius, "$padding": padding, "$maxWidth": maxWidth, "$width": width, "$asPortal": asPortal, "$withPointerEvents": withPointerEvents, ...rest },
382
382
  header && React.createElement(Header$3, { "$padding": padding }, header),
383
383
  React.createElement(Body$1, { "$padding": padding }, children),
384
384
  footer && React.createElement(Footer$1, { "$padding": padding }, footer)));
@@ -463,15 +463,50 @@ const TextBreakWord = styled(Text) `
463
463
  word-break: break-word;
464
464
  white-space: pre-wrap;
465
465
  `;
466
+ const getLinksFromText = (text) => {
467
+ const links = text.match(/<a[^>]*href="([^"]*)"[^>]*>(.*?)<\/a>/g);
468
+ return links?.map((link) => {
469
+ const [_, href, label] = link.split('"');
470
+ const labelWithoutTags = label.replace('</a>', '').replace('>', '');
471
+ return {
472
+ original: link,
473
+ href,
474
+ label: labelWithoutTags,
475
+ };
476
+ });
477
+ };
478
+ const renderText = (text, theme) => {
479
+ const links = getLinksFromText(text);
480
+ links?.forEach((link, i) => {
481
+ text = text.replace(link.original, `LINK-${i}###`);
482
+ });
483
+ const mappedText = text.split(' ').map((word) => {
484
+ if (word.includes('LINK-')) {
485
+ const [linkId, postLabel] = word.split('###');
486
+ const entry = links?.[parseInt(linkId.replace('LINK-', ''))];
487
+ return (React.createElement(Fragment, { key: word },
488
+ React.createElement("a", { href: entry?.href, target: '_blank', style: { color: theme.colors.majestic_blue_soft } }, entry?.label),
489
+ postLabel ? `${postLabel} ` : ''));
490
+ }
491
+ return word + ' ';
492
+ });
493
+ return { mappedText, hasLinks: !!links?.length };
494
+ };
466
495
  const Tooltip = ({ withIcon, titleIcon: TitleIcon, title, text, timestamp, children }) => {
467
496
  const theme = Theme.useTheme();
468
497
  const { popupRef, popupOpen, setPopupOpen, popupPosition, handlePosition } = usePopup({
469
498
  defaultClientHeight: 40,
470
499
  defaultClientwidth: Math.min((text?.length || 0) * 7.5, 300),
471
500
  });
501
+ const { mappedText, hasLinks } = useMemo(() => renderText(text || '', theme), [text, theme]);
472
502
  const handleMouseEvent = (e) => {
473
503
  const { type, clientX, clientY } = e;
474
- handlePosition(clientX, clientY);
504
+ if (hasLinks) {
505
+ handlePosition(popupPosition.left || clientX, popupPosition.top || clientY);
506
+ }
507
+ else {
508
+ handlePosition(clientX, clientY);
509
+ }
475
510
  setPopupOpen(type !== 'mouseleave');
476
511
  };
477
512
  if (!text)
@@ -479,14 +514,14 @@ const Tooltip = ({ withIcon, titleIcon: TitleIcon, title, text, timestamp, child
479
514
  return (React.createElement(TooltipContainer, { onMouseEnter: handleMouseEvent, onMouseMove: handleMouseEvent, onMouseLeave: handleMouseEvent },
480
515
  children,
481
516
  withIcon && React.createElement(InfoIcon, null),
482
- React.createElement(Popup, { ref: popupRef, isOpen: popupOpen, top: popupPosition.top, left: popupPosition.left, asPortal: true, maxWidth: '270px', borderRadius: '16px', padding: '8px 12px' },
517
+ React.createElement(Popup, { ref: popupRef, isOpen: popupOpen, top: popupPosition.top, left: popupPosition.left, asPortal: true, withPointerEvents: hasLinks, onMouseEnter: hasLinks ? handleMouseEvent : undefined, maxWidth: '270px', borderRadius: '16px', padding: '8px 12px' },
483
518
  React.createElement(Text, { size: 12, color: theme.text.secondary },
484
519
  (!!TitleIcon || !!title) && (React.createElement(FlexRow, { style: { marginBottom: '4px' }, "$gap": 4 },
485
520
  TitleIcon && React.createElement(TitleIcon, { fill: theme.text.secondary, size: 12 }),
486
521
  title && React.createElement(React.Fragment, null,
487
522
  title,
488
523
  "\u00A0-\u00A0"))),
489
- React.createElement(TextBreakWord, { size: 12, color: theme.text.info }, text),
524
+ React.createElement(TextBreakWord, { size: 12, color: theme.text.info }, mappedText),
490
525
  !!timestamp && (React.createElement(Text, { size: 10, color: theme.text.darker_grey, family: 'secondary', style: { marginTop: '8px' } }, new Date(timestamp).toLocaleString()))))));
491
526
  };
492
527
 
@@ -4844,13 +4879,13 @@ function requireReactJsxRuntime_development () {
4844
4879
  return null;
4845
4880
  };
4846
4881
  React$1 = {
4847
- "react-stack-bottom-frame": function (callStackForError) {
4882
+ react_stack_bottom_frame: function (callStackForError) {
4848
4883
  return callStackForError();
4849
4884
  }
4850
4885
  };
4851
4886
  var specialPropKeyWarningShown;
4852
4887
  var didWarnAboutElementRef = {};
4853
- var unknownOwnerDebugStack = React$1["react-stack-bottom-frame"].bind(
4888
+ var unknownOwnerDebugStack = React$1.react_stack_bottom_frame.bind(
4854
4889
  React$1,
4855
4890
  UnknownOwner
4856
4891
  )();
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-bd48e6e2.js';
2
+ import { T as Theme } from './index-8fc2f11e.js';
3
3
 
4
4
  const OdigosLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -29,8 +29,8 @@ const identity = (arg) => arg;
29
29
  function useStore(api, selector = identity) {
30
30
  const slice = React.useSyncExternalStore(
31
31
  api.subscribe,
32
- () => selector(api.getState()),
33
- () => selector(api.getInitialState())
32
+ React.useCallback(() => selector(api.getState()), [api, selector]),
33
+ React.useCallback(() => selector(api.getInitialState()), [api, selector])
34
34
  );
35
35
  React.useDebugValue(slice);
36
36
  return slice;
@@ -1709,7 +1709,7 @@ function styleInject(css, ref) {
1709
1709
  }
1710
1710
  }
1711
1711
 
1712
- var css_248z = "/* Preload key fonts in your global CSS */\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');\n@import url('https://fonts.googleapis.com/css2?family=Kode+Mono:wght@100;200;300;400;500;600;700&display=swap');\n@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;700&display=swap');\n@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');\n\n* {\n -ms-overflow-style: none; /* IE, Edge */\n scrollbar-width: none; /* Firefox */\n}\n*::-webkit-scrollbar {\n display: none; /* Chrome, Safari, Opera */\n}\n\nsvg {\n transition: all 0.3s;\n}\n\n/*\n The input styles below are to override the browser \":-webkit-autofill\" default style declarations.\n The issue is when someone autocompletes an input field, the browser will apply its own styles (and the browser applies \"!important\" preventing direct overrides).\n With the following, we're able to delay the browser styles to be applied for 50000s (13.8 hours), so the user will not see the browser styles applied.\n*/\n\ninput {\n all: unset;\n}\n\ninput:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ninput:-webkit-autofill:active {\n -webkit-transition: all 50000s ease-in-out 0s;\n transition: all 50000s ease-in-out 0s;\n}\n";
1712
+ var css_248z = "/* Preload key fonts in your global CSS */\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');\n@import url('https://fonts.googleapis.com/css2?family=Kode+Mono:wght@100;200;300;400;500;600;700&display=swap');\n@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;700&display=swap');\n@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');\n\n* {\n -ms-overflow-style: none; /* IE, Edge */\n scrollbar-width: none; /* Firefox */\n}\n*::-webkit-scrollbar {\n display: none; /* Chrome, Safari, Opera */\n}\n\nsvg {\n transition: all 0.3s;\n}\n\n/*\n The input styles below are to override the browser \":-webkit-autofill\" default style declarations.\n The issue is when someone autocompletes an input field, the browser will apply its own styles (and the browser applies \"!important\" preventing direct overrides).\n With the following, we're able to delay the browser styles to be applied for 50000s (13.8 hours), so the user will not see the browser styles applied.\n*/\n\ninput {\n all: unset;\n}\n\ninput:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ninput:-webkit-autofill:active {\n -webkit-transition: all 50000s ease-in-out 0s;\n transition: all 50000s ease-in-out 0s;\n}\n";
1713
1713
  styleInject(css_248z);
1714
1714
 
1715
1715
  const Provider = ({ children }) => {
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
- import { a3 as WarningModal } from './index-5772129e.js';
2
+ import { a3 as WarningModal } from './index-728cf83d.js';
3
3
  import { StatusType, EntityTypes } from './types.js';
4
- import './index-bd48e6e2.js';
4
+ import './index-8fc2f11e.js';
5
5
  import 'styled-components';
6
6
 
7
7
  const CancelWarning = ({ isOpen, noOverlay, name, onApprove, onDeny }) => {
@@ -1,9 +1,9 @@
1
1
  import { StatusType, DestinationTypes, EntityTypes, PlatformType } from './types.js';
2
- import { a as DEFAULT_DATA_STREAM_NAME, e as getProgrammingLanguageIcon, k as KafkaLogo, K as K8sLogo } from './index-bd48e6e2.js';
2
+ import { a as DEFAULT_DATA_STREAM_NAME, e as getProgrammingLanguageIcon, k as KafkaLogo, K as K8sLogo } from './index-8fc2f11e.js';
3
3
  import 'react';
4
4
  import 'styled-components';
5
- import { A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, f as AxiomLogo, g as BlobStorageLogo, B as BetterStackLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, c as AwsCloudwatchLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, F as OpenTelemetryLogo, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, p as GoogleCloudPlatformLogo, q as GrafanaLogo, r as GreptimeLogo, s as GroundcoverLogo, H as HoneycombLogo, t as HyperDxLogo, I as InstanaLogo, J as JaegerLogo, K as KloudmateLogo, L as Last9Logo, u as LightstepLogo, v as LogzioLogo, w as LokiLogo, x as LumigoLogo, M as MiddlewareLogo, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, G as GigapipeLogo, T as QuickwitLogo, d as AwsS3Logo, U as SeqLogo, W as SignozLogo, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, e as AwsXrayLogo, a5 as NamespacesIcon, a7 as SourcesIcon, a4 as DestinationsIcon, a3 as ActionsIcon, a6 as RulesIcon, V as VmLogo } from './index-acc7c7dd.js';
6
- import { O as OdigosLogo } from './index-50101bec.js';
5
+ import { A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, f as AxiomLogo, g as BlobStorageLogo, B as BetterStackLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, c as AwsCloudwatchLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, F as OpenTelemetryLogo, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, p as GoogleCloudPlatformLogo, q as GrafanaLogo, r as GreptimeLogo, s as GroundcoverLogo, H as HoneycombLogo, t as HyperDxLogo, I as InstanaLogo, J as JaegerLogo, K as KloudmateLogo, L as Last9Logo, u as LightstepLogo, v as LogzioLogo, w as LokiLogo, x as LumigoLogo, M as MiddlewareLogo, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, G as GigapipeLogo, T as QuickwitLogo, d as AwsS3Logo, U as SeqLogo, W as SignozLogo, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, e as AwsXrayLogo, a5 as NamespacesIcon, a7 as SourcesIcon, a4 as DestinationsIcon, a3 as ActionsIcon, a6 as RulesIcon, V as VmLogo } from './index-5102bee6.js';
6
+ import { O as OdigosLogo } from './index-89b23a82.js';
7
7
  import { s as safeJsonParse } from './index-5e5f7bda.js';
8
8
 
9
9
  const compareCondition = (renderCondition, fields) => {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-bd48e6e2.js';
2
+ import { T as Theme } from './index-8fc2f11e.js';
3
3
 
4
4
  const CodeIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }) => {
5
5
  const theme = Theme.useTheme();
package/lib/snippets.js CHANGED
@@ -1,15 +1,15 @@
1
- import { B as Button, _ as Text, L as NotificationNote } from './index-5772129e.js';
2
- export { ai as AddButton, an as AddNode, ao as BaseNode, ak as CopyText, ap as EdgedNode, ag as Flow, aq as FrameNode, ar as HeaderNode, aw as LabeledEdge, as as MapItemNode, at as NoDataNode, al as PodContainer, au as ScrollNode, av as SkeletonNode, am as SourceContainer, ad as nodeConfig } from './index-5772129e.js';
1
+ import { B as Button, _ as Text, L as NotificationNote } from './index-728cf83d.js';
2
+ export { ai as AddButton, an as AddNode, ao as BaseNode, ak as CopyText, ap as EdgedNode, ag as Flow, aq as FrameNode, ar as HeaderNode, aw as LabeledEdge, as as MapItemNode, at as NoDataNode, al as PodContainer, au as ScrollNode, av as SkeletonNode, am as SourceContainer, ad as nodeConfig } from './index-728cf83d.js';
3
3
  import React from 'react';
4
- import { T as Theme, B as BUTTON_TEXTS, b as DISPLAY_TITLES } from './index-bd48e6e2.js';
5
- import { E as EditIcon } from './index-391844c6.js';
4
+ import { T as Theme, B as BUTTON_TEXTS, b as DISPLAY_TITLES } from './index-8fc2f11e.js';
5
+ import { E as EditIcon } from './index-fed7fc91.js';
6
6
  import { StatusType } from './types.js';
7
7
  import 'styled-components';
8
- import { I as InfoIcon } from './index-50101bec.js';
8
+ import { I as InfoIcon } from './index-89b23a82.js';
9
9
  import './index-5e5f7bda.js';
10
- import './index-58440c5c.js';
10
+ import './index-281d9862.js';
11
11
  import 'react-dom';
12
- import './useTransition-c2aef0e4.js';
12
+ import './useTransition-26bd4722.js';
13
13
 
14
14
  const EditButton = ({ label, onClick, variant = 'tertiary', ...props }) => {
15
15
  const theme = Theme.useTheme();
package/lib/store.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Q as useActiveNodeStore, a0 as useDarkMode, Y as useDataStreamStore, O as useDrawerStore, W as useEntityStore, X as useFilterStore, Z as useInstrumentStore, z as useModalStore, V as useNotificationStore, U as usePendingStore, $ as useSelectedStore, _ as useSetupStore } from './index-bd48e6e2.js';
1
+ export { Q as useActiveNodeStore, a0 as useDarkMode, Y as useDataStreamStore, O as useDrawerStore, W as useEntityStore, X as useFilterStore, Z as useInstrumentStore, z as useModalStore, V as useNotificationStore, U as usePendingStore, $ as useSelectedStore, _ as useSetupStore } from './index-8fc2f11e.js';
2
2
  import 'react';
3
3
  import './types.js';
4
4
  import 'styled-components';
package/lib/theme.js CHANGED
@@ -1,4 +1,4 @@
1
- export { T as default } from './index-bd48e6e2.js';
1
+ export { T as default } from './index-8fc2f11e.js';
2
2
  import 'styled-components';
3
3
  import 'react';
4
4
  import './types.js';
@@ -1,4 +1,16 @@
1
1
  import { ProgrammingLanguages } from '..';
2
+ export declare enum Profile {
3
+ CodeAttributes = "code-attributes",
4
+ FullPayloadCollection = "full-payload-collection",
5
+ DbPayloadCollection = "db-payload-collection",
6
+ QueryOperationDetector = "query-operation-detector",
7
+ AllowConcurrentAgents = "allow_concurrent_agents",
8
+ JavaEbpfInstrumentations = "java-ebpf-instrumentations",
9
+ JavaNativeInstrumentations = "java-native-instrumentations",
10
+ SizeS = "size_s",
11
+ SizeM = "size_m",
12
+ SizeL = "size_l"
13
+ }
2
14
  export declare enum MountMethod {
3
15
  VirtualDevice = "VirtualDevice",
4
16
  HostPath = "HostPath",
@@ -53,6 +65,7 @@ export interface OdigosConfig {
53
65
  imagePrefix: string | null;
54
66
  ignoredNamespaces: string[] | null;
55
67
  ignoredContainers: string[] | null;
68
+ profiles: Profile[] | null;
56
69
  mountMethod: MountMethod | null;
57
70
  agentEnvVarsInjectionMethod: AgentEnvVarsInjectionMethod | null;
58
71
  customContainerRuntimeSocketPath: string | null;
package/lib/types.js CHANGED
@@ -184,6 +184,30 @@ var SortDirection;
184
184
  SortDirection["Descending"] = "desc";
185
185
  })(SortDirection || (SortDirection = {}));
186
186
 
187
+ var Profile;
188
+ (function (Profile) {
189
+ // CategoryAttributes = 'category-attributes',
190
+ Profile["CodeAttributes"] = "code-attributes";
191
+ // CopyScope = 'copy-scope',
192
+ // HostnameAsPodname = 'hostname-as-podname',
193
+ Profile["FullPayloadCollection"] = "full-payload-collection";
194
+ Profile["DbPayloadCollection"] = "db-payload-collection";
195
+ Profile["QueryOperationDetector"] = "query-operation-detector";
196
+ // Semconv = 'semconv',
197
+ // ReduceSpanNameCardinality = 'reduce-span-name-cardinality',
198
+ Profile["AllowConcurrentAgents"] = "allow_concurrent_agents";
199
+ Profile["JavaEbpfInstrumentations"] = "java-ebpf-instrumentations";
200
+ Profile["JavaNativeInstrumentations"] = "java-native-instrumentations";
201
+ // LegacyDotnetInstrumentation = 'legacy-dotnet-instrumentation',
202
+ // MountMethodK8sHostPath = 'mount-method-k8s-host-path',
203
+ // MountMethodK8sVirtualDevice = 'mount-method-k8s-virtual-device',
204
+ // PodManifestEnvVarInjection = 'pod-manifest-env-var-injection',
205
+ // DisableGin = 'disable-gin',
206
+ // SmallBatches = 'small-batches',
207
+ Profile["SizeS"] = "size_s";
208
+ Profile["SizeM"] = "size_m";
209
+ Profile["SizeL"] = "size_l";
210
+ })(Profile || (Profile = {}));
187
211
  var MountMethod;
188
212
  (function (MountMethod) {
189
213
  MountMethod["VirtualDevice"] = "VirtualDevice";
@@ -340,4 +364,4 @@ var K8sResourceKind;
340
364
  K8sResourceKind["CronJob"] = "CronJob";
341
365
  })(K8sResourceKind || (K8sResourceKind = {}));
342
366
 
343
- export { ActionCategory, ActionKeyTypes, ActionType, AddNodeTypes, AgentEnvVarsInjectionMethod, BooleanOperation, CodeAttributesKeyTypes, Crud, CustomInstrumentationsKeyTypes, DestinationTypes, EdgeTypes, EntityTypes, FieldTypes, HeadersCollectionKeyTypes, InputTypes, InstallationMethod, InstrumentationRuleType, IntrumentationStatus, JsonOperation, K8sResourceKind, MountMethod, NodeTypes, NumberOperation, OtherEntityTypes, OtherStatus, PayloadCollectionKeyTypes, PlatformType, ProgrammingLanguages, SignalType, SortDirection, StatusType, StringOperation, Tier };
367
+ export { ActionCategory, ActionKeyTypes, ActionType, AddNodeTypes, AgentEnvVarsInjectionMethod, BooleanOperation, CodeAttributesKeyTypes, Crud, CustomInstrumentationsKeyTypes, DestinationTypes, EdgeTypes, EntityTypes, FieldTypes, HeadersCollectionKeyTypes, InputTypes, InstallationMethod, InstrumentationRuleType, IntrumentationStatus, JsonOperation, K8sResourceKind, MountMethod, NodeTypes, NumberOperation, OtherEntityTypes, OtherStatus, PayloadCollectionKeyTypes, PlatformType, Profile, ProgrammingLanguages, SignalType, SortDirection, StatusType, StringOperation, Tier };
@@ -1,4 +1,4 @@
1
- import { z as useModalStore, O as useDrawerStore, Q as useActiveNodeStore } from './index-bd48e6e2.js';
1
+ import { z as useModalStore, O as useDrawerStore, Q as useActiveNodeStore } from './index-8fc2f11e.js';
2
2
  import { AddNodeTypes, EntityTypes, PayloadCollectionKeyTypes, CodeAttributesKeyTypes, CustomInstrumentationsKeyTypes } from './types.js';
3
3
  import React, { useState, useMemo, useEffect, useRef, useCallback } from 'react';
4
4
  import styled from 'styled-components';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@odigos/ui-kit",
3
- "version": "0.0.68",
3
+ "version": "0.0.69",
4
4
  "author": "Odigos",
5
5
  "repository": {
6
6
  "type": "git",
@@ -89,11 +89,11 @@
89
89
  "javascript-time-ago": "^2.5.11",
90
90
  "lottie-react": "^2.4.1",
91
91
  "prism-react-renderer": "^2.4.1",
92
- "react": "^19.1.0",
93
- "react-dom": "^19.1.0",
92
+ "react": "^19.1.1",
93
+ "react-dom": "^19.1.1",
94
94
  "react-error-boundary": "^6.0.0",
95
95
  "styled-components": "^6.1.19",
96
- "zustand": "^5.0.6"
96
+ "zustand": "^5.0.7"
97
97
  },
98
98
  "devDependencies": {
99
99
  "@babel/core": "^7.28.0",
@@ -105,22 +105,22 @@
105
105
  "@rollup/plugin-json": "^6.1.0",
106
106
  "@rollup/plugin-node-resolve": "^16.0.1",
107
107
  "@rollup/plugin-typescript": "^12.1.4",
108
- "@storybook/addon-docs": "^9.0.18",
108
+ "@storybook/addon-docs": "^9.1.1",
109
109
  "@storybook/addon-webpack5-compiler-babel": "^3.0.6",
110
- "@storybook/react-webpack5": "9.0.18",
111
- "@types/node": "^24.1.0",
112
- "@types/react": "^19.1.8",
113
- "@types/react-dom": "^19.1.6",
110
+ "@storybook/react-webpack5": "9.1.1",
111
+ "@types/node": "^24.2.0",
112
+ "@types/react": "^19.1.9",
113
+ "@types/react-dom": "^19.1.7",
114
114
  "babel-loader": "^10.0.0",
115
115
  "babel-plugin-styled-components": "^2.1.4",
116
- "eslint": "^9.31.0",
117
- "eslint-config-next": "^15.4.3",
118
- "eslint-plugin-storybook": "9.0.18",
119
- "next": "^15.4.3",
116
+ "eslint": "^9.32.0",
117
+ "eslint-config-next": "^15.4.5",
118
+ "eslint-plugin-storybook": "9.1.1",
119
+ "next": "^15.4.5",
120
120
  "postcss": "^8.5.6",
121
121
  "rollup": "^3.29.4",
122
122
  "rollup-plugin-postcss": "^4.0.2",
123
- "storybook": "9.0.18",
124
- "typescript": "^5.8.3"
123
+ "storybook": "9.1.1",
124
+ "typescript": "^5.9.2"
125
125
  }
126
126
  }