@odigos/ui-kit 0.0.32 → 0.0.33

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [0.0.33](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.32...ui-kit-v0.0.33) (2025-05-27)
+
+
+### Bug Fixes
+
+* Data Stream bugs ([#140](https://github.com/odigos-io/ui-kit/issues/140)) ([1af6a2f](https://github.com/odigos-io/ui-kit/commit/1af6a2f66720aca790d6179a3df47585362884c9))
+
 ## [0.0.32](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.31...ui-kit-v0.0.32) (2025-05-25)
 
 

package/lib/components.js

@@ -1,16 +1,16 @@
-import { B as Button } from './index-BxckQJom.js';
-export { a as AutocompleteInput, b as Badge, a1 as CenterThis, C as Checkbox, c as Code, d as ConditionDetails, D as DataCard, f as DataCardFieldTypes, e as DataCardFields, g as DataTab, h as Divider, i as DocsButton, j as Drawer, l as DrawerFooter, k as DrawerHeader, m as Dropdown, E as ExtendArrow, F as FadeLoader, n as FieldError, o as FieldLabel, a0 as FlexColumn, $ as FlexRow, H as Header, I as IconButton, p as IconGroup, q as IconTitleBadge, r as IconWrapped, s as IconsNav, t as ImageControlled, u as Input, v as InputList, w as InputTable, x as InteractiveTable, K as KeyValueInputsList, M as Modal, a4 as ModalBody, y as MonitorsCheckboxes, z as MonitorsIcons, N as NavigationButtons, G as NoDataFound, J as NotificationNote, a3 as Overlay, S as ScrollX, L as SectionTitle, O as Segment, P as SelectionButton, Q as SkeletonLoader, R as Status, U as Stepper, a5 as TableContainer, a6 as TableTitleWrap, a7 as TableWrap, V as Text, W as TextArea, X as Toggle, T as ToggleCodeComponent, Y as Tooltip, Z as TraceLoader, a2 as VerticalScroll, _ as WarningModal } from './index-BxckQJom.js';
-export { C as CancelWarning, D as DeleteWarning } from './index-rbphz5kH.js';
+import { B as Button } from './index-BedCNcwV.js';
+export { a as AutocompleteInput, b as Badge, a1 as CenterThis, C as Checkbox, c as Code, d as ConditionDetails, D as DataCard, f as DataCardFieldTypes, e as DataCardFields, g as DataTab, h as Divider, i as DocsButton, j as Drawer, l as DrawerFooter, k as DrawerHeader, m as Dropdown, E as ExtendArrow, F as FadeLoader, n as FieldError, o as FieldLabel, a0 as FlexColumn, $ as FlexRow, H as Header, I as IconButton, p as IconGroup, q as IconTitleBadge, r as IconWrapped, s as IconsNav, t as ImageControlled, u as Input, v as InputList, w as InputTable, x as InteractiveTable, K as KeyValueInputsList, M as Modal, a4 as ModalBody, y as MonitorsCheckboxes, z as MonitorsIcons, N as NavigationButtons, G as NoDataFound, J as NotificationNote, a3 as Overlay, S as ScrollX, L as SectionTitle, O as Segment, P as SelectionButton, Q as SkeletonLoader, R as Status, U as Stepper, a5 as TableContainer, a6 as TableTitleWrap, a7 as TableWrap, V as Text, W as TextArea, X as Toggle, T as ToggleCodeComponent, Y as Tooltip, Z as TraceLoader, a2 as VerticalScroll, _ as WarningModal } from './index-BedCNcwV.js';
+export { C as CancelWarning, D as DeleteWarning } from './index-CaAOgaiC.js';
 import React, { Component, createElement, createContext } from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
 import 'styled-components';
-import './index-DAbcw-wM.js';
+import './index-CNfdJ1X8.js';
 import './types.js';
-import './index-BZS1ijMm.js';
-import './index-B9cvsYnj.js';
-import './index-C7YDojNh.js';
-import './index-DuSmjoDs.js';
-import './useTransition-9tDdAS9s.js';
+import './index-BV85P9UP.js';
+import './index-mOgS3e5E.js';
+import './index-B_Gl6Qa6.js';
+import './index-Do3CYz7N.js';
+import './useTransition-B0eagOib.js';
 import 'react-dom';
 
 const ErrorBoundaryContext = createContext(null);

package/lib/constants/strings/index.d.ts

@@ -9,6 +9,7 @@ export declare const FORM_ALERTS: {
     CANNOT_DELETE_RULE: string;
     LATENCY_HTTP_ROUTE: string;
     READONLY_WARNING: string;
+    ILLEGAL_K8S_LABEL: string;
 };
 export declare const DISPLAY_TITLES: {
     NAMESPACE: string;

package/lib/constants.js

@@ -1,6 +1,6 @@
-export { A as ACTION_OPTIONS, I as INSTRUMENTATION_RULE_OPTIONS, M as MONITORS_OPTIONS } from './index-ivnS3eWW.js';
+export { A as ACTION_OPTIONS, I as INSTRUMENTATION_RULE_OPTIONS, M as MONITORS_OPTIONS } from './index-CVH8Q8Sl.js';
 export { D as DESTINATION_CATEGORIES } from './index-Dqief9td.js';
-export { B as BUTTON_TEXTS, D as DEFAULT_DATA_STREAM_NAME, a as DISPLAY_TITLES, F as FORM_ALERTS } from './index-B9cvsYnj.js';
+export { B as BUTTON_TEXTS, D as DEFAULT_DATA_STREAM_NAME, a as DISPLAY_TITLES, F as FORM_ALERTS } from './index-mOgS3e5E.js';
 import 'react';
 import './types.js';
 import 'styled-components';

package/lib/containers/data-stream-drawer/index.d.ts

@@ -1,5 +1,5 @@
 import { type FC } from 'react';
-import type { DataStream } from '@/types';
+import { type DataStream } from '@/types';
 interface DataStreamDrawerProps {
     isOpen: boolean;
     onClose: () => void;

package/lib/containers/data-stream-form/index.d.ts

@@ -3,6 +3,7 @@ import type { DataStream } from '@/types';
 interface DataStreamFormProps {
     formData: DataStream;
     handleFormChange: (key: keyof DataStream, val: any) => void;
+    formErrors: Partial<Record<'name', string>>;
 }
 declare const DataStreamForm: FC<DataStreamFormProps>;
 export { DataStreamForm, type DataStreamFormProps };

package/lib/containers/destination-selection-form/destination-list/index.d.ts

@@ -1,5 +1,7 @@
 import { type FC } from 'react';
+import { type DestinationCategories } from '@/types';
 interface DestinationListProps {
+    categories: DestinationCategories;
     withDelete?: boolean;
 }
 declare const DestinationList: FC<DestinationListProps>;

package/lib/containers/setup-summary/index.d.ts

@@ -1,8 +1,10 @@
 import { type FC } from 'react';
+import type { DestinationCategories } from '@/types';
 interface SetupSummaryProps {
     onEditStream: () => void;
     onEditSources: () => void;
     onEditDestinations: () => void;
+    categories: DestinationCategories;
 }
 declare const SetupSummary: FC<SetupSummaryProps>;
 export { SetupSummary, type SetupSummaryProps };

package/lib/containers.js

@@ -1,24 +1,24 @@
 import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle, useMemo, memo, useContext, createContext, useCallback, useLayoutEffect, Fragment } from 'react';
 import styled, { css } from 'styled-components';
-import { T as Theme, h as usePendingStore, g as useNotificationStore, b as useDrawerStore, c as useEntityStore, A as ACTION_OPTIONS, k as getActionIcon, f as useModalStore, d as useFilterStore, M as MONITORS_OPTIONS, s as styleInject, i as useSelectedStore, e as useInstrumentStore, m as getInstrumentationRuleIcon, a as useDataStreamStore, l as getEntityId, j as useSetupStore, I as INSTRUMENTATION_RULE_OPTIONS, u as useDarkMode } from './index-ivnS3eWW.js';
-import { a as DISPLAY_TITLES, B as BUTTON_TEXTS, F as FORM_ALERTS, D as DEFAULT_DATA_STREAM_NAME } from './index-B9cvsYnj.js';
+import { T as Theme, h as usePendingStore, g as useNotificationStore, b as useDrawerStore, c as useEntityStore, A as ACTION_OPTIONS, k as getActionIcon, f as useModalStore, d as useFilterStore, M as MONITORS_OPTIONS, s as styleInject, i as useSelectedStore, e as useInstrumentStore, m as getInstrumentationRuleIcon, a as useDataStreamStore, l as getEntityId, j as useSetupStore, I as INSTRUMENTATION_RULE_OPTIONS, u as useDarkMode } from './index-CVH8Q8Sl.js';
+import { a as DISPLAY_TITLES, B as BUTTON_TEXTS, F as FORM_ALERTS } from './index-mOgS3e5E.js';
 import { ActionType, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, AddNodeTypes, EdgeTypes, FieldTypes, SignalType, CodeAttributesKeyTypes, HeadersCollectionKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType } from './types.js';
-import { f as DataCardFieldTypes, o as FieldLabel, C as Checkbox, n as FieldError, u as Input, w as InputTable, K as KeyValueInputsList, v as InputList, V as Text, O as Segment, L as SectionTitle, i as DocsButton, y as MonitorsCheckboxes, W as TextArea, j as Drawer, d as ConditionDetails, D as DataCard, a0 as FlexColumn, M as Modal, N as NavigationButtons, a4 as ModalBody, J as NotificationNote, a as AutocompleteInput, h as Divider, R as Status, $ as FlexRow, Y as Tooltip, r as IconWrapped, z as MonitorsIcons, a5 as TableContainer, a6 as TableTitleWrap, q as IconTitleBadge, a7 as TableWrap, x as InteractiveTable, a1 as CenterThis, G as NoDataFound, Z as TraceLoader, b as Badge, E as ExtendArrow, a2 as VerticalScroll, P as SelectionButton, B as Button, m as Dropdown, a8 as getDefaultExportFromCjs, F as FadeLoader, g as DataTab, Q as SkeletonLoader, X as Toggle, I as IconButton, A as AddButton$1, U as Stepper, e as DataCardFields, s as IconsNav, p as IconGroup } from './index-BxckQJom.js';
-import { i as isEmpty, s as safeJsonParse } from './index-BZS1ijMm.js';
-import { i as CheckCircledIcon, O as OdigosLogo } from './index-DuSmjoDs.js';
-import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, N as NotificationIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon } from './index-DR5ryS5d.js';
-import { u as useActionFormData, a as useClickNode, c as useDataStreamFormData, d as useDestinationFormData, b as useClickNotification, e as useSourceFormData, f as useSourceSelectionFormData } from './useSourceSelectionFormData-A5_zhn1C.js';
-import { d as useKeyDown, e as useOnClickOutside, u as useContainerSize, c as useInstrumentationRuleFormData, g as useTransition, f as useTimeAgo, a as useCopy } from './useTransition-9tDdAS9s.js';
-import { E as EditIcon } from './index-B3j_QWzh.js';
-import { T as TrashIcon, S as SearchIcon, P as PlusIcon$1, f as CheckIcon, A as ArrowIcon, a as CopyIcon, g as CrossIcon } from './index-DAbcw-wM.js';
-import { D as DeleteWarning, C as CancelWarning } from './index-rbphz5kH.js';
-import { m as mapConditions, b as getStatusIcon, c as capitalizeFirstLetter } from './index-C7YDojNh.js';
-import { f as filterActions, i as getConditionsBooleans, n as getEntityLabel, m as getEntityIcon, v as sleep$1, p as getPlatformIcon, q as getPlatformLabel, h as formatBytes, k as getContainersIcons, r as getValueForRange, l as getDestinationIcon, u as mapExportedSignals, g as filterSourcesByStream, e as filterSources, b as filterDestinationsByStream, a as filterDestinations, c as compareCondition, d as deepClone, o as getMetricForEntity, s as getWorkloadId, j as getContainersInstrumentedCount, t as isOverTime } from './index-cG2lNgzz.js';
+import { f as DataCardFieldTypes, o as FieldLabel, C as Checkbox, n as FieldError, u as Input, w as InputTable, K as KeyValueInputsList, v as InputList, V as Text, O as Segment, L as SectionTitle, i as DocsButton, y as MonitorsCheckboxes, W as TextArea, j as Drawer, d as ConditionDetails, D as DataCard, a0 as FlexColumn, M as Modal, N as NavigationButtons, a4 as ModalBody, J as NotificationNote, a as AutocompleteInput, h as Divider, R as Status, $ as FlexRow, Y as Tooltip, r as IconWrapped, z as MonitorsIcons, a5 as TableContainer, a6 as TableTitleWrap, q as IconTitleBadge, a7 as TableWrap, x as InteractiveTable, a1 as CenterThis, G as NoDataFound, Z as TraceLoader, b as Badge, E as ExtendArrow, a2 as VerticalScroll, P as SelectionButton, B as Button, m as Dropdown, a8 as getDefaultExportFromCjs, F as FadeLoader, g as DataTab, Q as SkeletonLoader, X as Toggle, A as AddButton$1, U as Stepper, I as IconButton, e as DataCardFields, s as IconsNav, p as IconGroup } from './index-BedCNcwV.js';
+import { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
+import { i as CheckCircledIcon, O as OdigosLogo } from './index-Do3CYz7N.js';
+import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, N as NotificationIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon } from './index-f8FRaVkE.js';
+import { u as useActionFormData, a as useClickNode, c as useDataStreamFormData, d as useDestinationFormData, b as useClickNotification, e as useSourceFormData, f as useSourceSelectionFormData } from './useSourceSelectionFormData-DiwzViqL.js';
+import { d as useKeyDown, e as useOnClickOutside, u as useContainerSize, c as useInstrumentationRuleFormData, g as useTransition, f as useTimeAgo, a as useCopy } from './useTransition-B0eagOib.js';
+import { E as EditIcon } from './index-BQQZyvRz.js';
+import { T as TrashIcon, S as SearchIcon, P as PlusIcon$1, f as CheckIcon, A as ArrowIcon, a as CopyIcon, g as CrossIcon } from './index-CNfdJ1X8.js';
+import { D as DeleteWarning, C as CancelWarning } from './index-CaAOgaiC.js';
+import { m as mapConditions, b as getStatusIcon, c as capitalizeFirstLetter } from './index-B_Gl6Qa6.js';
+import { f as filterActions, i as getConditionsBooleans, n as getEntityLabel, m as getEntityIcon, x as sleep$1, p as getPlatformIcon, q as getPlatformLabel, h as formatBytes, k as getContainersIcons, r as getValueForRange, l as getDestinationIcon, w as mapExportedSignals, g as filterSourcesByStream, e as filterSources, b as filterDestinationsByStream, a as filterDestinations, v as mapDestinationFieldsForDisplay, c as compareCondition, t as getYamlFieldsForDestination, d as deepClone, o as getMetricForEntity, s as getWorkloadId, j as getContainersInstrumentedCount, u as isOverTime } from './index-Iq7U_fzb.js';
 import { createPortal } from 'react-dom';
-import { N as NoteBackToSummary, E as EditButton } from './index-DeD-SIlN.js';
+import { N as NoteBackToSummary, E as EditButton } from './index-BjVl4-os.js';
 import { D as DESTINATION_CATEGORIES } from './index-Dqief9td.js';
-import { a6 as RulesIcon, a7 as SourcesIcon, a3 as ActionsIcon, a4 as DestinationsIcon } from './index-PfG5pvFK.js';
-import './index-7-KCQK-x.js';
+import { a6 as RulesIcon, a7 as SourcesIcon, a3 as ActionsIcon, a4 as DestinationsIcon } from './index-1N9wymEq.js';
+import './index-CnZlllYu.js';
 
 const buildCard$3 = (action) => {
     const { type, spec: { actionName, notes, signals, disabled, collectContainerAttributes, collectReplicaSetAttributes, collectWorkloadId, collectClusterId, labelsAttributes, annotationsAttributes, clusterAttributes, attributeNamesToDelete, renames, piiCategories, fallbackSamplingRatio, samplingPercentage, endpointsFilters, }, } = action;
@@ -13940,9 +13940,9 @@ const Container$d = styled.div `
   gap: 24px;
   padding: 4px;
 `;
-const DataStreamForm = ({ formData, handleFormChange }) => {
+const DataStreamForm = ({ formData, handleFormChange, formErrors }) => {
     return (React.createElement(Container$d, null,
-        React.createElement(Input, { name: 'name', title: DISPLAY_TITLES.STREAM_NAME, required: true, value: formData.name, onChange: ({ target: { value } }) => handleFormChange('name', value) })));
+        React.createElement(Input, { name: 'name', title: DISPLAY_TITLES.STREAM_NAME, placeholder: DISPLAY_TITLES.NAME_YOUR_STREAM_PLACEHOLDER, required: true, value: formData.name, onChange: ({ target: { value } }) => handleFormChange('name', value), errorMessage: formErrors['name'] })));
 };
 
 const FormContainer$3 = styled.div `
@@ -13956,7 +13956,7 @@ const DataStreamDrawer = ({ isOpen, onClose, dataStreamName, updateDataStream })
     const { dataStreams } = useDataStreamStore();
     const drawerRef = useRef(null);
     const [isFormDirty, setIsFormDirty] = useState(false);
-    const { formData, handleFormChange, resetFormData, loadFormWithDrawerItem } = useDataStreamFormData({ name: dataStreamName });
+    const { formData, handleFormChange, formErrors, validateForm, resetFormData, loadFormWithDrawerItem } = useDataStreamFormData({ name: dataStreamName });
     const thisItem = useMemo(() => {
         if (!isOpen)
             return null;
@@ -13977,13 +13977,15 @@ const DataStreamDrawer = ({ isOpen, onClose, dataStreamName, updateDataStream })
         onClose();
     };
     const handleSave = () => {
-        updateDataStream(dataStreamName, formData);
-        setIsFormDirty(false);
-        onClose();
+        if (validateForm({ withAlert: true, alertTitle: Crud.Update })) {
+            updateDataStream(dataStreamName, formData);
+            setIsFormDirty(false);
+            onClose();
+        }
     };
     return (React.createElement(OverviewDrawer, { ref: drawerRef, title: thisItem.name, icons: [DataStreamsIcon], hideEditTitleFromEdit: true, isEdit: true, isFormDirty: isFormDirty, onSave: handleSave, onCancel: handleCancel },
         React.createElement(FormContainer$3, null,
-            React.createElement(DataStreamForm, { formData: formData, handleFormChange: memoizedHandleFormChange }))));
+            React.createElement(DataStreamForm, { formData: formData, handleFormChange: memoizedHandleFormChange, formErrors: formErrors }))));
 };
 
 const RelativeContainer$1 = styled.div `
@@ -14023,7 +14025,9 @@ const SelectionRow = styled(FlexRow) `
 const Stretch = styled.div `
   width: 100%;
 `;
-const DataStreamSelect = ({ onClickNewDataStream, updateDataStream, deleteDataStream }) => {
+const DataStreamSelect = ({ 
+// onClickNewDataStream,
+updateDataStream, deleteDataStream, }) => {
     const theme = Theme.useTheme();
     const { dataStreams, selectedStreamName, setSelectedStreamName } = useDataStreamStore();
     const [popupOpen, setPopupOpen] = useState(false);
@@ -14038,11 +14042,7 @@ const DataStreamSelect = ({ onClickNewDataStream, updateDataStream, deleteDataSt
             React.createElement(SelectionButton, { label: name, isSelected: selectedStreamName === name, onClick: () => {
                     setSelectedStreamName(name);
                     setPopupOpen(false);
-                }, color: 'transparent', style: { width: '100%', justifyContent: 'flex-start' } })),
-        name !== DEFAULT_DATA_STREAM_NAME && (React.createElement(IconButton, { onClick: () => setDeleteOpenForDataStreamName(name), tooltip: BUTTON_TEXTS.DELETE },
-            React.createElement(TrashIcon, null))),
-        React.createElement(IconButton, { onClick: () => setEditOpenForDataStreamName(name), tooltip: BUTTON_TEXTS.EDIT },
-            React.createElement(EditIcon, null))))), [filteredDataStreams, selectedStreamName]);
+                }, color: 'transparent', style: { width: '100%', justifyContent: 'flex-start' } }))))), [filteredDataStreams, selectedStreamName]);
     return (React.createElement(React.Fragment, null,
         React.createElement(RelativeContainer$1, null,
             React.createElement(Container$c, { "$gap": 0 },
@@ -14052,9 +14052,7 @@ const DataStreamSelect = ({ onClickNewDataStream, updateDataStream, deleteDataSt
                         "Data Stream: ",
                         selectedStreamName),
                     React.createElement(ExtendArrow, { extend: popupOpen }),
-                    React.createElement(Badge, { label: dataStreams.length })),
-                React.createElement(Divider, { orientation: 'vertical', length: '32px', thickness: 2, margin: '0' }),
-                React.createElement(AddButton$1, { onClick: onClickNewDataStream, label: BUTTON_TEXTS.NEW })),
+                    React.createElement(Badge, { label: dataStreams.length }))),
             popupOpen && (React.createElement(AbsoluteContainer$1, { ref: containerRef },
                 React.createElement(SelectionMenuHeader, null,
                     React.createElement(Input, { placeholder: 'Search...', icon: SearchIcon, value: searchText, onChange: (e) => setSearchText(e.target.value) })),
@@ -14092,8 +14090,7 @@ const DataFlowActionsMenu = ({ addEntity, onClickNewDataStream, updateDataStream
 };
 
 const DataStreamSelectionForm = forwardRef(({ isModal, onClickSummary }, ref) => {
-    const { dataStreams, selectedStreamName } = useDataStreamStore();
-    const dataStreamOptions = useMemo(() => dataStreams.map(({ name }) => ({ label: name })), [dataStreams]);
+    const { selectedStreamName } = useDataStreamStore();
     const { formData, handleFormChange, formErrors, validateForm } = useDataStreamFormData({ name: selectedStreamName });
     useImperativeHandle(ref, () => ({
         validateForm,
@@ -14103,7 +14100,7 @@ const DataStreamSelectionForm = forwardRef(({ isModal, onClickSummary }, ref) =>
         React.createElement(FlexColumn, { "$gap": 24 },
             onClickSummary && React.createElement(NoteBackToSummary, { onClick: onClickSummary }),
             React.createElement(SectionTitle, { title: DISPLAY_TITLES.NAME_YOUR_STREAM, description: DISPLAY_TITLES.STREAM_DESCRIPTION }),
-            React.createElement(AutocompleteInput, { placeholder: DISPLAY_TITLES.NAME_YOUR_STREAM_PLACEHOLDER, required: true, autoFocus: true, options: dataStreamOptions, defaultText: formData['name'], onTextChange: (v) => handleFormChange('name', v), errorMessage: formErrors['name'] }))));
+            React.createElement(DataStreamForm, { formData: formData, handleFormChange: handleFormChange, formErrors: formErrors }))));
 });
 
 const buildMonitorsList = (exportedSignals) => Object.keys(exportedSignals)
@@ -14116,17 +14113,14 @@ const buildCard$2 = (destination, yamlFields) => {
         { title: DISPLAY_TITLES.TYPE, value: destinationType.type },
         { type: DataCardFieldTypes.Monitors, title: DISPLAY_TITLES.MONITORS, value: buildMonitorsList(exportedSignals) },
     ];
-    const parsedFields = safeJsonParse(fields, {});
-    const sortedParsedFields = yamlFields.map((field) => ({ key: field.name, value: parsedFields[field.name] ?? null })).filter((item) => item.value !== null) ||
-        Object.entries(parsedFields).map(([key, value]) => ({ key, value }));
-    sortedParsedFields.map(({ key, value }) => {
-        const { displayName, secret, componentProperties, hideFromReadData, customReadDataLabels } = yamlFields.find((field) => field.name === key) || {};
-        const shouldHide = !!hideFromReadData?.length
-            ? compareCondition(hideFromReadData, yamlFields.map((field) => ({ name: field.name, value: parsedFields[field.name] ?? null })))
-            : false;
+    const mappedFields = mapDestinationFieldsForDisplay(destination, yamlFields);
+    const mappedFieldsForConditionCompare = mappedFields.map((field) => ({ name: field.key, value: field.value }));
+    mappedFields.map(({ key, name, value }) => {
+        const { secret, componentProperties, hideFromReadData, customReadDataLabels } = yamlFields.find((field) => field.name === key) || {};
+        const shouldHide = !!hideFromReadData?.length ? compareCondition(hideFromReadData, mappedFieldsForConditionCompare) : false;
         if (!shouldHide) {
             const { type } = safeJsonParse(componentProperties, { type: '' });
-            const isSecret = (secret || type === 'password') && !!value.length ? new Array(10).fill('•').join('') : '';
+            const secretPlaceholder = (secret || type === 'password') && !!value.length ? new Array(10).fill('•').join('') : '';
             arr.push({ type: DataCardFieldTypes.Divider });
             if (!!customReadDataLabels?.length) {
                 customReadDataLabels.forEach(({ condition, ...custom }) => {
@@ -14140,8 +14134,8 @@ const buildCard$2 = (destination, yamlFields) => {
             }
             else {
                 arr.push({
-                    title: displayName || key,
-                    value: isSecret || value,
+                    title: name,
+                    value: secretPlaceholder || value,
                 });
             }
         }
@@ -14342,7 +14336,6 @@ const DestinationDrawer = ({ categories, updateDestination, deleteDestination, t
     const isOpen = drawerType !== EntityTypes.Destination;
     const [isEditing, setIsEditing] = useState(false);
     const [isFormDirty, setIsFormDirty] = useState(false);
-    // const [thisItem, setThisItem] = useState<Destination | undefined>(undefined)
     const { formData, formErrors, handleFormChange, resetFormData, validateForm, loadFormWithDrawerItem, yamlFields, setYamlFields, dynamicFields, setDynamicFields } = useDestinationFormData({
     // preLoadedFields: thisItem?.fields,
     // TODO: supportedSignals: thisDestination?.supportedSignals,
@@ -14354,19 +14347,7 @@ const DestinationDrawer = ({ categories, updateDestination, deleteDestination, t
         const found = destinationsByStream?.find((x) => x.id === drawerEntityId);
         if (!!found) {
             loadFormWithDrawerItem(found);
-            const fields = [];
-            const parsedCategories = JSON.parse(JSON.stringify(categories));
-            for (const category of parsedCategories) {
-                const autoFilledFields = safeJsonParse(found.fields, {});
-                const idx = category.items.findIndex((item) => item.type === found.destinationType.type);
-                if (idx !== -1) {
-                    fields.push(...category.items[idx].fields.map((field) => ({
-                        ...field,
-                        initialValue: autoFilledFields[field.name],
-                    })));
-                }
-            }
-            setYamlFields(fields);
+            setYamlFields(getYamlFieldsForDestination(categories, found));
         }
         return found;
     }, [isOpen, drawerEntityId, destinationsByStream]);
@@ -14689,21 +14670,21 @@ const Container$7 = styled.div `
   height: fit-content;
   overflow-y: scroll;
 `;
-const DestinationList = ({ withDelete }) => {
+const DestinationList = ({ categories, withDelete }) => {
     const { configuredDestinations, configuredDestinationsUpdateOnly } = useSetupStore();
     if (!configuredDestinations.length && !configuredDestinationsUpdateOnly.length) {
         return (React.createElement(CenterThis, null,
             React.createElement(NoDataFound, { title: 'No destinations', subTitle: 'Please add a destination' })));
     }
-    return (React.createElement(Container$7, null, configuredDestinations.concat(configuredDestinationsUpdateOnly).map((dest, idx) => (React.createElement(ListItem, { key: `configured-destination-${dest.destinationType.type}-${idx}`, "data-id": `configured-destination-${dest.destinationType.type}`, item: dest, isLastItem: configuredDestinations.length + configuredDestinationsUpdateOnly.length === 1, withDelete: withDelete })))));
+    return (React.createElement(Container$7, null, configuredDestinations.concat(configuredDestinationsUpdateOnly).map((dest, idx) => (React.createElement(ListItem, { key: `configured-destination-${dest.destinationType.type}-${idx}`, "data-id": `configured-destination-${dest.destinationType.type}`, item: dest, yamlFields: getYamlFieldsForDestination(categories, dest), isLastItem: configuredDestinations.length + configuredDestinationsUpdateOnly.length === 1, withDelete: withDelete })))));
 };
-const ListItem = ({ item, isLastItem, withDelete }) => {
+const ListItem = ({ item, yamlFields, isLastItem, withDelete }) => {
     const [deleteWarning, setDeleteWarning] = useState(false);
     const { icon, iconSrc } = getDestinationIcon(item.destinationType.type);
     const { removeConfiguredDestination, removeConfiguredDestinationUpdateOnly } = useSetupStore();
-    const mappedFields = useMemo(() => Object.entries(safeJsonParse(item.fields, {})).map(([k, v]) => ({ title: k, value: v })) || [], [item.fields]);
+    const mappedFields = useMemo(() => mapDestinationFieldsForDisplay(item, yamlFields).map((f) => ({ title: f.name, value: f.value })), [item, yamlFields]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(DataTab, { title: item.destinationType.displayName || item.name, subTitle: item.destinationType.type, iconProps: { icon, iconSrc }, visualProps: {
+        React.createElement(DataTab, { title: item.name || item.destinationType.displayName, subTitle: item.destinationType.type, iconProps: { icon, iconSrc }, visualProps: {
                 monitors: mapExportedSignals(item.exportedSignals),
                 monitorsWithLabels: true,
             }, extendableProps: {
@@ -14751,7 +14732,7 @@ const DestinationSelectionForm = ({ isSourcesListEmpty, goToSources, categories,
                     React.createElement(LargeAndWideAddButton, { variant: 'secondary', onClick: onOpen },
                         React.createElement(PlusIcon$1, null),
                         React.createElement(Text, { color: theme.colors.secondary, size: 14, decoration: 'underline', family: 'secondary' }, DISPLAY_TITLES.ADD_DESTINATION))),
-                React.createElement(DestinationList, { withDelete: true }))),
+                React.createElement(DestinationList, { categories: categories, withDelete: true }))),
         React.createElement(DestinationModal, { isOnboarding: true, categories: categories, potentialDestinations: potentialDestinations, updateDestination: () => { }, createDestination: () => { }, testConnection: testConnection })));
 };
 
@@ -15576,7 +15557,7 @@ const SourceList = ({ isModal = false, withInstances = true, filteredNamespacesA
             (isNamespaceSelected || !onSelectNamespace) &&
                 (hasSources ? (React.createElement(RelativeWrapper, { "$addPadding": !onSelectSource },
                     React.createElement(AbsoluteWrapper, null,
-                        React.createElement(Divider, { orientation: 'vertical', length: `${onlyOneSource ? 24 : (sources.length) * 34}px` })),
+                        React.createElement(Divider, { orientation: 'vertical', length: `${onlyOneSource ? 24 : sources.length * 34}px` })),
                     sources.map((source) => {
                         const isSourceSelected = onlySelectedSources.some(({ name }) => name === source.name);
                         return React.createElement(SourceRow, { key: `source-${source.name}`, withInstances: withInstances, source: source, namespace: namespace, isSelected: isSourceSelected, onSelect: onSelectSource });
@@ -15604,19 +15585,20 @@ const Container$3 = styled.div `
   height: fit-content;
   overflow-y: scroll;
 `;
-const SetupSummary = ({ onEditStream, onEditSources, onEditDestinations }) => {
-    const { selectedStreamName } = useDataStreamStore();
+const SetupSummary = ({ 
+// onEditStream,
+onEditSources, onEditDestinations, categories, }) => {
+    // const { selectedStreamName } = useDataStreamStore();
     const { configuredSources, configuredDestinations, configuredDestinationsUpdateOnly } = useSetupStore();
     const sourceCount = useMemo(() => Object.values(configuredSources).reduce((total, sourceList) => total + sourceList.filter((s) => s.selected).length, 0), [configuredSources]);
     return (React.createElement(ModalBody, { "$isNotModal": true },
         React.createElement(FlexColumn, { "$gap": 12 },
             React.createElement(SectionTitle, { title: DISPLAY_TITLES.SUMMARY, description: DISPLAY_TITLES.STREAM_CONFIRM }),
             React.createElement(Container$3, null,
-                React.createElement(DataCard, { title: DISPLAY_TITLES.STREAM_NAME, action: () => React.createElement(EditButton, { onClick: onEditStream }), data: [{ title: '', value: selectedStreamName }] }),
                 React.createElement(DataCard, { title: DISPLAY_TITLES.SELECTED_SOURCES, titleBadge: sourceCount, action: () => React.createElement(EditButton, { onClick: onEditSources }) },
                     React.createElement(SourceList, { filteredNamespacesAndSources: configuredSources, withInstances: false })),
                 React.createElement(DataCard, { title: DISPLAY_TITLES.SELECTED_DESTINATIONS, titleBadge: configuredDestinations.length + configuredDestinationsUpdateOnly.length, action: () => React.createElement(EditButton, { onClick: onEditDestinations }) },
-                    React.createElement(DestinationList, null))))));
+                    React.createElement(DestinationList, { categories: categories }))))));
 };
 
 var NavIconIds;

package/lib/functions/get-yaml-fields-for-destination/index.d.ts

@@ -0,0 +1,2 @@
+import { Destination, DestinationCategories, DestinationYamlProperties } from '@/types';
+export declare const getYamlFieldsForDestination: (categories: DestinationCategories, destination: Destination) => DestinationYamlProperties[];

package/lib/functions/index.d.ts

@@ -28,10 +28,13 @@ export * from './get-sse-target-from-id';
 export * from './get-status-icon';
 export * from './get-value-for-range';
 export * from './get-workload-id';
+export * from './get-yaml-fields-for-destination';
 export * from './is-emtpy';
+export * from './is-legal-k8s-label';
 export * from './is-over-time';
 export * from './is-time-elapsed';
 export * from './map-conditions';
+export * from './map-destination-fields-for-display';
 export * from './map-exported-signals';
 export * from './parse-json-string-to-pretty-string';
 export * from './remove-empty-values-from-object';

package/lib/functions/is-legal-k8s-label/index.d.ts

@@ -0,0 +1 @@
+export declare const isLegalK8sLabel: (name: string) => boolean;

package/lib/functions/map-destination-fields-for-display/index.d.ts

@@ -0,0 +1,6 @@
+import { Destination, DestinationYamlProperties } from '@/types';
+export declare const mapDestinationFieldsForDisplay: (destination: Destination, yamlFields: DestinationYamlProperties[]) => {
+    key: string;
+    name: string;
+    value: any;
+}[];

package/lib/functions.js

@@ -1,14 +1,14 @@
-export { c as capitalizeFirstLetter, f as flattenObjectKeys, g as getMonitorIcon, a as getProgrammingLanguageIcon, b as getStatusIcon, m as mapConditions, p as parseJsonStringToPrettyString, r as removeEmptyValuesFromObject, s as safeJsonStringify, d as splitCamelString } from './index-C7YDojNh.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, i as getConditionsBooleans, k as getContainersIcons, j as getContainersInstrumentedCount, l as getDestinationIcon, m as getEntityIcon, n as getEntityLabel, o as getMetricForEntity, p as getPlatformIcon, q as getPlatformLabel, r as getValueForRange, s as getWorkloadId, t as isOverTime, u as mapExportedSignals, v as sleep } from './index-cG2lNgzz.js';
-export { k as getActionIcon, l as getEntityId, m as getInstrumentationRuleIcon } from './index-ivnS3eWW.js';
-export { g as getIdFromSseTarget } from './index-7-KCQK-x.js';
+export { c as capitalizeFirstLetter, f as flattenObjectKeys, g as getMonitorIcon, a as getProgrammingLanguageIcon, b as getStatusIcon, m as mapConditions, p as parseJsonStringToPrettyString, r as removeEmptyValuesFromObject, s as safeJsonStringify, d as splitCamelString } from './index-B_Gl6Qa6.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, i as getConditionsBooleans, k as getContainersIcons, j as getContainersInstrumentedCount, l as getDestinationIcon, m as getEntityIcon, n as getEntityLabel, o as getMetricForEntity, p as getPlatformIcon, q as getPlatformLabel, r as getValueForRange, s as getWorkloadId, t as getYamlFieldsForDestination, u as isOverTime, v as mapDestinationFieldsForDisplay, w as mapExportedSignals, x as sleep } from './index-Iq7U_fzb.js';
+export { k as getActionIcon, l as getEntityId, m as getInstrumentationRuleIcon } from './index-CVH8Q8Sl.js';
+export { g as getIdFromSseTarget, i as isLegalK8sLabel } from './index-CnZlllYu.js';
 import { EntityTypes } from './types.js';
-export { i as isEmpty, s as safeJsonParse } from './index-BZS1ijMm.js';
+export { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
 import 'react';
 import 'styled-components';
-import './index-DuSmjoDs.js';
-import './index-B9cvsYnj.js';
-import './index-PfG5pvFK.js';
+import './index-Do3CYz7N.js';
+import './index-mOgS3e5E.js';
+import './index-1N9wymEq.js';
 
 const cleanObjectEmptyStringsValues = (obj) => {
     const cleanArray = (arr) => arr.filter((item) => {

package/lib/hooks.js

@@ -1,9 +1,9 @@
-export { u as useActionFormData, a as useClickNode, b as useClickNotification, c as useDataStreamFormData, d as useDestinationFormData, e as useSourceFormData, f as useSourceSelectionFormData } from './useSourceSelectionFormData-A5_zhn1C.js';
-export { u as useContainerSize, a as useCopy, b as useGenericForm, c as useInstrumentationRuleFormData, d as useKeyDown, e as useOnClickOutside, f as useTimeAgo, g as useTransition } from './useTransition-9tDdAS9s.js';
+export { u as useActionFormData, a as useClickNode, b as useClickNotification, c as useDataStreamFormData, d as useDestinationFormData, e as useSourceFormData, f as useSourceSelectionFormData } from './useSourceSelectionFormData-DiwzViqL.js';
+export { u as useContainerSize, a as useCopy, b as useGenericForm, c as useInstrumentationRuleFormData, d as useKeyDown, e as useOnClickOutside, f as useTimeAgo, g as useTransition } from './useTransition-B0eagOib.js';
 import './types.js';
-import './index-ivnS3eWW.js';
+import './index-CVH8Q8Sl.js';
 import 'react';
 import 'styled-components';
-import './index-B9cvsYnj.js';
-import './index-BZS1ijMm.js';
-import './index-7-KCQK-x.js';
+import './index-mOgS3e5E.js';
+import './index-BV85P9UP.js';
+import './index-CnZlllYu.js';

package/lib/icons.js

@@ -1,11 +1,11 @@
-import { T as Theme } from './index-ivnS3eWW.js';
-export { o as AddClusterInfoIcon, C as CodeAttributesIcon, D as DeleteAttributeIcon, H as HeadersCollectionIcon, n as ImageErrorIcon, K as K8sLogo, p as PayloadCollectionIcon, P as PiiMaskingIcon, R as RenameAttributeIcon, S as SamplerIcon } from './index-ivnS3eWW.js';
-export { C as CPlusPlusLogo, d as CSharpLogo, i as CheckCircledIcon, D as DotnetLogo, E as ElixirLogo, h as ErrorTriangleIcon, G as GoLogo, I as InfoIcon, J as JavaLogo, K as KafkaLogo, L as LogsIcon, g as MetricsIcon, M as MysqlLogo, N as NginxLogo, f as NodejsLogo, O as OdigosLogo, c as PhpLogo, P as PostgresLogo, e as PythonLogo, R as RedisLogo, b as RubyLogo, a as RustLogo, S as SwiftLogo, T as TracesIcon, W as WarningTriangleIcon } from './index-DuSmjoDs.js';
-export { C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, K as KeyIcon, N as NotificationIcon, O as OdigosLogoText, a as OverviewIcon, S as SlackLogo, T as TerminalIcon } from './index-DR5ryS5d.js';
-export { A as ArrowIcon, f as CheckIcon, C as CodeIcon, a as CopyIcon, g as CrossIcon, E as ExtendArrowIcon, d as EyeClosedIcon, e as EyeOpenIcon, L as ListIcon, M as MinusIcon, N as NoDataIcon, b as NotebookIcon, P as PlusIcon, S as SearchIcon, c as SortArrowsIcon, T as TrashIcon, X as XIcon } from './index-DAbcw-wM.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
+export { o as AddClusterInfoIcon, C as CodeAttributesIcon, D as DeleteAttributeIcon, H as HeadersCollectionIcon, n as ImageErrorIcon, K as K8sLogo, p as PayloadCollectionIcon, P as PiiMaskingIcon, R as RenameAttributeIcon, S as SamplerIcon } from './index-CVH8Q8Sl.js';
+export { C as CPlusPlusLogo, d as CSharpLogo, i as CheckCircledIcon, D as DotnetLogo, E as ElixirLogo, h as ErrorTriangleIcon, G as GoLogo, I as InfoIcon, J as JavaLogo, K as KafkaLogo, L as LogsIcon, g as MetricsIcon, M as MysqlLogo, N as NginxLogo, f as NodejsLogo, O as OdigosLogo, c as PhpLogo, P as PostgresLogo, e as PythonLogo, R as RedisLogo, b as RubyLogo, a as RustLogo, S as SwiftLogo, T as TracesIcon, W as WarningTriangleIcon } from './index-Do3CYz7N.js';
+export { C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, K as KeyIcon, N as NotificationIcon, O as OdigosLogoText, a as OverviewIcon, S as SlackLogo, T as TerminalIcon } from './index-f8FRaVkE.js';
+export { A as ArrowIcon, f as CheckIcon, C as CodeIcon, a as CopyIcon, g as CrossIcon, E as ExtendArrowIcon, d as EyeClosedIcon, e as EyeOpenIcon, L as ListIcon, M as MinusIcon, N as NoDataIcon, b as NotebookIcon, P as PlusIcon, S as SearchIcon, c as SortArrowsIcon, T as TrashIcon, X as XIcon } from './index-CNfdJ1X8.js';
 import React from 'react';
-export { E as EditIcon } from './index-B3j_QWzh.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-PfG5pvFK.js';
+export { E as EditIcon } from './index-BQQZyvRz.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-1N9wymEq.js';
 import './types.js';
 import 'styled-components';
 

package/lib/{index-PfG5pvFK.js → index-1N9wymEq.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
 
 const VmLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-B3j_QWzh.js → index-BQQZyvRz.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
 
 const EditIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-C7YDojNh.js → index-B_Gl6Qa6.js}

@@ -1,8 +1,8 @@
 import { ProgrammingLanguages, SignalType, StatusType } from './types.js';
 import 'react';
-import { n as ImageErrorIcon } from './index-ivnS3eWW.js';
+import { n as ImageErrorIcon } from './index-CVH8Q8Sl.js';
 import 'styled-components';
-import { K as KafkaLogo, R as RedisLogo, P as PostgresLogo, N as NginxLogo, M as MysqlLogo, E as ElixirLogo, S as SwiftLogo, a as RustLogo, b as RubyLogo, c as PhpLogo, C as CPlusPlusLogo, d as CSharpLogo, D as DotnetLogo, e as PythonLogo, f as NodejsLogo, G as GoLogo, J as JavaLogo, T as TracesIcon, g as MetricsIcon, L as LogsIcon, O as OdigosLogo, I as InfoIcon, W as WarningTriangleIcon, h as ErrorTriangleIcon, i as CheckCircledIcon } from './index-DuSmjoDs.js';
+import { K as KafkaLogo, R as RedisLogo, P as PostgresLogo, N as NginxLogo, M as MysqlLogo, E as ElixirLogo, S as SwiftLogo, a as RustLogo, b as RubyLogo, c as PhpLogo, C as CPlusPlusLogo, d as CSharpLogo, D as DotnetLogo, e as PythonLogo, f as NodejsLogo, G as GoLogo, J as JavaLogo, T as TracesIcon, g as MetricsIcon, L as LogsIcon, O as OdigosLogo, I as InfoIcon, W as WarningTriangleIcon, h as ErrorTriangleIcon, i as CheckCircledIcon } from './index-Do3CYz7N.js';
 
 const capitalizeFirstLetter = (string) => {
     return string.charAt(0).toUpperCase() + string.slice(1);

package/lib/{index-BxckQJom.js → index-BedCNcwV.js}

@@ -1,14 +1,14 @@
 import React, { useState, useEffect, useRef, forwardRef, createElement, useCallback, useMemo, Fragment } from 'react';
-import { T as Theme, n as ImageErrorIcon, M as MONITORS_OPTIONS } from './index-ivnS3eWW.js';
+import { T as Theme, n as ImageErrorIcon, M as MONITORS_OPTIONS } from './index-CVH8Q8Sl.js';
 import styled, { css } from 'styled-components';
-import { M as MinusIcon, f as CheckIcon, L as ListIcon, C as CodeIcon, E as ExtendArrowIcon, c as SortArrowsIcon, a as CopyIcon, b as NotebookIcon, X as XIcon, d as EyeClosedIcon, e as EyeOpenIcon, N as NoDataIcon, g as CrossIcon, S as SearchIcon, P as PlusIcon, T as TrashIcon, A as ArrowIcon } from './index-DAbcw-wM.js';
+import { M as MinusIcon, f as CheckIcon, L as ListIcon, C as CodeIcon, E as ExtendArrowIcon, c as SortArrowsIcon, a as CopyIcon, b as NotebookIcon, X as XIcon, d as EyeClosedIcon, e as EyeOpenIcon, N as NoDataIcon, g as CrossIcon, S as SearchIcon, P as PlusIcon, T as TrashIcon, A as ArrowIcon } from './index-CNfdJ1X8.js';
 import { StatusType, OtherStatus, SortDirection, ProgrammingLanguages } from './types.js';
-import { s as safeJsonParse, i as isEmpty } from './index-BZS1ijMm.js';
-import { B as BUTTON_TEXTS } from './index-B9cvsYnj.js';
-import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, c as capitalizeFirstLetter, g as getMonitorIcon, p as parseJsonStringToPrettyString, a as getProgrammingLanguageIcon, d as splitCamelString } from './index-C7YDojNh.js';
-import { u as useContainerSize, a as useCopy, g as useTransition, d as useKeyDown, e as useOnClickOutside } from './useTransition-9tDdAS9s.js';
+import { s as safeJsonParse, i as isEmpty } from './index-BV85P9UP.js';
+import { B as BUTTON_TEXTS } from './index-mOgS3e5E.js';
+import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, c as capitalizeFirstLetter, g as getMonitorIcon, p as parseJsonStringToPrettyString, a as getProgrammingLanguageIcon, d as splitCamelString } from './index-B_Gl6Qa6.js';
+import { u as useContainerSize, a as useCopy, g as useTransition, d as useKeyDown, e as useOnClickOutside } from './useTransition-B0eagOib.js';
 import ReactDOM from 'react-dom';
-import { I as InfoIcon } from './index-DuSmjoDs.js';
+import { I as InfoIcon } from './index-Do3CYz7N.js';
 
 const TextWrapper$2 = styled.div `
   color: ${({ $color, theme }) => $color || theme.text.secondary};

package/lib/{index-DeD-SIlN.js → index-BjVl4-os.js}

@@ -1,11 +1,11 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
-import { E as EditIcon } from './index-B3j_QWzh.js';
-import { B as BUTTON_TEXTS, a as DISPLAY_TITLES } from './index-B9cvsYnj.js';
-import { B as Button, V as Text, J as NotificationNote } from './index-BxckQJom.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
+import { E as EditIcon } from './index-BQQZyvRz.js';
+import { B as BUTTON_TEXTS, a as DISPLAY_TITLES } from './index-mOgS3e5E.js';
+import { B as Button, V as Text, J as NotificationNote } from './index-BedCNcwV.js';
 import { StatusType } from './types.js';
 import 'styled-components';
-import { I as InfoIcon } from './index-DuSmjoDs.js';
+import { I as InfoIcon } from './index-Do3CYz7N.js';
 
 const EditButton = ({ label, onClick, variant = 'tertiary', ...props }) => {
     const theme = Theme.useTheme();

package/lib/{index-DAbcw-wM.js → index-CNfdJ1X8.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
 
 const ArrowIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-ivnS3eWW.js → index-CVH8Q8Sl.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SignalType, ActionType, InstrumentationRuleType, EntityTypes } from './types.js';
+import { ActionType, SignalType, InstrumentationRuleType, EntityTypes } from './types.js';
 import { ThemeProvider, keyframes, useTheme } from 'styled-components';
 
 const createStoreImpl = (createState) => {
@@ -271,6 +271,97 @@ const useDrawerStore = create((set) => ({
     setDrawerEntityId: (value) => set({ drawerEntityId: value }),
 }));
 
+const AddClusterInfoIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M7.99992 11.3333V9.33333M7.99992 9.33333V7.33333M7.99992 9.33333H5.99992M7.99992 9.33333H9.99992M14.6666 8.26667V9.73333C14.6666 11.2268 14.6666 11.9735 14.3759 12.544C14.1203 13.0457 13.7123 13.4537 13.2106 13.7094C12.6401 14 11.8934 14 10.3999 14H5.59992C4.10645 14 3.35971 14 2.78928 13.7094C2.28751 13.4537 1.87956 13.0457 1.6239 12.544C1.33325 11.9735 1.33325 11.2268 1.33325 9.73333V6.26667C1.33325 4.77319 1.33325 4.02646 1.6239 3.45603C1.87956 2.95426 2.28751 2.54631 2.78928 2.29065C3.35971 2 4.10645 2 5.59992 2H5.81029C6.12336 2 6.2799 2 6.42199 2.04315C6.54778 2.08135 6.6648 2.14398 6.76636 2.22745C6.88108 2.32174 6.96791 2.45199 7.14157 2.71248L7.52493 3.28752C7.69859 3.54801 7.78542 3.67826 7.90014 3.77255C8.0017 3.85602 8.11873 3.91865 8.24452 3.95685C8.38661 4 8.54314 4 8.85621 4H10.3999C11.8934 4 12.6401 4 13.2106 4.29065C13.7123 4.54631 14.1203 4.95426 14.3759 5.45603C14.6666 6.02646 14.6666 6.77319 14.6666 8.26667Z' })));
+};
+
+const DeleteAttributeIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M10.6666 10.0007L8.66659 8.00065M8.66659 8.00065L6.66659 6.00065M8.66659 8.00065L10.6666 6.00065M8.66659 8.00065L6.66659 10.0007M4.41666 4.01431C3.33136 5.06369 2.34376 6.24491 1.47059 7.5384C1.37903 7.67404 1.33325 7.83734 1.33325 8.00065C1.33325 8.16396 1.37903 8.32726 1.47059 8.4629C2.34376 9.75639 3.33136 10.9376 4.41666 11.987C4.65522 12.2177 4.77449 12.333 4.94023 12.4319C5.07791 12.514 5.25728 12.5866 5.41337 12.6232C5.60126 12.6673 5.78723 12.6673 6.15917 12.6673H11.3332C12.2667 12.6673 12.7334 12.6673 13.0899 12.4857C13.4035 12.3259 13.6585 12.0709 13.8183 11.7573C13.9999 11.4008 13.9999 10.9341 13.9999 10.0007V6.00065C13.9999 5.06723 13.9999 4.60052 13.8183 4.244C13.6585 3.9304 13.4035 3.67543 13.0899 3.51564C12.7334 3.33398 12.2667 3.33398 11.3332 3.33398H6.15917C5.78723 3.33398 5.60126 3.33398 5.41337 3.37809C5.25728 3.41473 5.07791 3.48727 4.94023 3.56943C4.77449 3.66832 4.65522 3.78365 4.41666 4.01431Z' })));
+};
+
+const PiiMaskingIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M13.9486 9.71582C13.8698 9.87282 13.6245 9.98885 13.1338 10.2209L8.95284 12.198C8.60345 12.3632 8.42876 12.4458 8.24552 12.4783C8.08323 12.5071 7.91669 12.5071 7.7544 12.4783C7.57117 12.4458 7.39647 12.3632 7.04709 12.198L2.86615 10.2209C2.37544 9.98885 2.13008 9.87282 2.05135 9.71582M8.95288 9.19806L13.1338 7.22096C13.6245 6.98891 13.8699 6.87289 13.9486 6.71588C14.0171 6.57926 14.0171 6.42074 13.9486 6.28412C13.8699 6.12711 13.6245 6.01109 13.1338 5.77904L8.95288 3.80194C8.60349 3.63672 8.4288 3.55411 8.24556 3.5216C8.08327 3.4928 7.91673 3.4928 7.75444 3.5216C7.5712 3.55411 7.39651 3.63672 7.04712 3.80194L2.86618 5.77904C2.37547 6.01109 2.13012 6.12711 2.05139 6.28412C1.98287 6.42074 1.98287 6.57926 2.05139 6.71588C2.13012 6.87289 2.37547 6.98891 2.86618 7.22096L7.04712 9.19806C7.39651 9.36328 7.5712 9.44589 7.75444 9.4784C7.91673 9.5072 8.08327 9.5072 8.24556 9.4784C8.4288 9.44589 8.60349 9.36328 8.95288 9.19806Z' })));
+};
+
+const RenameAttributeIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M14.6666 8.00065V12.0007M1.33325 12.6673L4.23847 4.1055C4.40371 3.64283 4.84196 3.33398 5.33325 3.33398C5.83824 3.33398 6.28547 3.66 6.43999 4.14076L9.33325 12.6673M2.69054 8.66732H7.97596M14.6666 10.0007C14.6666 11.1052 13.7712 12.0007 12.6666 12.0007C11.562 12.0007 10.6666 11.1052 10.6666 10.0007C10.6666 8.89608 11.562 8.00065 12.6666 8.00065C13.7712 8.00065 14.6666 8.89608 14.6666 10.0007Z' })));
+};
+
+const SamplerIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M5.67367 5.67497H5.687M10.515 3.91532L12.1293 5.52965C13.0067 6.40707 13.4454 6.84578 13.6851 7.31618C14.1695 8.2669 14.1695 9.39207 13.6851 10.3428C13.4454 10.8132 13.0067 11.2519 12.1293 12.1293C11.2519 13.0067 10.8132 13.4454 10.3428 13.6851C9.39207 14.1695 8.2669 14.1695 7.31618 13.6851C6.84578 13.4454 6.40707 13.0067 5.52965 12.1293L3.91532 10.515C3.17317 9.77284 2.8021 9.40176 2.54483 8.96668C2.31682 8.58108 2.15521 8.15991 2.06673 7.72076C1.9669 7.22527 1.99448 6.70122 2.04965 5.65312L2.07845 5.10584C2.13195 4.0893 2.1587 3.58104 2.36993 3.18719C2.55598 2.84028 2.84028 2.55598 3.18719 2.36993C3.58104 2.1587 4.0893 2.13195 5.10584 2.07845L5.65312 2.04965C6.70122 1.99448 7.22527 1.9669 7.72076 2.06673C8.15991 2.15521 8.58108 2.31682 8.96668 2.54483C9.40176 2.8021 9.77284 3.17317 10.515 3.91532ZM6.32633 5.65853C6.32633 6.02672 6.02786 6.3252 5.65967 6.3252C5.29148 6.3252 4.993 6.02672 4.993 5.65853C4.993 5.29034 5.29148 4.99186 5.65967 4.99186C6.02786 4.99186 6.32633 5.29034 6.32633 5.65853Z' })));
+};
+
+const ImageErrorIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M17.2 21.0002L19.6 18.6002M19.6 18.6002L22 16.2002M19.6 18.6002L17.2 16.2002M19.6 18.6002L22 21.0002M22 12.1944V11C22 10.6449 22 10.3123 21.9989 10M13.1992 21H10C9.24401 21 8.59006 21 8.01712 20.9893M21.9989 10H21C19.607 10 18.9104 10 18.324 10.0603C12.9031 10.6176 8.61758 14.9031 8.06029 20.324C8.03963 20.5249 8.02605 20.7388 8.01712 20.9893M21.9989 10C21.9912 7.84993 21.9309 6.66397 21.455 5.73005C20.9757 4.78924 20.2108 4.02433 19.27 3.54497C18.2004 3 16.8003 3 14 3H10C7.19974 3 5.79961 3 4.73005 3.54497C3.78924 4.02433 3.02433 4.78924 2.54497 5.73005C2 6.79961 2 8.19974 2 11V13C2 15.8003 2 17.2004 2.54497 18.27C3.02433 19.2108 3.78924 19.9757 4.73005 20.455C5.51086 20.8529 6.46784 20.9603 8.01712 20.9893M7.5 9.5C6.94772 9.5 6.5 9.05228 6.5 8.5C6.5 7.94772 6.94772 7.5 7.5 7.5C8.05228 7.5 8.5 7.94772 8.5 8.5C8.5 9.05228 8.05228 9.5 7.5 9.5Z' })));
+};
+
+const K8sLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 20 20', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { fill: fill, d: 'M18.3862 11.574C18.3689 11.574 18.3689 11.574 18.3862 11.574H18.3689C18.3516 11.574 18.3343 11.574 18.3343 11.5562C18.2997 11.5562 18.2651 11.5384 18.2305 11.5384C18.1093 11.5206 18.0055 11.5028 17.9017 11.5028C17.8498 11.5028 17.7979 11.5028 17.7286 11.485H17.7113C17.3479 11.4494 17.0537 11.4138 16.7769 11.3248C16.6557 11.2714 16.6211 11.2002 16.5865 11.129C16.5865 11.1113 16.5692 11.1113 16.5692 11.0935L16.3442 11.0223C16.4481 10.2036 16.4135 9.3493 16.2231 8.51281C16.0328 7.67633 15.704 6.89324 15.254 6.18134L15.4271 6.02116V5.98556C15.4271 5.89658 15.4444 5.80759 15.5136 5.7186C15.7213 5.52283 15.9808 5.36265 16.2923 5.16688C16.3442 5.13128 16.3962 5.11349 16.4481 5.07789C16.5519 5.0245 16.6384 4.97111 16.7423 4.89992C16.7596 4.88212 16.7942 4.86432 16.8288 4.82873C16.8461 4.81093 16.8634 4.81093 16.8634 4.79313C17.1057 4.57956 17.1576 4.22361 16.9845 3.99224C16.898 3.86766 16.7423 3.79647 16.5865 3.79647C16.4481 3.79647 16.3269 3.84986 16.2058 3.93885C16.1885 3.95665 16.1885 3.95665 16.1712 3.97444C16.1366 3.99224 16.1193 4.02784 16.0847 4.04563C15.9981 4.13462 15.9289 4.20581 15.8597 4.2948C15.8251 4.33039 15.7905 4.38379 15.7386 4.41938C15.4963 4.68635 15.2713 4.89992 15.0464 5.06009C14.9945 5.09569 14.9425 5.11349 14.8906 5.11349C14.856 5.11349 14.8214 5.11349 14.7868 5.09569H14.7522L14.5445 5.23807C14.3196 4.9889 14.0773 4.77533 13.835 4.56176C12.7967 3.72528 11.5335 3.20915 10.2183 3.08457L10.201 2.8532C10.1837 2.8354 10.1837 2.8354 10.1664 2.81761C10.1145 2.76421 10.0452 2.71082 10.0279 2.58624C10.0106 2.30148 10.0452 1.98112 10.0799 1.62517V1.60737C10.0799 1.55398 10.0972 1.48279 10.1145 1.4294C10.1318 1.32261 10.1491 1.21583 10.1664 1.09125V0.984461V0.931068C10.1664 0.610713 9.92412 0.34375 9.62993 0.34375C9.49149 0.34375 9.35305 0.41494 9.24922 0.521725C9.1454 0.62851 9.09348 0.77089 9.09348 0.931068V0.966663V1.07345C9.09348 1.19803 9.11079 1.30482 9.1454 1.4116C9.1627 1.46499 9.1627 1.51839 9.18001 1.58958V1.60737C9.21461 1.96332 9.26653 2.28368 9.23192 2.56844C9.21461 2.69302 9.14539 2.74642 9.09348 2.79981C9.07617 2.81761 9.07617 2.81761 9.05887 2.8354L9.04156 3.06677C8.73008 3.10237 8.41859 3.13796 8.1071 3.20915C6.77462 3.51171 5.59789 4.20581 4.68073 5.20247L4.50768 5.07789H4.47307C4.43846 5.07789 4.40385 5.09569 4.36924 5.09569C4.31732 5.09569 4.26541 5.07789 4.21349 5.0423C3.98853 4.88212 3.76357 4.65075 3.5213 4.38379C3.48669 4.34819 3.45208 4.2948 3.40016 4.2592C3.33094 4.17022 3.26172 4.09903 3.1752 4.01004C3.15789 3.99224 3.12328 3.97444 3.08867 3.93885C3.07137 3.92105 3.05406 3.92105 3.05406 3.90325C2.95024 3.81427 2.8118 3.76087 2.67336 3.76087C2.51761 3.76087 2.36187 3.83206 2.27534 3.95665C2.10229 4.18801 2.15421 4.54397 2.39648 4.75754C2.41378 4.75754 2.41378 4.77533 2.43109 4.77533C2.4657 4.79313 2.483 4.82873 2.51761 4.84652C2.62144 4.91771 2.70797 4.97111 2.8118 5.0245C2.86371 5.0423 2.91563 5.07789 2.96754 5.11349C3.27903 5.30926 3.5386 5.46944 3.74626 5.66521C3.83279 5.7542 3.83279 5.84318 3.83279 5.93217V5.96777L4.00583 6.12794C3.97123 6.18134 3.93662 6.21693 3.91931 6.27033C3.05406 7.67633 2.72527 9.3315 2.95024 10.9689L2.72527 11.0401C2.72527 11.0579 2.70797 11.0579 2.70797 11.0757C2.67336 11.1468 2.62144 11.218 2.51761 11.2714C2.25804 11.3604 1.94655 11.396 1.58315 11.4316H1.56584C1.51393 11.4316 1.44471 11.4316 1.39279 11.4494C1.28896 11.4494 1.18513 11.4672 1.064 11.485C1.02939 11.485 0.99478 11.5028 0.96017 11.5028C0.942865 11.5028 0.925561 11.5028 0.908256 11.5206C0.596767 11.5918 0.406413 11.8943 0.458328 12.1791C0.510243 12.4283 0.735207 12.5884 1.01209 12.5884C1.064 12.5884 1.09861 12.5884 1.15052 12.5706C1.16783 12.5706 1.18513 12.5706 1.18513 12.5529C1.21974 12.5529 1.25435 12.5351 1.28896 12.5351C1.4101 12.4995 1.49662 12.4639 1.60045 12.4105C1.65237 12.3927 1.70428 12.3571 1.7562 12.3393H1.7735C2.10229 12.2147 2.39648 12.1079 2.67336 12.0723H2.70797C2.8118 12.0723 2.88102 12.1257 2.93293 12.1613C2.95024 12.1613 2.95024 12.1791 2.96754 12.1791L3.20981 12.1435C3.62513 13.4605 4.42115 14.6352 5.47675 15.4894C5.71902 15.6852 5.96129 15.8454 6.22086 16.0056L6.11703 16.2369C6.11703 16.2547 6.13434 16.2547 6.13434 16.2725C6.16895 16.3437 6.20356 16.4327 6.16895 16.5573C6.06512 16.8243 5.90938 17.0912 5.71902 17.3938V17.4116C5.68441 17.465 5.6498 17.5006 5.61519 17.554C5.54597 17.6429 5.49406 17.7319 5.42484 17.8387C5.40753 17.8565 5.39023 17.8921 5.37292 17.9277C5.37292 17.9455 5.35562 17.9633 5.35562 17.9633C5.21718 18.2659 5.32101 18.604 5.58058 18.7286C5.6498 18.7642 5.71902 18.782 5.78824 18.782C5.9959 18.782 6.20356 18.6396 6.30739 18.4438C6.30739 18.426 6.32469 18.4082 6.32469 18.4082C6.342 18.3726 6.3593 18.337 6.37661 18.3192C6.42852 18.1947 6.44583 18.1057 6.48044 17.9989C6.49774 17.9455 6.51505 17.8921 6.53235 17.8387C6.65349 17.4828 6.74001 17.198 6.89576 16.9488C6.96498 16.8421 7.0515 16.8243 7.12072 16.7887C7.13802 16.7887 7.13802 16.7887 7.15533 16.7709L7.27646 16.5395C8.03788 16.8421 8.86852 17.0022 9.69915 17.0022C10.201 17.0022 10.7201 16.9488 11.2047 16.8243C11.5162 16.7531 11.8104 16.6641 12.1045 16.5573L12.2084 16.7531C12.2257 16.7531 12.2257 16.7531 12.243 16.7709C12.3295 16.7887 12.3987 16.8243 12.4679 16.931C12.6064 17.1802 12.7102 17.4828 12.8313 17.8209V17.8387C12.8486 17.8921 12.866 17.9455 12.8833 17.9989C12.9179 18.1057 12.9352 18.2125 12.9871 18.3192C13.0044 18.3548 13.0217 18.3726 13.039 18.4082C13.039 18.426 13.0563 18.4438 13.0563 18.4438C13.1601 18.6574 13.3678 18.782 13.5755 18.782C13.6447 18.782 13.7139 18.7642 13.7831 18.7286C13.9042 18.6574 14.0081 18.5506 14.0427 18.4082C14.0773 18.2659 14.0773 18.1057 14.0081 17.9633C14.0081 17.9455 13.9908 17.9455 13.9908 17.9277C13.9735 17.8921 13.9562 17.8565 13.9389 17.8387C13.8869 17.7319 13.8177 17.6429 13.7485 17.554C13.7139 17.5006 13.6793 17.465 13.6447 17.4116V17.3938C13.4543 17.0912 13.2813 16.8243 13.1947 16.5573C13.1601 16.4327 13.1947 16.3615 13.212 16.2725C13.212 16.2547 13.2294 16.2547 13.2294 16.2369L13.1428 16.0234C14.06 15.4716 14.8387 14.6886 15.4271 13.7275C15.7386 13.2292 15.9808 12.6774 16.1539 12.1257L16.3615 12.1613C16.3788 12.1613 16.3788 12.1435 16.3962 12.1435C16.4654 12.1079 16.5173 12.0545 16.6211 12.0545H16.6557C16.9326 12.0901 17.2268 12.1969 17.5556 12.3215H17.5729C17.6248 12.3393 17.6767 12.3749 17.7286 12.3927C17.8325 12.4461 17.919 12.4817 18.0401 12.5173C18.0747 12.5173 18.1093 12.5351 18.1439 12.5351C18.1613 12.5351 18.1786 12.5351 18.1959 12.5529C18.2478 12.5706 18.2824 12.5706 18.3343 12.5706C18.5939 12.5706 18.8188 12.3927 18.8881 12.1613C18.8881 11.9477 18.6977 11.663 18.3862 11.574ZM10.374 10.7019L9.61263 11.0757L8.85121 10.7019L8.66086 9.86543L9.18001 9.18912H10.0279L10.5471 9.86543L10.374 10.7019ZM14.8906 8.85097C15.0291 9.45608 15.0637 10.0612 15.0118 10.6485L12.3641 9.86543C12.1218 9.79423 11.9834 9.54507 12.0353 9.2959C12.0526 9.22471 12.0872 9.15352 12.1391 9.10013L14.233 7.1602C14.5272 7.65853 14.7522 8.22805 14.8906 8.85097ZM13.4024 6.09235L11.1355 7.74752C10.9451 7.8721 10.6855 7.83651 10.5298 7.64073C10.4779 7.58734 10.4606 7.51615 10.4433 7.44496L10.2875 4.54397C11.4816 4.68635 12.5718 5.23807 13.4024 6.09235ZM8.38398 4.63295C8.57433 4.59736 8.74738 4.56176 8.93774 4.52617L8.78199 7.37377C8.76469 7.62294 8.57433 7.83651 8.31476 7.83651C8.24554 7.83651 8.15901 7.81871 8.1071 7.78311L5.80555 6.09235C6.51505 5.36265 7.3976 4.86432 8.38398 4.63295ZM4.97491 7.1602L7.03419 9.04674C7.22455 9.20692 7.24185 9.50947 7.08611 9.70525C7.03419 9.77644 6.96498 9.82983 6.87845 9.84763L4.19619 10.6485C4.09236 9.43828 4.35193 8.21026 4.97491 7.1602ZM4.50768 11.9833L7.25916 11.5028C7.48412 11.485 7.69178 11.6452 7.7437 11.8765C7.761 11.9833 7.761 12.0723 7.72639 12.1613L6.67079 14.7775C5.70172 14.1368 4.923 13.158 4.50768 11.9833ZM10.824 15.525C10.426 15.614 10.0279 15.6674 9.61263 15.6674C9.00696 15.6674 8.41859 15.5606 7.86483 15.3827L9.23192 12.8376C9.37036 12.6774 9.59532 12.6062 9.78568 12.713C9.8722 12.7664 9.94142 12.8376 9.99334 12.9088L11.3258 15.3827C11.1701 15.436 10.997 15.4716 10.824 15.525ZM14.1984 13.0512C13.7658 13.7631 13.1947 14.3326 12.5372 14.7775L11.4469 12.0901C11.395 11.8765 11.4816 11.6452 11.6892 11.5384C11.7584 11.5028 11.845 11.485 11.9315 11.485L14.7003 11.9655C14.5964 12.3571 14.4234 12.713 14.1984 13.0512Z' })));
+};
+
+const CodeAttributesIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeWidth: '1.5', strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M8 4C6.34315 4 5 5.19391 5 6.66667V9.33333C5 10.8061 3.65685 12 2 12C3.65685 12 5 13.1939 5 14.6667V17.3333C5 18.8061 6.34315 20 8 20M16 4C17.6569 4 19 5.19391 19 6.66667V9.33333C19 10.8061 20.3431 12 22 12C20.3431 12 19 13.1939 19 14.6667V17.3333C19 18.8061 17.6569 20 16 20M12.001 12H12M15.001 12H15M9.001 12H9' })));
+};
+
+const HeadersCollectionIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M15.9959 6.49365C15.9959 4.28451 14.205 2.49365 11.9959 2.49365C9.78673 2.49365 7.99587 4.28451 7.99587 6.49365C7.99587 8.00872 8.8382 9.32706 10.0801 10.0059L5.99587 17.4937M15.8474 20.8547C17.7058 22.0491 20.1806 21.5107 21.3749 19.6522C22.5692 17.7937 22.0308 15.3189 20.1724 14.1246C18.8978 13.3055 17.3333 13.3014 16.0908 13.9792L11.9997 6.49524M4.07185 13.9954C2.13343 15.055 1.42105 17.4855 2.48069 19.4239C3.54033 21.3623 5.97073 22.0747 7.90915 21.015C9.23855 20.2883 9.9913 18.9168 9.99125 17.5015L18.5205 17.4937' })));
+};
+
+const PayloadCollectionIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M7.99967 7.33333V11.3333M7.99967 11.3333C7.92987 11.3333 7.86007 11.31 7.80254 11.2634C7.37701 10.9186 6.99534 10.5224 6.66634 10.0837M7.99967 11.3333C8.06947 11.3333 8.13927 11.31 8.19681 11.2634C8.62234 10.9186 9.00401 10.5224 9.33301 10.0837M1.33301 6.26667C1.33301 4.77319 1.33301 4.02645 1.62365 3.45603C1.87932 2.95426 2.28727 2.54631 2.78903 2.29065C3.35946 2 4.1062 2 5.59967 2H5.81005C6.12312 2 6.27965 2 6.42174 2.04315C6.54753 2.08135 6.66455 2.14398 6.76614 2.22745C6.88081 2.32175 6.96767 2.45199 7.14134 2.71248L7.52467 3.28752C7.69834 3.54801 7.78521 3.67825 7.89987 3.77255C8.00147 3.85602 8.11847 3.91865 8.24427 3.95685C8.38634 4 8.54287 4 8.85594 4H10.3997C11.8931 4 12.6399 4 13.2103 4.29065C13.7121 4.54631 14.12 4.95426 14.3757 5.45603C14.6663 6.02645 14.6663 6.7732 14.6663 8.26667V9.73333C14.6663 11.2268 14.6663 11.9735 14.3757 12.544C14.12 13.0457 13.7121 13.4537 13.2103 13.7093C12.6399 14 11.8931 14 10.3997 14H5.59967C4.1062 14 3.35946 14 2.78903 13.7093C2.28727 13.4537 1.87932 13.0457 1.62365 12.544C1.33301 11.9735 1.33301 11.2268 1.33301 9.73333V6.26667Z' })));
+};
+
+const getActionIcon = (type) => {
+    const typeLowerCased = type?.toLowerCase();
+    const isSamplerCategory = typeLowerCased?.includes('sampler');
+    const isAttributesCategory = typeLowerCased === 'attributes';
+    if (isSamplerCategory)
+        return SamplerIcon;
+    if (isAttributesCategory)
+        return PiiMaskingIcon;
+    const LOGOS = {
+        [ActionType.K8sAttributes]: K8sLogo,
+        [ActionType.AddClusterInfo]: AddClusterInfoIcon,
+        [ActionType.DeleteAttributes]: DeleteAttributeIcon,
+        [ActionType.PiiMasking]: PiiMaskingIcon,
+        [ActionType.RenameAttributes]: RenameAttributeIcon,
+        [ActionType.ErrorSampler]: SamplerIcon,
+        [ActionType.ProbabilisticSampler]: SamplerIcon,
+        [ActionType.LatencySampler]: SamplerIcon,
+    };
+    return LOGOS[type] || ImageErrorIcon;
+};
+
 const ACTION_OPTIONS = [
     {
         label: 'Attributes',
@@ -358,6 +449,16 @@ const ACTION_OPTIONS = [
     },
 ];
 
+const getInstrumentationRuleIcon = (type) => {
+    const LOGOS = {
+        [InstrumentationRuleType.CodeAttributes]: CodeAttributesIcon,
+        [InstrumentationRuleType.HeadersCollection]: HeadersCollectionIcon,
+        [InstrumentationRuleType.PayloadCollection]: PayloadCollectionIcon,
+        [InstrumentationRuleType.UnknownType]: ImageErrorIcon,
+    };
+    return LOGOS[type] || ImageErrorIcon;
+};
+
 const INSTRUMENTATION_RULE_OPTIONS = [
     {
         type: InstrumentationRuleType.CodeAttributes,
@@ -400,97 +501,6 @@ const MONITORS_OPTIONS = [
     },
 ];
 
-const AddClusterInfoIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M7.99992 11.3333V9.33333M7.99992 9.33333V7.33333M7.99992 9.33333H5.99992M7.99992 9.33333H9.99992M14.6666 8.26667V9.73333C14.6666 11.2268 14.6666 11.9735 14.3759 12.544C14.1203 13.0457 13.7123 13.4537 13.2106 13.7094C12.6401 14 11.8934 14 10.3999 14H5.59992C4.10645 14 3.35971 14 2.78928 13.7094C2.28751 13.4537 1.87956 13.0457 1.6239 12.544C1.33325 11.9735 1.33325 11.2268 1.33325 9.73333V6.26667C1.33325 4.77319 1.33325 4.02646 1.6239 3.45603C1.87956 2.95426 2.28751 2.54631 2.78928 2.29065C3.35971 2 4.10645 2 5.59992 2H5.81029C6.12336 2 6.2799 2 6.42199 2.04315C6.54778 2.08135 6.6648 2.14398 6.76636 2.22745C6.88108 2.32174 6.96791 2.45199 7.14157 2.71248L7.52493 3.28752C7.69859 3.54801 7.78542 3.67826 7.90014 3.77255C8.0017 3.85602 8.11873 3.91865 8.24452 3.95685C8.38661 4 8.54314 4 8.85621 4H10.3999C11.8934 4 12.6401 4 13.2106 4.29065C13.7123 4.54631 14.1203 4.95426 14.3759 5.45603C14.6666 6.02646 14.6666 6.77319 14.6666 8.26667Z' })));
-};
-
-const DeleteAttributeIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M10.6666 10.0007L8.66659 8.00065M8.66659 8.00065L6.66659 6.00065M8.66659 8.00065L10.6666 6.00065M8.66659 8.00065L6.66659 10.0007M4.41666 4.01431C3.33136 5.06369 2.34376 6.24491 1.47059 7.5384C1.37903 7.67404 1.33325 7.83734 1.33325 8.00065C1.33325 8.16396 1.37903 8.32726 1.47059 8.4629C2.34376 9.75639 3.33136 10.9376 4.41666 11.987C4.65522 12.2177 4.77449 12.333 4.94023 12.4319C5.07791 12.514 5.25728 12.5866 5.41337 12.6232C5.60126 12.6673 5.78723 12.6673 6.15917 12.6673H11.3332C12.2667 12.6673 12.7334 12.6673 13.0899 12.4857C13.4035 12.3259 13.6585 12.0709 13.8183 11.7573C13.9999 11.4008 13.9999 10.9341 13.9999 10.0007V6.00065C13.9999 5.06723 13.9999 4.60052 13.8183 4.244C13.6585 3.9304 13.4035 3.67543 13.0899 3.51564C12.7334 3.33398 12.2667 3.33398 11.3332 3.33398H6.15917C5.78723 3.33398 5.60126 3.33398 5.41337 3.37809C5.25728 3.41473 5.07791 3.48727 4.94023 3.56943C4.77449 3.66832 4.65522 3.78365 4.41666 4.01431Z' })));
-};
-
-const PiiMaskingIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M13.9486 9.71582C13.8698 9.87282 13.6245 9.98885 13.1338 10.2209L8.95284 12.198C8.60345 12.3632 8.42876 12.4458 8.24552 12.4783C8.08323 12.5071 7.91669 12.5071 7.7544 12.4783C7.57117 12.4458 7.39647 12.3632 7.04709 12.198L2.86615 10.2209C2.37544 9.98885 2.13008 9.87282 2.05135 9.71582M8.95288 9.19806L13.1338 7.22096C13.6245 6.98891 13.8699 6.87289 13.9486 6.71588C14.0171 6.57926 14.0171 6.42074 13.9486 6.28412C13.8699 6.12711 13.6245 6.01109 13.1338 5.77904L8.95288 3.80194C8.60349 3.63672 8.4288 3.55411 8.24556 3.5216C8.08327 3.4928 7.91673 3.4928 7.75444 3.5216C7.5712 3.55411 7.39651 3.63672 7.04712 3.80194L2.86618 5.77904C2.37547 6.01109 2.13012 6.12711 2.05139 6.28412C1.98287 6.42074 1.98287 6.57926 2.05139 6.71588C2.13012 6.87289 2.37547 6.98891 2.86618 7.22096L7.04712 9.19806C7.39651 9.36328 7.5712 9.44589 7.75444 9.4784C7.91673 9.5072 8.08327 9.5072 8.24556 9.4784C8.4288 9.44589 8.60349 9.36328 8.95288 9.19806Z' })));
-};
-
-const RenameAttributeIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M14.6666 8.00065V12.0007M1.33325 12.6673L4.23847 4.1055C4.40371 3.64283 4.84196 3.33398 5.33325 3.33398C5.83824 3.33398 6.28547 3.66 6.43999 4.14076L9.33325 12.6673M2.69054 8.66732H7.97596M14.6666 10.0007C14.6666 11.1052 13.7712 12.0007 12.6666 12.0007C11.562 12.0007 10.6666 11.1052 10.6666 10.0007C10.6666 8.89608 11.562 8.00065 12.6666 8.00065C13.7712 8.00065 14.6666 8.89608 14.6666 10.0007Z' })));
-};
-
-const SamplerIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M5.67367 5.67497H5.687M10.515 3.91532L12.1293 5.52965C13.0067 6.40707 13.4454 6.84578 13.6851 7.31618C14.1695 8.2669 14.1695 9.39207 13.6851 10.3428C13.4454 10.8132 13.0067 11.2519 12.1293 12.1293C11.2519 13.0067 10.8132 13.4454 10.3428 13.6851C9.39207 14.1695 8.2669 14.1695 7.31618 13.6851C6.84578 13.4454 6.40707 13.0067 5.52965 12.1293L3.91532 10.515C3.17317 9.77284 2.8021 9.40176 2.54483 8.96668C2.31682 8.58108 2.15521 8.15991 2.06673 7.72076C1.9669 7.22527 1.99448 6.70122 2.04965 5.65312L2.07845 5.10584C2.13195 4.0893 2.1587 3.58104 2.36993 3.18719C2.55598 2.84028 2.84028 2.55598 3.18719 2.36993C3.58104 2.1587 4.0893 2.13195 5.10584 2.07845L5.65312 2.04965C6.70122 1.99448 7.22527 1.9669 7.72076 2.06673C8.15991 2.15521 8.58108 2.31682 8.96668 2.54483C9.40176 2.8021 9.77284 3.17317 10.515 3.91532ZM6.32633 5.65853C6.32633 6.02672 6.02786 6.3252 5.65967 6.3252C5.29148 6.3252 4.993 6.02672 4.993 5.65853C4.993 5.29034 5.29148 4.99186 5.65967 4.99186C6.02786 4.99186 6.32633 5.29034 6.32633 5.65853Z' })));
-};
-
-const ImageErrorIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M17.2 21.0002L19.6 18.6002M19.6 18.6002L22 16.2002M19.6 18.6002L17.2 16.2002M19.6 18.6002L22 21.0002M22 12.1944V11C22 10.6449 22 10.3123 21.9989 10M13.1992 21H10C9.24401 21 8.59006 21 8.01712 20.9893M21.9989 10H21C19.607 10 18.9104 10 18.324 10.0603C12.9031 10.6176 8.61758 14.9031 8.06029 20.324C8.03963 20.5249 8.02605 20.7388 8.01712 20.9893M21.9989 10C21.9912 7.84993 21.9309 6.66397 21.455 5.73005C20.9757 4.78924 20.2108 4.02433 19.27 3.54497C18.2004 3 16.8003 3 14 3H10C7.19974 3 5.79961 3 4.73005 3.54497C3.78924 4.02433 3.02433 4.78924 2.54497 5.73005C2 6.79961 2 8.19974 2 11V13C2 15.8003 2 17.2004 2.54497 18.27C3.02433 19.2108 3.78924 19.9757 4.73005 20.455C5.51086 20.8529 6.46784 20.9603 8.01712 20.9893M7.5 9.5C6.94772 9.5 6.5 9.05228 6.5 8.5C6.5 7.94772 6.94772 7.5 7.5 7.5C8.05228 7.5 8.5 7.94772 8.5 8.5C8.5 9.05228 8.05228 9.5 7.5 9.5Z' })));
-};
-
-const K8sLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 20 20', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { fill: fill, d: 'M18.3862 11.574C18.3689 11.574 18.3689 11.574 18.3862 11.574H18.3689C18.3516 11.574 18.3343 11.574 18.3343 11.5562C18.2997 11.5562 18.2651 11.5384 18.2305 11.5384C18.1093 11.5206 18.0055 11.5028 17.9017 11.5028C17.8498 11.5028 17.7979 11.5028 17.7286 11.485H17.7113C17.3479 11.4494 17.0537 11.4138 16.7769 11.3248C16.6557 11.2714 16.6211 11.2002 16.5865 11.129C16.5865 11.1113 16.5692 11.1113 16.5692 11.0935L16.3442 11.0223C16.4481 10.2036 16.4135 9.3493 16.2231 8.51281C16.0328 7.67633 15.704 6.89324 15.254 6.18134L15.4271 6.02116V5.98556C15.4271 5.89658 15.4444 5.80759 15.5136 5.7186C15.7213 5.52283 15.9808 5.36265 16.2923 5.16688C16.3442 5.13128 16.3962 5.11349 16.4481 5.07789C16.5519 5.0245 16.6384 4.97111 16.7423 4.89992C16.7596 4.88212 16.7942 4.86432 16.8288 4.82873C16.8461 4.81093 16.8634 4.81093 16.8634 4.79313C17.1057 4.57956 17.1576 4.22361 16.9845 3.99224C16.898 3.86766 16.7423 3.79647 16.5865 3.79647C16.4481 3.79647 16.3269 3.84986 16.2058 3.93885C16.1885 3.95665 16.1885 3.95665 16.1712 3.97444C16.1366 3.99224 16.1193 4.02784 16.0847 4.04563C15.9981 4.13462 15.9289 4.20581 15.8597 4.2948C15.8251 4.33039 15.7905 4.38379 15.7386 4.41938C15.4963 4.68635 15.2713 4.89992 15.0464 5.06009C14.9945 5.09569 14.9425 5.11349 14.8906 5.11349C14.856 5.11349 14.8214 5.11349 14.7868 5.09569H14.7522L14.5445 5.23807C14.3196 4.9889 14.0773 4.77533 13.835 4.56176C12.7967 3.72528 11.5335 3.20915 10.2183 3.08457L10.201 2.8532C10.1837 2.8354 10.1837 2.8354 10.1664 2.81761C10.1145 2.76421 10.0452 2.71082 10.0279 2.58624C10.0106 2.30148 10.0452 1.98112 10.0799 1.62517V1.60737C10.0799 1.55398 10.0972 1.48279 10.1145 1.4294C10.1318 1.32261 10.1491 1.21583 10.1664 1.09125V0.984461V0.931068C10.1664 0.610713 9.92412 0.34375 9.62993 0.34375C9.49149 0.34375 9.35305 0.41494 9.24922 0.521725C9.1454 0.62851 9.09348 0.77089 9.09348 0.931068V0.966663V1.07345C9.09348 1.19803 9.11079 1.30482 9.1454 1.4116C9.1627 1.46499 9.1627 1.51839 9.18001 1.58958V1.60737C9.21461 1.96332 9.26653 2.28368 9.23192 2.56844C9.21461 2.69302 9.14539 2.74642 9.09348 2.79981C9.07617 2.81761 9.07617 2.81761 9.05887 2.8354L9.04156 3.06677C8.73008 3.10237 8.41859 3.13796 8.1071 3.20915C6.77462 3.51171 5.59789 4.20581 4.68073 5.20247L4.50768 5.07789H4.47307C4.43846 5.07789 4.40385 5.09569 4.36924 5.09569C4.31732 5.09569 4.26541 5.07789 4.21349 5.0423C3.98853 4.88212 3.76357 4.65075 3.5213 4.38379C3.48669 4.34819 3.45208 4.2948 3.40016 4.2592C3.33094 4.17022 3.26172 4.09903 3.1752 4.01004C3.15789 3.99224 3.12328 3.97444 3.08867 3.93885C3.07137 3.92105 3.05406 3.92105 3.05406 3.90325C2.95024 3.81427 2.8118 3.76087 2.67336 3.76087C2.51761 3.76087 2.36187 3.83206 2.27534 3.95665C2.10229 4.18801 2.15421 4.54397 2.39648 4.75754C2.41378 4.75754 2.41378 4.77533 2.43109 4.77533C2.4657 4.79313 2.483 4.82873 2.51761 4.84652C2.62144 4.91771 2.70797 4.97111 2.8118 5.0245C2.86371 5.0423 2.91563 5.07789 2.96754 5.11349C3.27903 5.30926 3.5386 5.46944 3.74626 5.66521C3.83279 5.7542 3.83279 5.84318 3.83279 5.93217V5.96777L4.00583 6.12794C3.97123 6.18134 3.93662 6.21693 3.91931 6.27033C3.05406 7.67633 2.72527 9.3315 2.95024 10.9689L2.72527 11.0401C2.72527 11.0579 2.70797 11.0579 2.70797 11.0757C2.67336 11.1468 2.62144 11.218 2.51761 11.2714C2.25804 11.3604 1.94655 11.396 1.58315 11.4316H1.56584C1.51393 11.4316 1.44471 11.4316 1.39279 11.4494C1.28896 11.4494 1.18513 11.4672 1.064 11.485C1.02939 11.485 0.99478 11.5028 0.96017 11.5028C0.942865 11.5028 0.925561 11.5028 0.908256 11.5206C0.596767 11.5918 0.406413 11.8943 0.458328 12.1791C0.510243 12.4283 0.735207 12.5884 1.01209 12.5884C1.064 12.5884 1.09861 12.5884 1.15052 12.5706C1.16783 12.5706 1.18513 12.5706 1.18513 12.5529C1.21974 12.5529 1.25435 12.5351 1.28896 12.5351C1.4101 12.4995 1.49662 12.4639 1.60045 12.4105C1.65237 12.3927 1.70428 12.3571 1.7562 12.3393H1.7735C2.10229 12.2147 2.39648 12.1079 2.67336 12.0723H2.70797C2.8118 12.0723 2.88102 12.1257 2.93293 12.1613C2.95024 12.1613 2.95024 12.1791 2.96754 12.1791L3.20981 12.1435C3.62513 13.4605 4.42115 14.6352 5.47675 15.4894C5.71902 15.6852 5.96129 15.8454 6.22086 16.0056L6.11703 16.2369C6.11703 16.2547 6.13434 16.2547 6.13434 16.2725C6.16895 16.3437 6.20356 16.4327 6.16895 16.5573C6.06512 16.8243 5.90938 17.0912 5.71902 17.3938V17.4116C5.68441 17.465 5.6498 17.5006 5.61519 17.554C5.54597 17.6429 5.49406 17.7319 5.42484 17.8387C5.40753 17.8565 5.39023 17.8921 5.37292 17.9277C5.37292 17.9455 5.35562 17.9633 5.35562 17.9633C5.21718 18.2659 5.32101 18.604 5.58058 18.7286C5.6498 18.7642 5.71902 18.782 5.78824 18.782C5.9959 18.782 6.20356 18.6396 6.30739 18.4438C6.30739 18.426 6.32469 18.4082 6.32469 18.4082C6.342 18.3726 6.3593 18.337 6.37661 18.3192C6.42852 18.1947 6.44583 18.1057 6.48044 17.9989C6.49774 17.9455 6.51505 17.8921 6.53235 17.8387C6.65349 17.4828 6.74001 17.198 6.89576 16.9488C6.96498 16.8421 7.0515 16.8243 7.12072 16.7887C7.13802 16.7887 7.13802 16.7887 7.15533 16.7709L7.27646 16.5395C8.03788 16.8421 8.86852 17.0022 9.69915 17.0022C10.201 17.0022 10.7201 16.9488 11.2047 16.8243C11.5162 16.7531 11.8104 16.6641 12.1045 16.5573L12.2084 16.7531C12.2257 16.7531 12.2257 16.7531 12.243 16.7709C12.3295 16.7887 12.3987 16.8243 12.4679 16.931C12.6064 17.1802 12.7102 17.4828 12.8313 17.8209V17.8387C12.8486 17.8921 12.866 17.9455 12.8833 17.9989C12.9179 18.1057 12.9352 18.2125 12.9871 18.3192C13.0044 18.3548 13.0217 18.3726 13.039 18.4082C13.039 18.426 13.0563 18.4438 13.0563 18.4438C13.1601 18.6574 13.3678 18.782 13.5755 18.782C13.6447 18.782 13.7139 18.7642 13.7831 18.7286C13.9042 18.6574 14.0081 18.5506 14.0427 18.4082C14.0773 18.2659 14.0773 18.1057 14.0081 17.9633C14.0081 17.9455 13.9908 17.9455 13.9908 17.9277C13.9735 17.8921 13.9562 17.8565 13.9389 17.8387C13.8869 17.7319 13.8177 17.6429 13.7485 17.554C13.7139 17.5006 13.6793 17.465 13.6447 17.4116V17.3938C13.4543 17.0912 13.2813 16.8243 13.1947 16.5573C13.1601 16.4327 13.1947 16.3615 13.212 16.2725C13.212 16.2547 13.2294 16.2547 13.2294 16.2369L13.1428 16.0234C14.06 15.4716 14.8387 14.6886 15.4271 13.7275C15.7386 13.2292 15.9808 12.6774 16.1539 12.1257L16.3615 12.1613C16.3788 12.1613 16.3788 12.1435 16.3962 12.1435C16.4654 12.1079 16.5173 12.0545 16.6211 12.0545H16.6557C16.9326 12.0901 17.2268 12.1969 17.5556 12.3215H17.5729C17.6248 12.3393 17.6767 12.3749 17.7286 12.3927C17.8325 12.4461 17.919 12.4817 18.0401 12.5173C18.0747 12.5173 18.1093 12.5351 18.1439 12.5351C18.1613 12.5351 18.1786 12.5351 18.1959 12.5529C18.2478 12.5706 18.2824 12.5706 18.3343 12.5706C18.5939 12.5706 18.8188 12.3927 18.8881 12.1613C18.8881 11.9477 18.6977 11.663 18.3862 11.574ZM10.374 10.7019L9.61263 11.0757L8.85121 10.7019L8.66086 9.86543L9.18001 9.18912H10.0279L10.5471 9.86543L10.374 10.7019ZM14.8906 8.85097C15.0291 9.45608 15.0637 10.0612 15.0118 10.6485L12.3641 9.86543C12.1218 9.79423 11.9834 9.54507 12.0353 9.2959C12.0526 9.22471 12.0872 9.15352 12.1391 9.10013L14.233 7.1602C14.5272 7.65853 14.7522 8.22805 14.8906 8.85097ZM13.4024 6.09235L11.1355 7.74752C10.9451 7.8721 10.6855 7.83651 10.5298 7.64073C10.4779 7.58734 10.4606 7.51615 10.4433 7.44496L10.2875 4.54397C11.4816 4.68635 12.5718 5.23807 13.4024 6.09235ZM8.38398 4.63295C8.57433 4.59736 8.74738 4.56176 8.93774 4.52617L8.78199 7.37377C8.76469 7.62294 8.57433 7.83651 8.31476 7.83651C8.24554 7.83651 8.15901 7.81871 8.1071 7.78311L5.80555 6.09235C6.51505 5.36265 7.3976 4.86432 8.38398 4.63295ZM4.97491 7.1602L7.03419 9.04674C7.22455 9.20692 7.24185 9.50947 7.08611 9.70525C7.03419 9.77644 6.96498 9.82983 6.87845 9.84763L4.19619 10.6485C4.09236 9.43828 4.35193 8.21026 4.97491 7.1602ZM4.50768 11.9833L7.25916 11.5028C7.48412 11.485 7.69178 11.6452 7.7437 11.8765C7.761 11.9833 7.761 12.0723 7.72639 12.1613L6.67079 14.7775C5.70172 14.1368 4.923 13.158 4.50768 11.9833ZM10.824 15.525C10.426 15.614 10.0279 15.6674 9.61263 15.6674C9.00696 15.6674 8.41859 15.5606 7.86483 15.3827L9.23192 12.8376C9.37036 12.6774 9.59532 12.6062 9.78568 12.713C9.8722 12.7664 9.94142 12.8376 9.99334 12.9088L11.3258 15.3827C11.1701 15.436 10.997 15.4716 10.824 15.525ZM14.1984 13.0512C13.7658 13.7631 13.1947 14.3326 12.5372 14.7775L11.4469 12.0901C11.395 11.8765 11.4816 11.6452 11.6892 11.5384C11.7584 11.5028 11.845 11.485 11.9315 11.485L14.7003 11.9655C14.5964 12.3571 14.4234 12.713 14.1984 13.0512Z' })));
-};
-
-const CodeAttributesIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeWidth: '1.5', strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M8 4C6.34315 4 5 5.19391 5 6.66667V9.33333C5 10.8061 3.65685 12 2 12C3.65685 12 5 13.1939 5 14.6667V17.3333C5 18.8061 6.34315 20 8 20M16 4C17.6569 4 19 5.19391 19 6.66667V9.33333C19 10.8061 20.3431 12 22 12C20.3431 12 19 13.1939 19 14.6667V17.3333C19 18.8061 17.6569 20 16 20M12.001 12H12M15.001 12H15M9.001 12H9' })));
-};
-
-const HeadersCollectionIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M15.9959 6.49365C15.9959 4.28451 14.205 2.49365 11.9959 2.49365C9.78673 2.49365 7.99587 4.28451 7.99587 6.49365C7.99587 8.00872 8.8382 9.32706 10.0801 10.0059L5.99587 17.4937M15.8474 20.8547C17.7058 22.0491 20.1806 21.5107 21.3749 19.6522C22.5692 17.7937 22.0308 15.3189 20.1724 14.1246C18.8978 13.3055 17.3333 13.3014 16.0908 13.9792L11.9997 6.49524M4.07185 13.9954C2.13343 15.055 1.42105 17.4855 2.48069 19.4239C3.54033 21.3623 5.97073 22.0747 7.90915 21.015C9.23855 20.2883 9.9913 18.9168 9.99125 17.5015L18.5205 17.4937' })));
-};
-
-const PayloadCollectionIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 16 16', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { stroke: fill, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M7.99967 7.33333V11.3333M7.99967 11.3333C7.92987 11.3333 7.86007 11.31 7.80254 11.2634C7.37701 10.9186 6.99534 10.5224 6.66634 10.0837M7.99967 11.3333C8.06947 11.3333 8.13927 11.31 8.19681 11.2634C8.62234 10.9186 9.00401 10.5224 9.33301 10.0837M1.33301 6.26667C1.33301 4.77319 1.33301 4.02645 1.62365 3.45603C1.87932 2.95426 2.28727 2.54631 2.78903 2.29065C3.35946 2 4.1062 2 5.59967 2H5.81005C6.12312 2 6.27965 2 6.42174 2.04315C6.54753 2.08135 6.66455 2.14398 6.76614 2.22745C6.88081 2.32175 6.96767 2.45199 7.14134 2.71248L7.52467 3.28752C7.69834 3.54801 7.78521 3.67825 7.89987 3.77255C8.00147 3.85602 8.11847 3.91865 8.24427 3.95685C8.38634 4 8.54287 4 8.85594 4H10.3997C11.8931 4 12.6399 4 13.2103 4.29065C13.7121 4.54631 14.12 4.95426 14.3757 5.45603C14.6663 6.02645 14.6663 6.7732 14.6663 8.26667V9.73333C14.6663 11.2268 14.6663 11.9735 14.3757 12.544C14.12 13.0457 13.7121 13.4537 13.2103 13.7093C12.6399 14 11.8931 14 10.3997 14H5.59967C4.1062 14 3.35946 14 2.78903 13.7093C2.28727 13.4537 1.87932 13.0457 1.62365 12.544C1.33301 11.9735 1.33301 11.2268 1.33301 9.73333V6.26667Z' })));
-};
-
-const getActionIcon = (type) => {
-    const typeLowerCased = type?.toLowerCase();
-    const isSamplerCategory = typeLowerCased?.includes('sampler');
-    const isAttributesCategory = typeLowerCased === 'attributes';
-    if (isSamplerCategory)
-        return SamplerIcon;
-    if (isAttributesCategory)
-        return PiiMaskingIcon;
-    const LOGOS = {
-        [ActionType.K8sAttributes]: K8sLogo,
-        [ActionType.AddClusterInfo]: AddClusterInfoIcon,
-        [ActionType.DeleteAttributes]: DeleteAttributeIcon,
-        [ActionType.PiiMasking]: PiiMaskingIcon,
-        [ActionType.RenameAttributes]: RenameAttributeIcon,
-        [ActionType.ErrorSampler]: SamplerIcon,
-        [ActionType.ProbabilisticSampler]: SamplerIcon,
-        [ActionType.LatencySampler]: SamplerIcon,
-    };
-    return LOGOS[type] || ImageErrorIcon;
-};
-
 const getEntityId = (item) => {
     if ('ruleId' in item && !!item.ruleId) {
         // Instrumentation Rule
@@ -516,16 +526,6 @@ const getEntityId = (item) => {
     return undefined;
 };
 
-const getInstrumentationRuleIcon = (type) => {
-    const LOGOS = {
-        [InstrumentationRuleType.CodeAttributes]: CodeAttributesIcon,
-        [InstrumentationRuleType.HeadersCollection]: HeadersCollectionIcon,
-        [InstrumentationRuleType.PayloadCollection]: PayloadCollectionIcon,
-        [InstrumentationRuleType.UnknownType]: ImageErrorIcon,
-    };
-    return LOGOS[type] || ImageErrorIcon;
-};
-
 const useEntityStore = create((set) => ({
     namespacesLoading: false,
     namespaces: [],

package/lib/{index-rbphz5kH.js → index-CaAOgaiC.js}

@@ -1,7 +1,7 @@
 import React from 'react';
-import { _ as WarningModal } from './index-BxckQJom.js';
+import { _ as WarningModal } from './index-BedCNcwV.js';
 import { StatusType, EntityTypes } from './types.js';
-import './index-ivnS3eWW.js';
+import './index-CVH8Q8Sl.js';
 import 'styled-components';
 
 const CancelWarning = ({ isOpen, noOverlay, name, onApprove, onDeny }) => {

package/lib/{index-7-KCQK-x.js → index-CnZlllYu.js}

@@ -19,4 +19,13 @@ const getIdFromSseTarget = (target, type) => {
     }
 };
 
-export { getIdFromSseTarget as g };
+const isLegalK8sLabel = (name) => {
+    if (!name)
+        return false;
+    if (name.length > 63)
+        return false;
+    const regex = /^(([A-Za-z0-9][-A-Za-z0-9_.]*)?[A-Za-z0-9])?$/;
+    return regex.test(name);
+};
+
+export { getIdFromSseTarget as g, isLegalK8sLabel as i };

package/lib/{index-DuSmjoDs.js → index-Do3CYz7N.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
 
 const OdigosLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-cG2lNgzz.js → index-Iq7U_fzb.js}

@@ -1,11 +1,12 @@
 import { StatusType, OtherStatus, DestinationTypes, EntityTypes, PlatformType } from './types.js';
-import { K as K8sLogo } from './index-ivnS3eWW.js';
-import { D as DEFAULT_DATA_STREAM_NAME } from './index-B9cvsYnj.js';
-import { a as getProgrammingLanguageIcon } from './index-C7YDojNh.js';
+import { K as K8sLogo } from './index-CVH8Q8Sl.js';
+import { D as DEFAULT_DATA_STREAM_NAME } from './index-mOgS3e5E.js';
+import { a as getProgrammingLanguageIcon } from './index-B_Gl6Qa6.js';
 import 'react';
 import 'styled-components';
-import { e as AwsXrayLogo, a2 as VictoriaMetricsLogo, a1 as UptraceLogo, a0 as TraceloopLogo, $ as TingyunLogo, _ as TempoLogo, Z as TelemetryHubLogo, Y as SumoLogicLogo, X as SplunkLogo, W as SignozLogo, U as SeqLogo, d as AwsS3Logo, T as QuickwitLogo, G as GigapipeLogo, S as QrynLogo, R as PrometheusLogo, F as OpenTelemetryLogo, Q as OracleLogo, P as OpsVerseLogo, z as OpenObserveLogo, y as OneUptimeLogo, O as ObserveLogo, N as NewRelicLogo, M as MiddlewareLogo, x as LumigoLogo, w as LokiLogo, v as LogzioLogo, u as LightstepLogo, L as Last9Logo, K as KloudmateLogo, J as JaegerLogo, I as InstanaLogo, t as HyperDxLogo, H as HoneycombLogo, s as GroundcoverLogo, r as GreptimeLogo, q as GrafanaLogo, p as GoogleCloudPlatformLogo, o as ElasticSearchLogo, E as ElasticApmLogo, n as DynatraceLogo, m as DatadogLogo, D as Dash0Logo, l as CoralogixLogo, c as AwsCloudwatchLogo, k as ClickhouseLogo, j as ChronosphereLogo, i as ChecklyLogo, C as CauselyLogo, h as BonreeLogo, B as BetterStackLogo, g as BlobStorageLogo, f as AxiomLogo, b as AppDynamicsLogo, a as AlibabaCloudLogo, A as AlaudaLogo, a6 as RulesIcon, a3 as ActionsIcon, a4 as DestinationsIcon, a7 as SourcesIcon, a5 as NamespacesIcon, V as VmLogo } from './index-PfG5pvFK.js';
-import { K as KafkaLogo, O as OdigosLogo } from './index-DuSmjoDs.js';
+import { e as AwsXrayLogo, a2 as VictoriaMetricsLogo, a1 as UptraceLogo, a0 as TraceloopLogo, $ as TingyunLogo, _ as TempoLogo, Z as TelemetryHubLogo, Y as SumoLogicLogo, X as SplunkLogo, W as SignozLogo, U as SeqLogo, d as AwsS3Logo, T as QuickwitLogo, G as GigapipeLogo, S as QrynLogo, R as PrometheusLogo, F as OpenTelemetryLogo, Q as OracleLogo, P as OpsVerseLogo, z as OpenObserveLogo, y as OneUptimeLogo, O as ObserveLogo, N as NewRelicLogo, M as MiddlewareLogo, x as LumigoLogo, w as LokiLogo, v as LogzioLogo, u as LightstepLogo, L as Last9Logo, K as KloudmateLogo, J as JaegerLogo, I as InstanaLogo, t as HyperDxLogo, H as HoneycombLogo, s as GroundcoverLogo, r as GreptimeLogo, q as GrafanaLogo, p as GoogleCloudPlatformLogo, o as ElasticSearchLogo, E as ElasticApmLogo, n as DynatraceLogo, m as DatadogLogo, D as Dash0Logo, l as CoralogixLogo, c as AwsCloudwatchLogo, k as ClickhouseLogo, j as ChronosphereLogo, i as ChecklyLogo, C as CauselyLogo, h as BonreeLogo, B as BetterStackLogo, g as BlobStorageLogo, f as AxiomLogo, b as AppDynamicsLogo, a as AlibabaCloudLogo, A as AlaudaLogo, a6 as RulesIcon, a3 as ActionsIcon, a4 as DestinationsIcon, a7 as SourcesIcon, a5 as NamespacesIcon, V as VmLogo } from './index-1N9wymEq.js';
+import { K as KafkaLogo, O as OdigosLogo } from './index-Do3CYz7N.js';
+import { s as safeJsonParse } from './index-BV85P9UP.js';
 
 const compareCondition = (renderCondition, fields) => {
     if (!renderCondition || !renderCondition.length)
@@ -287,12 +288,46 @@ const getWorkloadId = ({ namespace, name, kind }) => {
     return { namespace, name, kind };
 };
 
+const getYamlFieldsForDestination = (categories, destination) => {
+    const fields = [];
+    const parsedCategories = JSON.parse(JSON.stringify(categories));
+    for (const category of parsedCategories) {
+        const autoFilledFields = safeJsonParse(destination.fields, {});
+        const idx = category.items.findIndex((item) => item.type === destination.destinationType.type);
+        if (idx !== -1) {
+            fields.push(...category.items[idx].fields.map((field) => ({
+                ...field,
+                initialValue: autoFilledFields[field.name],
+            })));
+        }
+    }
+    return fields;
+};
+
 const isOverTime = (originDate, difference = 0) => {
     const now = new Date().getTime();
     const compareWith = new Date(originDate).getTime();
     return compareWith - now <= difference;
 };
 
+const mapDestinationFieldsForDisplay = (destination, yamlFields) => {
+    const parsedFields = safeJsonParse(destination.fields, {});
+    if (!yamlFields.length) {
+        return Object.entries(parsedFields).map(([key, value]) => ({
+            key,
+            name: key,
+            value,
+        }));
+    }
+    return yamlFields
+        .map((field) => ({
+        key: field.name,
+        name: field.displayName || field.name,
+        value: parsedFields[field.name] ?? null,
+    }))
+        .filter((item) => item.value !== null);
+};
+
 const mapExportedSignals = (exportedSignals) => {
     if (!exportedSignals)
         return [];
@@ -301,4 +336,4 @@ const mapExportedSignals = (exportedSignals) => {
 
 const sleep = async (ms = 1000) => new Promise((resolve) => setTimeout(resolve, ms));
 
-export { filterDestinations as a, filterDestinationsByStream as b, compareCondition as c, deepClone as d, filterSources as e, filterActions as f, filterSourcesByStream as g, formatBytes as h, getConditionsBooleans as i, getContainersInstrumentedCount as j, getContainersIcons as k, getDestinationIcon as l, getEntityIcon as m, getEntityLabel as n, getMetricForEntity as o, getPlatformIcon as p, getPlatformLabel as q, getValueForRange as r, getWorkloadId as s, isOverTime as t, mapExportedSignals as u, sleep as v };
+export { filterDestinations as a, filterDestinationsByStream as b, compareCondition as c, deepClone as d, filterSources as e, filterActions as f, filterSourcesByStream as g, formatBytes as h, getConditionsBooleans as i, getContainersInstrumentedCount as j, getContainersIcons as k, getDestinationIcon as l, getEntityIcon as m, getEntityLabel as n, getMetricForEntity as o, getPlatformIcon as p, getPlatformLabel as q, getValueForRange as r, getWorkloadId as s, getYamlFieldsForDestination as t, isOverTime as u, mapDestinationFieldsForDisplay as v, mapExportedSignals as w, sleep as x };

package/lib/{index-DR5ryS5d.js → index-f8FRaVkE.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-CVH8Q8Sl.js';
 
 const OdigosLogoText = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-B9cvsYnj.js → index-mOgS3e5E.js}

@@ -9,6 +9,7 @@ const FORM_ALERTS = {
     CANNOT_DELETE_RULE: 'Cannot delete a system-managed instrumentation rule',
     LATENCY_HTTP_ROUTE: 'HTTP route must start with a forward slash "/"',
     READONLY_WARNING: "You're not allowed to create/update/delete in readonly mode",
+    ILLEGAL_K8S_LABEL: 'Must be 63 characters or less, must consist of alphanumeric characters, "-", "_", or ".", and must start & end with an alphanumeric character (e.g., my-name, 123.abc).',
 };
 const DISPLAY_TITLES = {
     NAMESPACE: 'Namespace',

package/lib/snippets.js

@@ -1,14 +1,14 @@
-export { A as AddButton } from './index-BxckQJom.js';
-export { E as EditButton, N as NoteBackToSummary } from './index-DeD-SIlN.js';
+export { A as AddButton } from './index-BedCNcwV.js';
+export { E as EditButton, N as NoteBackToSummary } from './index-BjVl4-os.js';
 import 'react';
-import './index-ivnS3eWW.js';
+import './index-CVH8Q8Sl.js';
 import './types.js';
 import 'styled-components';
-import './index-DAbcw-wM.js';
-import './index-BZS1ijMm.js';
-import './index-B9cvsYnj.js';
-import './index-C7YDojNh.js';
-import './index-DuSmjoDs.js';
-import './useTransition-9tDdAS9s.js';
+import './index-CNfdJ1X8.js';
+import './index-BV85P9UP.js';
+import './index-mOgS3e5E.js';
+import './index-B_Gl6Qa6.js';
+import './index-Do3CYz7N.js';
+import './useTransition-B0eagOib.js';
 import 'react-dom';
-import './index-B3j_QWzh.js';
+import './index-BQQZyvRz.js';

package/lib/store.js

@@ -1,4 +1,4 @@
-export { u as useDarkMode, a as useDataStreamStore, b as useDrawerStore, c as useEntityStore, d as useFilterStore, e as useInstrumentStore, f as useModalStore, g as useNotificationStore, h as usePendingStore, i as useSelectedStore, j as useSetupStore } from './index-ivnS3eWW.js';
+export { u as useDarkMode, a as useDataStreamStore, b as useDrawerStore, c as useEntityStore, d as useFilterStore, e as useInstrumentStore, f as useModalStore, g as useNotificationStore, h as usePendingStore, i as useSelectedStore, j as useSetupStore } from './index-CVH8Q8Sl.js';
 import 'react';
 import './types.js';
 import 'styled-components';

package/lib/theme.js

@@ -1,4 +1,4 @@
-export { T as default } from './index-ivnS3eWW.js';
+export { T as default } from './index-CVH8Q8Sl.js';
 import 'styled-components';
 import 'react';
 import './types.js';

package/lib/{useSourceSelectionFormData-A5_zhn1C.js → useSourceSelectionFormData-DiwzViqL.js}

@@ -1,11 +1,11 @@
 import { ActionType, StatusType, AddNodeTypes, EntityTypes, FieldTypes } from './types.js';
-import { g as useNotificationStore, f as useModalStore, b as useDrawerStore, c as useEntityStore, a as useDataStreamStore, j as useSetupStore } from './index-ivnS3eWW.js';
-import { F as FORM_ALERTS } from './index-B9cvsYnj.js';
+import { g as useNotificationStore, f as useModalStore, b as useDrawerStore, c as useEntityStore, a as useDataStreamStore, j as useSetupStore } from './index-CVH8Q8Sl.js';
+import { F as FORM_ALERTS } from './index-mOgS3e5E.js';
 import { useState, useEffect, useMemo } from 'react';
 import 'styled-components';
-import { i as isEmpty, s as safeJsonParse } from './index-BZS1ijMm.js';
-import { b as useGenericForm } from './useTransition-9tDdAS9s.js';
-import { g as getIdFromSseTarget } from './index-7-KCQK-x.js';
+import { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
+import { b as useGenericForm } from './useTransition-B0eagOib.js';
+import { g as getIdFromSseTarget, i as isLegalK8sLabel } from './index-CnZlllYu.js';
 
 const INITIAL$2 = {
     // @ts-ignore (TS complains about empty string because we expect an "ActionsType", but it's fine)
@@ -213,6 +213,10 @@ const useDataStreamFormData = (initialFormData) => {
             isValid = false;
             errors['name'] = FORM_ALERTS.FIELD_IS_REQUIRED;
         }
+        else if (!isLegalK8sLabel(formData['name'])) {
+            isValid = false;
+            errors['name'] = FORM_ALERTS.ILLEGAL_K8S_LABEL;
+        }
         else {
             errors['name'] = undefined;
         }

package/lib/{useTransition-9tDdAS9s.js → useTransition-B0eagOib.js}

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect, useCallback } from 'react';
-import { g as useNotificationStore } from './index-ivnS3eWW.js';
+import { g as useNotificationStore } from './index-CVH8Q8Sl.js';
 import { CodeAttributesKeyTypes, PayloadCollectionKeyTypes } from './types.js';
 import styled from 'styled-components';
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odigos/ui-kit",
-  "version": "0.0.32",
+  "version": "0.0.33",
   "author": "Odigos",
   "repository": {
     "type": "git",

package/lib/{index-BZS1ijMm.js → index-BV85P9UP.js}

@@ -1,17 +1,3 @@
-// Sometimes we need to allow "zero" values, and a simple "!val" check would result in false positives.
-// This function is a strict check for empty values, permitting values like "0" and "false".
-const isEmpty = (val) => {
-    if (Array.isArray(val)) {
-        return !val?.length;
-    }
-    else if (typeof val === 'object') {
-        return !Object.keys(val || {}).length;
-    }
-    else {
-        return [undefined, null, ''].includes(val);
-    }
-};
-
 function safeJsonParse(val, fallback) {
     if (!val)
         return fallback;
@@ -27,4 +13,18 @@ function safeJsonParse(val, fallback) {
     }
 }
 
+// Sometimes we need to allow "zero" values, and a simple "!val" check would result in false positives.
+// This function is a strict check for empty values, permitting values like "0" and "false".
+const isEmpty = (val) => {
+    if (Array.isArray(val)) {
+        return !val?.length;
+    }
+    else if (typeof val === 'object') {
+        return !Object.keys(val || {}).length;
+    }
+    else {
+        return [undefined, null, ''].includes(val);
+    }
+};
+
 export { isEmpty as i, safeJsonParse as s };