@odigos/ui-kit 0.0.63 → 0.0.65

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # Changelog
 
+## [0.0.65](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.64...ui-kit-v0.0.65) (2025-07-21)
+
+
+### Bug Fixes
+
+* close on save ([9579c54](https://github.com/odigos-io/ui-kit/commit/9579c5474b5bf960828a83286455523a9a0deaa1))
+* props, and exports for system settings ([#263](https://github.com/odigos-io/ui-kit/issues/263)) ([7279e3c](https://github.com/odigos-io/ui-kit/commit/7279e3ca043de51a4e7cf659427284e563d810ec))
+
+## [0.0.64](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.63...ui-kit-v0.0.64) (2025-07-21)
+
+
+### Features
+
+* add drawer for "system settings" ([#261](https://github.com/odigos-io/ui-kit/issues/261)) ([cd3eb2e](https://github.com/odigos-io/ui-kit/commit/cd3eb2e986ffdf4796c4d98423405cfa7f1bfc2c))
+
 ## [0.0.63](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.62...ui-kit-v0.0.63) (2025-07-21)
 
 

package/lib/components/key-value-input-list/index.d.ts

@@ -9,10 +9,12 @@ interface KeyValueInputsListProps {
     onChange?: (validKeyValuePairs: Row[]) => void;
     title?: string;
     tooltip?: string;
+    disabled?: boolean;
     required?: boolean;
     errorMessage?: string;
     keyPlaceholder?: string;
     valuePlaceholder?: string;
+    inputMaxWidth?: number;
 }
 declare const KeyValueInputsList: FC<KeyValueInputsListProps>;
 export { KeyValueInputsList, type KeyValueInputsListProps };

package/lib/components/toggle/index.d.ts

@@ -1,6 +1,6 @@
 import { type FC } from 'react';
 interface ToggleProps {
-    title: string;
+    title?: string;
     tooltip?: string;
     initialValue?: boolean;
     onChange?: (value: boolean) => void;

package/lib/components.js

@@ -1,16 +1,16 @@
-import { B as Button } from './index-61caa474.js';
-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-61caa474.js';
-export { C as CancelWarning, D as DeleteWarning } from './index-eb03f43f.js';
+import { B as Button } from './index-f2da9ad4.js';
+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-f2da9ad4.js';
+export { C as CancelWarning, D as DeleteWarning } from './index-7074fb24.js';
 import React, { createContext, Component, createElement } from 'react';
 import { T as Theme } from './index-bd48e6e2.js';
+import 'styled-components';
+import './index-391844c6.js';
 import './types.js';
-import './index-1fcb0269.js';
+import './index-5e5f7bda.js';
 import './index-58440c5c.js';
-import 'styled-components';
 import './index-50101bec.js';
-import './index-ec555530.js';
 import 'react-dom';
-import './useTransition-750816e0.js';
+import './useTransition-c2aef0e4.js';
 
 const ErrorBoundaryContext = createContext(null);
 

package/lib/containers/index.d.ts

@@ -34,6 +34,7 @@ export * from './source-modal';
 export * from './source-selection-form';
 export * from './source-table';
 export * from './system-overview';
+export * from './system-settings';
 export * from './table-cell-conditions';
 export * from './toast-list';
 export * from './toggle-dark-mode';

package/lib/containers/system-settings/index.d.ts

@@ -0,0 +1,8 @@
+import { type FC } from 'react';
+import type { OdigosConfig } from '@/types';
+interface SystemSettingsProps {
+    fetchSettings: () => Promise<OdigosConfig | undefined>;
+    onSave: (payload: OdigosConfig) => Promise<void>;
+}
+declare const SystemSettings: FC<SystemSettingsProps>;
+export { SystemSettings, type SystemSettingsProps };

package/lib/containers/system-settings/settings/collector-gateway-settings.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { SettingsProps } from './types';
+declare const CollectorGatewaySettings: FC<SettingsProps>;
+export { CollectorGatewaySettings };

package/lib/containers/system-settings/settings/collector-node-settings.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { SettingsProps } from './types';
+declare const CollectorNodeSettings: FC<SettingsProps>;
+export { CollectorNodeSettings };

package/lib/containers/system-settings/settings/options.d.ts

@@ -0,0 +1,7 @@
+import type { DropdownOption } from '@/components';
+import { AgentEnvVarsInjectionMethod, MountMethod, Profile, ProgrammingLanguages, UiMode } from '@/types';
+export declare const UI_MODE_OPTIONS: DropdownOption<UiMode>[];
+export declare const INSTRUMENTATION_LANG_OPTIONS: DropdownOption<ProgrammingLanguages>[];
+export declare const MOUNT_METHOD_OPTIONS: DropdownOption<MountMethod>[];
+export declare const AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS: DropdownOption<AgentEnvVarsInjectionMethod>[];
+export declare const PROFILE_OPTIONS: DropdownOption<Profile>[];

package/lib/containers/system-settings/settings/other-settings.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { SettingsProps } from './types';
+declare const OtherSettings: FC<SettingsProps>;
+export { OtherSettings };

package/lib/containers/system-settings/settings/styled.d.ts

@@ -0,0 +1,2 @@
+export declare const Card: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CardTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@/components").TextProps, never>> & string & Omit<import("react").FC<import("@/components").TextProps>, keyof import("react").Component<any, {}, any>>;

package/lib/containers/system-settings/settings/types.d.ts

@@ -0,0 +1,5 @@
+import type { OdigosConfig } from '@/types';
+export interface SettingsProps {
+    formData: OdigosConfig;
+    handleFormChange: (key: keyof OdigosConfig | string, value: any) => void;
+}

package/lib/containers/system-settings/settings/ui-settings.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { SettingsProps } from './types';
+declare const UiSettings: FC<SettingsProps>;
+export { UiSettings };

package/lib/containers/system-settings/settings/user-instrumnetation-envs-settings.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { SettingsProps } from './types';
+declare const UserInstrumentationEnvsSettings: FC<SettingsProps>;
+export { UserInstrumentationEnvsSettings };

package/lib/containers.js

@@ -1,17 +1,17 @@
 import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle, useMemo, Fragment, useCallback, Children } from 'react';
 import styled, { css } from 'styled-components';
 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';
-import { ActionType, ActionKeyTypes, InputTypes, FieldTypes, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, EdgeTypes, AddNodeTypes, SignalType, HeadersCollectionKeyTypes, CustomInstrumentationsKeyTypes, CodeAttributesKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType, K8sResourceKind } from './types.js';
-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-61caa474.js';
-import { i as isEmpty, s as safeJsonParse } from './index-ec555530.js';
+import { ActionType, ActionKeyTypes, InputTypes, FieldTypes, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, EdgeTypes, AddNodeTypes, SignalType, HeadersCollectionKeyTypes, CustomInstrumentationsKeyTypes, CodeAttributesKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType, K8sResourceKind, UiMode, ProgrammingLanguages, MountMethod, AgentEnvVarsInjectionMethod, Profile } from './types.js';
+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-f2da9ad4.js';
+import { i as isEmpty, s as safeJsonParse, d as deepClone } from './index-5e5f7bda.js';
 import { C as CheckCircledIcon, O as OdigosLogo } from './index-50101bec.js';
-import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, R as RefreshLeftArrowIcon, N as NotificationIcon, U as UserIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon } from './index-56ab40b8.js';
+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';
 import { useActionFormData, useSessionStorage, useDataStreamFormData, useDestinationFormData, useClickNotification, useSourceFormData, useSourceSelectionFormData } from './hooks.js';
-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-750816e0.js';
-import { E as EditIcon, T as TrashIcon, S as SearchIcon, h as CheckIcon, A as ArrowIcon, P as PlusIcon, a as CopyIcon } from './index-1fcb0269.js';
-import { D as DeleteWarning, C as CancelWarning } from './index-eb03f43f.js';
+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';
+import { E as EditIcon, T as TrashIcon, S as SearchIcon, h as CheckIcon, P as PlusIcon, a as CopyIcon } from './index-391844c6.js';
+import { D as DeleteWarning, C as CancelWarning } from './index-7074fb24.js';
 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';
-import { f as filterActions, m as getEntityLabel, l as getEntityIcon, w as sleep, o as getPlatformIcon, p as getPlatformLabel, h as formatBytes, j as getContainersIcons, q as getValueForRange, k as getDestinationIcon, g as filterSourcesByStream, e as filterSources, b as filterDestinationsByStream, a as filterDestinations, v as mapDestinationFieldsForDisplay, c as compareCondition, s as getYamlFieldsForDestination, d as deepClone, n as getMetricForEntity, r as getWorkloadId, t as hasUnhealthyInstances, i as getContainersInstrumentedCount, u as isOverTime } from './index-9e56485b.js';
+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';
 import { m as mapExportedSignals } from './index-6a6bea6e.js';
 import { NoteBackToSummary, EditButton } from './snippets.js';
 import { D as DESTINATION_CATEGORIES } from './index-1cb4f9e2.js';
@@ -677,7 +677,7 @@ const FormContainer$4 = styled.div `
   overflow: overlay;
   overflow-y: auto;
 `;
-const DataContainer$3 = styled.div `
+const DataContainer$4 = styled.div `
   display: flex;
   flex-direction: column;
   gap: 12px;
@@ -732,7 +732,7 @@ const ActionDrawer = ({ updateAction, deleteAction }) => {
         React.createElement(ActionForm, { isUpdate: true, action: thisOptionType, formData: formData, formErrors: formErrors, handleFormChange: (...params) => {
                 setIsFormDirty(true);
                 handleFormChange(...params);
-            } }))) : (React.createElement(DataContainer$3, null,
+            } }))) : (React.createElement(DataContainer$4, null,
         React.createElement(ConditionDetails, { conditions: thisItem.conditions || [] }),
         React.createElement(DataCard, { title: DISPLAY_TITLES.ACTION_DETAILS, data: !!thisItem ? buildCard$3(thisItem) : [] })))));
 };
@@ -2508,7 +2508,7 @@ const FormContainer$2 = styled.div `
   overflow: overlay;
   overflow-y: auto;
 `;
-const DataContainer$2 = styled.div `
+const DataContainer$3 = styled.div `
   display: flex;
   flex-direction: column;
   gap: 12px;
@@ -2573,7 +2573,7 @@ const DestinationDrawer = ({ categories, updateDestination, deleteDestination, t
             }, dynamicFields: dynamicFields, setDynamicFields: (...params) => {
                 setIsFormDirty(true);
                 setDynamicFields(...params);
-            }, validateForm: validateForm, testConnection: testConnection }))) : (React.createElement(DataContainer$2, null,
+            }, validateForm: validateForm, testConnection: testConnection }))) : (React.createElement(DataContainer$3, null,
         thisItem.conditions?.length ? React.createElement(ConditionDetails, { conditions: thisItem.conditions }) : null,
         React.createElement(DataCard, { title: DISPLAY_TITLES.DESTINATION_DETAILS, data: !!thisItem ? buildCard$2(thisItem, yamlFields) : [] })))));
 };
@@ -4286,7 +4286,7 @@ const FormContainer = styled.div `
   overflow: overlay;
   overflow-y: auto;
 `;
-const DataContainer$1 = styled.div `
+const DataContainer$2 = styled.div `
   display: flex;
   flex-direction: column;
   gap: 12px;
@@ -4375,7 +4375,7 @@ const SourceDrawer = ({ persistSources, updateSource, fetchDescribeSource, resta
                 setIsFormDirty(true);
                 handleFormChange(...params);
                 handleFormChange('currentStreamName', selectedStreamName);
-            } }))) : (React.createElement(DataContainer$1, null,
+            } }))) : (React.createElement(DataContainer$2, null,
         React.createElement(ConditionDetails, { conditions: thisItem.conditions || [] }),
         React.createElement(DataCard, { title: DISPLAY_TITLES.SOURCE_DETAILS, data: !!thisItem ? buildCard(thisItem) : [] }),
         React.createElement(DataCard, { title: DISPLAY_TITLES.DETECTED_CONTAINERS, titleBadge: containersData.isLoading ? OtherStatus.Loading : containersData.containers.length, description: containersData.description || DISPLAY_TITLES.DETECTED_CONTAINERS_DESCRIPTION }, containersData.containers.map((container) => (React.createElement(SourceContainer, { key: `source-container-${container.containerName}`, ...container, callbackRuntimeOverride: async (payload) => await updateSource(drawerEntityId, payload) }))))))) : (React.createElement(Describe$1, { source: thisItem, fetchDescribeSource: fetchDescribeSource }))));
@@ -4699,30 +4699,285 @@ const Describe = ({ fetchDescribeOdigos }) => {
         React.createElement(DataCard, { title: 'Node Collector', withExtend: true }, Object.values(describe?.nodeCollector || {}).map(mapObjectToCardChildren))));
 };
 
-const DataContainer = styled.div `
+const DataContainer$1 = styled.div `
   display: flex;
   flex-direction: column;
   gap: 12px;
 `;
-const DRAWER_WIDTH = '750px';
-const TITLE_TEXT = 'System Overview';
+const DRAWER_WIDTH$1 = '750px';
+const TITLE_TEXT$1 = 'System Overview';
 const SystemOverview = ({ tokens, saveToken, fetchDescribeOdigos }) => {
     const [isOpen, setIsOpen] = useState(false);
     const toggleOpen = () => setIsOpen((prev) => !prev);
     return (React.createElement(React.Fragment, null,
-        React.createElement(IconButton, { key: 'cli', onClick: toggleOpen, tooltip: TITLE_TEXT },
+        React.createElement(IconButton, { key: TITLE_TEXT$1, onClick: toggleOpen, tooltip: TITLE_TEXT$1 },
             React.createElement(TerminalIcon, { size: 18 })),
-        React.createElement(Drawer, { width: DRAWER_WIDTH, isOpen: isOpen, onClose: toggleOpen, header: {
+        React.createElement(Drawer, { width: DRAWER_WIDTH$1, isOpen: isOpen, onClose: toggleOpen, header: {
                 icons: [TerminalIcon],
-                title: TITLE_TEXT,
+                title: TITLE_TEXT$1,
             }, footer: {
                 isOpen: false,
             } },
-            React.createElement(DataContainer, null,
+            React.createElement(DataContainer$1, null,
                 !!tokens?.length && React.createElement(Tokens, { tokens: tokens, saveToken: saveToken }),
                 React.createElement(Describe, { fetchDescribeOdigos: fetchDescribeOdigos })))));
 };
 
+const Card = styled.div `
+  align-self: stretch;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 16px;
+  padding: 16px;
+  border-radius: 24px;
+  background: ${({ theme }) => theme.colors.secondary + Theme.opacity.hex['004']};
+`;
+const CardTitle = styled(Text) `
+  color: ${({ theme }) => theme.text.secondary};
+  font-size: 18px;
+  font-weight: 600;
+  line-height: 20px;
+`;
+
+const UI_MODE_OPTIONS = [
+    { id: UiMode.Default, value: 'Default' },
+    { id: UiMode.ReadOnly, value: 'Read Only' },
+];
+const INSTRUMENTATION_LANG_OPTIONS = [
+    {
+        id: ProgrammingLanguages.Go,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.Go],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.Go),
+    },
+    {
+        id: ProgrammingLanguages.JavaScript,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.JavaScript],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.JavaScript),
+    },
+    {
+        id: ProgrammingLanguages.Python,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.Python],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.Python),
+    },
+    {
+        id: ProgrammingLanguages.Java,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.Java],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.Java),
+    },
+    {
+        id: ProgrammingLanguages.Php,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.Php],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.Php),
+    },
+    {
+        id: ProgrammingLanguages.Ruby,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.Ruby],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.Ruby),
+    },
+    {
+        id: ProgrammingLanguages.DotNet,
+        value: DISPLAY_LANGUAGES[ProgrammingLanguages.DotNet],
+        icon: getProgrammingLanguageIcon(ProgrammingLanguages.DotNet),
+    },
+];
+const MOUNT_METHOD_OPTIONS = [
+    { id: MountMethod.VirtualDevice, value: 'Virtual Device' },
+    { id: MountMethod.HostPath, value: 'Host Path' },
+    // { id: MountMethod.InitContainer, value: 'Init Container' },
+];
+const AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS = [
+    { id: AgentEnvVarsInjectionMethod.Loader, value: 'Loader' },
+    { id: AgentEnvVarsInjectionMethod.PodManifest, value: 'Pod Manifest' },
+    { id: AgentEnvVarsInjectionMethod.LoaderFallbackToPodManifest, value: 'Loader Fallback to Pod Manifest' },
+];
+const PROFILE_OPTIONS = [
+    // { id: Profile.CategoryAttributes, value: 'Category Attributes' },
+    { id: Profile.CodeAttributes, value: 'Code Attributes' },
+    // { id: Profile.CopyScope, value: 'Copy Scope' },
+    // { id: Profile.HostnameAsPodname, value: 'Hostname as Podname' },
+    { id: Profile.FullPayloadCollection, value: 'Full Payload Collection' },
+    { id: Profile.DbPayloadCollection, value: 'DB Payload Collection' },
+    { id: Profile.QueryOperationDetector, value: 'Query Operation Detector' },
+    // { id: Profile.Semconv, value: 'Semconv' },
+    // { id: Profile.ReduceSpanNameCardinality, value: 'Reduce Span Name Cardinality' },
+    { id: Profile.AllowConcurrentAgents, value: 'Allow Concurrent Agents' },
+    { id: Profile.JavaEbpfInstrumentations, value: 'Java EBPF Instrumentations' },
+    { id: Profile.JavaNativeInstrumentations, value: 'Java Native Instrumentations' },
+    // { id: Profile.LegacyDotnetInstrumentation, value: 'Legacy .NET Instrumentation' },
+    // { id: Profile.MountMethodK8sHostPath, value: 'Mount Method K8s Host Path' },
+    // { id: Profile.MountMethodK8sVirtualDevice, value: 'Mount Method K8s Virtual Device' },
+    // { id: Profile.PodManifestEnvVarInjection, value: 'Pod Manifest Env Var Injection' },
+    // { id: Profile.DisableGin, value: 'Disable Gin' },
+    // { id: Profile.SmallBatches, value: 'Small Batches' },
+    { id: Profile.SizeS, value: 'Size S' },
+    { id: Profile.SizeM, value: 'Size M' },
+    { id: Profile.SizeL, value: 'Size L' },
+];
+
+const UiSettings = ({ formData, handleFormChange }) => {
+    return (React.createElement(Card, null,
+        React.createElement(CardTitle, null, "UI"),
+        React.createElement(Dropdown, { title: 'UI Mode', tooltip: 'Mode of the UI - default or readonly', options: UI_MODE_OPTIONS, value: UI_MODE_OPTIONS.find((option) => option.id === formData.uiMode), onSelect: (option) => handleFormChange('uiMode', option.id) }),
+        React.createElement(Input, { title: 'UI Pagination Limit', tooltip: 'Pagination limit for UI paginated fetching', type: 'number', value: formData.uiPaginationLimit.toString(), onChange: (e) => handleFormChange('uiPaginationLimit', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Central Backend URL', tooltip: 'URL of the central backend', value: formData.centralBackendURL, onChange: (e) => handleFormChange('centralBackendURL', e.target.value) }),
+        React.createElement(Input, { title: 'OIDC Tenant URL', tooltip: 'URL of the OIDC tenant', value: formData.oidc?.tenantUrl, onChange: (e) => handleFormChange('oidc.tenantUrl', e.target.value) }),
+        React.createElement(Input, { title: 'OIDC Client ID', tooltip: 'Client ID of the OIDC application', value: formData.oidc?.clientId, onChange: (e) => handleFormChange('oidc.clientId', e.target.value) }),
+        React.createElement(Input, { title: 'OIDC Client Secret', tooltip: 'Client Secret of the OIDC application', type: 'password', value: formData.oidc?.clientSecret, onChange: (e) => handleFormChange('oidc.clientSecret', e.target.value) })));
+};
+
+const OtherSettings = ({ formData, handleFormChange }) => {
+    return (React.createElement(Card, null,
+        React.createElement(CardTitle, null, "Other"),
+        React.createElement(Toggle, { title: 'Telemetry Enabled', tooltip: 'Enable anonymous telemetry collection', initialValue: formData.telemetryEnabled, onChange: (bool) => handleFormChange('telemetryEnabled', bool) }),
+        React.createElement(Toggle, { title: 'OpenShift Enabled', tooltip: 'Enable OpenShift-specific features', initialValue: formData.openshiftEnabled, onChange: (bool) => handleFormChange('openshiftEnabled', bool) }),
+        React.createElement(Toggle, { title: 'Karpenter Enabled', tooltip: 'Enable Karpenter support', initialValue: formData.karpenterEnabled, onChange: (bool) => handleFormChange('karpenterEnabled', bool) }),
+        React.createElement(Toggle, { title: 'PSP Enabled', tooltip: 'Enable Pod Security Policy support', initialValue: formData.psp, onChange: (bool) => handleFormChange('psp', bool) }),
+        React.createElement(Toggle, { title: 'Allow Concurrent Agents', tooltip: 'Allow concurrent running agents', initialValue: formData.allowConcurrentAgents, onChange: (bool) => handleFormChange('allowConcurrentAgents', bool) }),
+        React.createElement(Toggle, { title: 'Skip Webhook Issuer Creation', tooltip: 'Skip creation of the webhook issuer', initialValue: formData.skipWebhookIssuerCreation, onChange: (bool) => handleFormChange('skipWebhookIssuerCreation', bool) }),
+        React.createElement(Toggle, { title: 'Automatic Rollout Disabled', tooltip: 'Disable automatic rollout of pods after instrumentation', initialValue: formData.rollout?.automaticRolloutDisabled, onChange: (bool) => handleFormChange('rollout.automaticRolloutDisabled', bool) }),
+        React.createElement(Input, { title: 'Cluster Name', tooltip: 'Name of the cluster', value: formData.clusterName, onChange: (e) => handleFormChange('clusterName', e.target.value) }),
+        React.createElement(Input, { title: 'Image Prefix', tooltip: 'Image prefix for all Odigos components', value: formData.imagePrefix, onChange: (e) => handleFormChange('imagePrefix', e.target.value) }),
+        React.createElement(InputList, { title: 'Ignored Namespaces', tooltip: 'List of namespaces to exclude from instrumentation', value: formData.ignoredNamespaces, onChange: (arr) => handleFormChange('ignoredNamespaces', arr) }),
+        React.createElement(InputList, { title: 'Ignored Containers', tooltip: 'List of container names to exclude from instrumentation', value: formData.ignoredContainers, onChange: (arr) => handleFormChange('ignoredContainers', arr) }),
+        React.createElement(Dropdown, { title: 'Profiles', tooltip: 'Profiles to enable', 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)) }),
+        React.createElement(Dropdown, { title: 'Mount Method', tooltip: 'Method used to mount volume', options: MOUNT_METHOD_OPTIONS, value: MOUNT_METHOD_OPTIONS.find((option) => option.id === formData.mountMethod), onSelect: (option) => handleFormChange('mountMethod', option.id) }),
+        React.createElement(Dropdown, { title: 'Agent Env Vars Injection Method', tooltip: 'How to inject env vars into agents', options: AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS, value: AGENT_ENV_VARS_INJECTION_METHOD_OPTIONS.find((option) => option.id === formData.agentEnvVarsInjectionMethod), onSelect: (option) => handleFormChange('agentEnvVarsInjectionMethod', option.id) }),
+        React.createElement(Input, { title: 'Custom Container Runtime Socket Path', tooltip: 'Path to the custom container runtime socket', value: formData.customContainerRuntimeSocketPath, onChange: (e) => handleFormChange('customContainerRuntimeSocketPath', e.target.value) }),
+        React.createElement(Input, { title: 'Odiglet Health Probe Bind Port', tooltip: 'Port to bind the health probe', value: formData.odigletHealthProbeBindPort.toString(), onChange: (e) => handleFormChange('odigletHealthProbeBindPort', Number(e.target.value)) }),
+        React.createElement(Toggle, { title: 'Rollback Disabled', tooltip: 'Disable rollback', initialValue: formData.rollbackDisabled, onChange: (bool) => handleFormChange('rollbackDisabled', bool) }),
+        React.createElement(Input, { title: 'Rollback Grace Time', tooltip: 'Grace time for rollback', value: formData.rollbackGraceTime, onChange: (e) => handleFormChange('rollbackGraceTime', e.target.value) }),
+        React.createElement(Input, { title: 'Rollback Stability Window', tooltip: 'Stability window for rollback', value: formData.rollbackStabilityWindow, onChange: (e) => handleFormChange('rollbackStabilityWindow', e.target.value) }),
+        React.createElement(KeyValueInputsList, { title: 'Node Selector', value: Object.entries(formData.nodeSelector || {}).map(([key, value]) => ({
+                key,
+                value,
+            })), onChange: (arr) => handleFormChange('nodeSelector', arr.reduce((acc, { key, value }) => ({
+                ...acc,
+                [key]: value,
+            }), {})) })));
+};
+
+const CollectorNodeSettings = ({ formData, handleFormChange }) => {
+    return (React.createElement(Card, null,
+        React.createElement(CardTitle, null, "Collector Node"),
+        React.createElement(Input, { title: 'Collector Own Metrics Port', tooltip: "Port for the collector's own Prometheus metrics", type: 'number', value: formData.collectorNode?.collectorOwnMetricsPort?.toString() || '', onChange: (e) => handleFormChange('collectorNode.collectorOwnMetricsPort', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Request Memory (MB)', tooltip: 'Request memory for the collector node in Megabytes', type: 'number', value: formData.collectorNode?.requestMemoryMiB?.toString() || '', onChange: (e) => handleFormChange('collectorNode.requestMemoryMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Limit Memory (MB)', tooltip: 'Limit memory for the collector node in Megabytes', type: 'number', value: formData.collectorNode?.limitMemoryMiB?.toString() || '', onChange: (e) => handleFormChange('collectorNode.limitMemoryMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Request CPU (Millicores)', tooltip: 'Request CPU for the collector node in Millicores', type: 'number', value: formData.collectorNode?.requestCPUm?.toString() || '', onChange: (e) => handleFormChange('collectorNode.requestCPUm', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Limit CPU (Millicores)', tooltip: 'Limit CPU for the collector node in Millicores', type: 'number', value: formData.collectorNode?.limitCPUm?.toString() || '', onChange: (e) => handleFormChange('collectorNode.limitCPUm', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Memory Limiter Limit (MB)', tooltip: 'Memory limiter limit for the collector node in Megabytes', type: 'number', value: formData.collectorNode?.memoryLimiterLimitMiB?.toString() || '', onChange: (e) => handleFormChange('collectorNode.memoryLimiterLimitMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Memory Limiter Spike Limit (MB)', tooltip: 'Memory limiter spike limit for the collector node in Megabytes', type: 'number', value: formData.collectorNode?.memoryLimiterSpikeLimitMiB?.toString() || '', onChange: (e) => handleFormChange('collectorNode.memoryLimiterSpikeLimitMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Go Memory Limit (MB)', tooltip: 'Go memory limit for the collector node in Megabytes', type: 'number', value: formData.collectorNode?.goMemLimitMiB?.toString() || '', onChange: (e) => handleFormChange('collectorNode.goMemLimitMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'K8s Node Logs Directory', tooltip: 'Target directory for K8s logs if `/var/log` is a symlink', value: formData.collectorNode?.k8sNodeLogsDirectory || '', onChange: (e) => handleFormChange('collectorNode.k8sNodeLogsDirectory', e.target.value) })));
+};
+
+const CollectorGatewaySettings = ({ formData, handleFormChange }) => {
+    return (React.createElement(Card, null,
+        React.createElement(CardTitle, null, "Collector Gateway"),
+        React.createElement(Input, { title: 'Min. Replicas', tooltip: 'Minimum number of replicas for the collector gateway', type: 'number', value: formData.collectorGateway?.minReplicas?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.minReplicas', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Max. Replicas', tooltip: 'Maximum number of replicas for the collector gateway', type: 'number', value: formData.collectorGateway?.maxReplicas?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.maxReplicas', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Request Memory (MB)', tooltip: 'Request memory for the collector gateway in Megabytes', type: 'number', value: formData.collectorGateway?.requestMemoryMiB?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.requestMemoryMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Limit Memory (MB)', tooltip: 'Limit memory for the collector gateway in Megabytes', type: 'number', value: formData.collectorGateway?.limitMemoryMiB?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.limitMemoryMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Request CPU (Millicores)', tooltip: 'Request CPU for the collector gateway in Millicores', type: 'number', value: formData.collectorGateway?.requestCPUm?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.requestCPUm', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Limit CPU (Millicores)', tooltip: 'Limit CPU for the collector gateway in Millicores', type: 'number', value: formData.collectorGateway?.limitCPUm?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.limitCPUm', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Memory Limiter Limit (MB)', tooltip: 'Memory limiter limit for the collector gateway in Megabytes', type: 'number', value: formData.collectorGateway?.memoryLimiterLimitMiB?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.memoryLimiterLimitMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Memory Limiter Spike Limit (MB)', tooltip: 'Memory limiter spike limit for the collector gateway in Megabytes', type: 'number', value: formData.collectorGateway?.memoryLimiterSpikeLimitMiB?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.memoryLimiterSpikeLimitMiB', Number(e.target.value)) }),
+        React.createElement(Input, { title: 'Go Memory Limit (MB)', tooltip: 'Go memory limit for the collector gateway in Megabytes', type: 'number', value: formData.collectorGateway?.goMemLimitMiB?.toString() || '', onChange: (e) => handleFormChange('collectorGateway.goMemLimitMiB', Number(e.target.value)) })));
+};
+
+const UserInstrumentationEnvsSettings = ({ formData, handleFormChange }) => {
+    return (React.createElement(Card, null,
+        React.createElement(CardTitle, null, "User Instrumentation Environment Variables"),
+        INSTRUMENTATION_LANG_OPTIONS.map(({ id, value, icon }) => (React.createElement(Card, { key: `${id}-card` },
+            React.createElement(FlexRow, { "$gap": 8, "$alignItems": 'flex-start' },
+                React.createElement(FlexRow, { "$gap": 8 },
+                    React.createElement(FlexRow, { "$gap": 8, style: { minWidth: '100px' } },
+                        React.createElement(IconWrapped, { icon: icon }),
+                        React.createElement(Text, { size: 14 }, value)),
+                    React.createElement(Tooltip, { text: 'enable/disable user instrumentation for this language' },
+                        React.createElement(Toggle, { initialValue: formData.userInstrumentationEnvs?.languages[id]?.enabled, onChange: (bool) => handleFormChange(`userInstrumentationEnvs.languages.${id}.enabled`, bool) }))),
+                React.createElement(KeyValueInputsList, { inputMaxWidth: 220, disabled: !formData.userInstrumentationEnvs?.languages[id]?.enabled, value: Object.entries(formData.userInstrumentationEnvs?.languages[id]?.env || {}).map(([k, v]) => ({
+                        key: k,
+                        value: v,
+                    })), onChange: (rows) => {
+                        handleFormChange(`userInstrumentationEnvs.languages.${id}.env`, rows.reduce((acc, { key, value }) => ({
+                            ...acc,
+                            [key]: value,
+                        }), {}));
+                    } })))))));
+};
+
+const DataContainer = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+`;
+const DRAWER_WIDTH = '750px';
+const TITLE_TEXT = 'System Settings';
+const SystemSettings = ({ fetchSettings, onSave }) => {
+    const [settings, setSettings] = useState(undefined);
+    const { formData, handleFormChange, resetFormData, isFormDirty } = useGenericForm(settings);
+    useEffect(() => {
+        fetchSettings().then(setSettings);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    const [isSaving, setIsSaving] = useState(false);
+    const [isOpen, setIsOpen] = useState(false);
+    const toggleOpen = () => setIsOpen((prev) => !prev);
+    const [cancelWarningOpen, setCancelWarningOpen] = useState(false);
+    const [cancelApproveCallback, setCancelApproveCallback] = useState(null);
+    const handleWithCancelWarning = (callback) => {
+        if (isFormDirty) {
+            setCancelWarningOpen(true);
+            setCancelApproveCallback(() => callback);
+        }
+        else {
+            callback();
+        }
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement(IconButton, { key: TITLE_TEXT, onClick: toggleOpen, tooltip: TITLE_TEXT },
+            React.createElement(GearIcon, { size: 18 })),
+        React.createElement(Drawer, { width: DRAWER_WIDTH, isOpen: isOpen, onClose: () => handleWithCancelWarning(toggleOpen), header: {
+                icons: [GearIcon],
+                title: TITLE_TEXT,
+            }, footer: {
+                isOpen: isFormDirty,
+                centerButtons: [
+                    {
+                        'data-id': 'drawer-cancel',
+                        variant: 'secondary',
+                        onClick: () => handleWithCancelWarning(resetFormData),
+                        children: BUTTON_TEXTS.CANCEL,
+                    },
+                    {
+                        'data-id': 'drawer-save',
+                        variant: 'primary',
+                        onClick: async () => {
+                            setIsSaving(true);
+                            await onSave(formData);
+                            setSettings(await fetchSettings());
+                            setIsSaving(false);
+                            toggleOpen();
+                        },
+                        children: BUTTON_TEXTS.SAVE,
+                    },
+                ],
+            } }, formData?.imagePrefix !== undefined && !isSaving ? (React.createElement(DataContainer, null,
+            React.createElement(UserInstrumentationEnvsSettings, { formData: formData, handleFormChange: handleFormChange }),
+            React.createElement(UiSettings, { formData: formData, handleFormChange: handleFormChange }),
+            React.createElement(CollectorNodeSettings, { formData: formData, handleFormChange: handleFormChange }),
+            React.createElement(CollectorGatewaySettings, { formData: formData, handleFormChange: handleFormChange }),
+            React.createElement(OtherSettings, { formData: formData, handleFormChange: handleFormChange }))) : (React.createElement(CenterThis, null,
+            React.createElement(FadeLoader, { scale: 1.2 })))),
+        React.createElement(CancelWarning, { isOpen: cancelWarningOpen, name: TITLE_TEXT, onApprove: () => {
+                cancelApproveCallback?.();
+                setCancelWarningOpen(false);
+            }, onDeny: () => {
+                setCancelWarningOpen(false);
+            } })));
+};
+
 const Container$1 = styled.div `
   position: fixed;
   bottom: 12px;
@@ -4800,4 +5055,4 @@ const ToggleDarkMode = () => {
         React.createElement(Background, { "$darkMode": darkMode })));
 };
 
-export { ActionDrawer, ActionForm, ActionModal, ActionTable, AwaitPipeline, ComputePlatformSelect, ComputePlatforms, ComputePlatformsActionsMenu, ConditionDropdown, ConnectionStatusDropdown, ConnectionTypeDropdown, DataFlow, DataFlowActionsMenu, DataStreamDrawer, DataStreamForm, DataStreamSelectionForm, DestinationDrawer, DestinationForm, DestinationModal, DestinationSelectionForm, DestinationTable, ErrorDropdown, InstrumentationRuleDrawer, InstrumentationRuleForm, InstrumentationRuleModal, InstrumentationRuleTable, KindDropdown, LanguageDropdown, MonitorDropdown, MultiSourceControl, NamespaceDropdown, NavIconIds, NotificationManager, OverviewDrawer, ServiceMap, SetupSummary, SideNav, SlackInvite, SourceDrawer, SourceForm, SourceModal, SourceSelectionForm, SourceTable, SystemOverview, TableCellConditions, ToastList, ToggleDarkMode };
+export { ActionDrawer, ActionForm, ActionModal, ActionTable, AwaitPipeline, ComputePlatformSelect, ComputePlatforms, ComputePlatformsActionsMenu, ConditionDropdown, ConnectionStatusDropdown, ConnectionTypeDropdown, DataFlow, DataFlowActionsMenu, DataStreamDrawer, DataStreamForm, DataStreamSelectionForm, DestinationDrawer, DestinationForm, DestinationModal, DestinationSelectionForm, DestinationTable, ErrorDropdown, InstrumentationRuleDrawer, InstrumentationRuleForm, InstrumentationRuleModal, InstrumentationRuleTable, KindDropdown, LanguageDropdown, MonitorDropdown, MultiSourceControl, NamespaceDropdown, NavIconIds, NotificationManager, OverviewDrawer, ServiceMap, SetupSummary, SideNav, SlackInvite, SourceDrawer, SourceForm, SourceModal, SourceSelectionForm, SourceTable, SystemOverview, SystemSettings, TableCellConditions, ToastList, ToggleDarkMode };

package/lib/functions.js

@@ -1,9 +1,9 @@
 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';
-export { c as compareCondition, d as deepClone, f as filterActions, a as filterDestinations, b as filterDestinationsByStream, e as filterSources, g as filterSourcesByStream, h as formatBytes, j as getContainersIcons, i as getContainersInstrumentedCount, k as getDestinationIcon, l as getEntityIcon, m as getEntityLabel, n as getMetricForEntity, o as getPlatformIcon, p as getPlatformLabel, q as getValueForRange, r as getWorkloadId, s as getYamlFieldsForDestination, t as hasUnhealthyInstances, u as isOverTime, v as mapDestinationFieldsForDisplay, w as sleep } from './index-9e56485b.js';
+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';
+export { d as deepClone, i as isEmpty, s as safeJsonParse } from './index-5e5f7bda.js';
 export { g as getActionIcon, c as getEntityId, d as getInstrumentationRuleIcon, e as getProgrammingLanguageIcon } from './index-bd48e6e2.js';
 export { g as getIdFromSseTarget, i as isLegalK8sLabel, m as mapExportedSignals } from './index-6a6bea6e.js';
 import { ProgrammingLanguages, EntityTypes } from './types.js';
-export { i as isEmpty, s as safeJsonParse } from './index-ec555530.js';
 import 'react';
 import 'styled-components';
 import './index-50101bec.js';

package/lib/hooks/useGenericForm.d.ts

@@ -1,5 +1,5 @@
 import type { AnyObj } from '@/types';
-export declare const useGenericForm: <Form extends AnyObj>(initialFormData: Form) => {
+export declare const useGenericForm: <Form extends AnyObj>(initialFormData: Form | undefined) => {
     formData: Form;
     formErrors: Partial<Record<keyof Form, string>>;
     isFormDirty: boolean;

package/lib/hooks.js

@@ -2,9 +2,9 @@ import { ActionKeyTypes, ActionType, StatusType, EntityTypes, FieldTypes } from
 import { V as useNotificationStore, F as FORM_ALERTS, O as useDrawerStore, W as useEntityStore, Y as useDataStreamStore, _ as useSetupStore } from './index-bd48e6e2.js';
 import { useState, useEffect, useMemo } from 'react';
 import 'styled-components';
-import { i as isEmpty, s as safeJsonParse } from './index-ec555530.js';
-import { i as useGenericForm } from './useTransition-750816e0.js';
-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-750816e0.js';
+import { i as isEmpty, s as safeJsonParse } from './index-5e5f7bda.js';
+import { i as useGenericForm } from './useTransition-c2aef0e4.js';
+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';
 import { g as getIdFromSseTarget, i as isLegalK8sLabel, m as mapExportedSignals } from './index-6a6bea6e.js';
 
 const INITIAL$2 = {

package/lib/icons/common/gear-icon/index.d.ts

@@ -0,0 +1,2 @@
+import type { SVG } from '@/types';
+export declare const GearIcon: SVG;

package/lib/icons/common/index.d.ts

@@ -9,6 +9,7 @@ export * from './edited-icon';
 export * from './extend-arrow-icon';
 export * from './filter-icon';
 export * from './folder-icon';
+export * from './gear-icon';
 export * from './image-error-icon';
 export * from './key-icon';
 export * from './list-icon';

package/lib/icons.js

@@ -1,9 +1,9 @@
 import { T as Theme } from './index-bd48e6e2.js';
 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';
 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';
-export { C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, 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-56ab40b8.js';
-export { A as ArrowIcon, 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-1fcb0269.js';
+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';
 import React from 'react';
+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';
 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';
 import './types.js';
 import 'styled-components';