diff --git a/frontend/webapp/containers/main/instrumentation-rules/rule-drawer/index.tsx b/frontend/webapp/containers/main/instrumentation-rules/rule-drawer/index.tsx index 7a5921f9d..21ca7e8c8 100644 --- a/frontend/webapp/containers/main/instrumentation-rules/rule-drawer/index.tsx +++ b/frontend/webapp/containers/main/instrumentation-rules/rule-drawer/index.tsx @@ -3,13 +3,13 @@ import buildCard from './build-card'; import { RuleFormBody } from '../'; import styled from 'styled-components'; import { useDrawerStore } from '@/store'; -import { ACTION, DATA_CARDS, getRuleIcon } from '@/utils'; import { DataCard } from '@/reuseable-components'; import buildDrawerItem from './build-drawer-item'; import { RULE_OPTIONS } from '../rule-modal/rule-options'; import OverviewDrawer from '../../overview/overview-drawer'; -import { OVERVIEW_ENTITY_TYPES, type InstrumentationRuleSpec } from '@/types'; -import { useInstrumentationRuleCRUD, useInstrumentationRuleFormData } from '@/hooks'; +import { ACTION, DATA_CARDS, FORM_ALERTS, getRuleIcon, NOTIFICATION } from '@/utils'; +import { useInstrumentationRuleCRUD, useInstrumentationRuleFormData, useNotify } from '@/hooks'; +import { InstrumentationRuleType, OVERVIEW_ENTITY_TYPES, type InstrumentationRuleSpec } from '@/types'; interface Props {} @@ -22,6 +22,7 @@ const FormContainer = styled.div` `; export const RuleDrawer: React.FC = () => { + const notify = useNotify(); const { selectedItem, setSelectedItem } = useDrawerStore(); const { formData, formErrors, handleFormChange, resetFormData, validateForm, loadFormWithDrawerItem } = useInstrumentationRuleFormData(); @@ -72,7 +73,11 @@ export const RuleDrawer: React.FC = () => { const { id, item } = selectedItem as { id: string; item: InstrumentationRuleSpec }; const handleEdit = (bool?: boolean) => { - setIsEditing(typeof bool === 'boolean' ? bool : true); + if (item.type === InstrumentationRuleType.UNKNOWN_TYPE) { + notify({ type: NOTIFICATION.WARNING, title: FORM_ALERTS.FORBIDDEN, message: FORM_ALERTS.CANNOT_EDIT_RULE, crdType: OVERVIEW_ENTITY_TYPES.RULE, target: id }); + } else { + setIsEditing(typeof bool === 'boolean' ? bool : true); + } }; const handleCancel = () => { diff --git a/frontend/webapp/containers/main/instrumentation-rules/rule-form-body/custom-fields/index.tsx b/frontend/webapp/containers/main/instrumentation-rules/rule-form-body/custom-fields/index.tsx index b28f1cb12..f8e51a96c 100644 --- a/frontend/webapp/containers/main/instrumentation-rules/rule-form-body/custom-fields/index.tsx +++ b/frontend/webapp/containers/main/instrumentation-rules/rule-form-body/custom-fields/index.tsx @@ -19,6 +19,7 @@ type ComponentType = React.FC | null; const componentsMap: Record = { [InstrumentationRuleType.PAYLOAD_COLLECTION]: PayloadCollection, + [InstrumentationRuleType.UNKNOWN_TYPE]: null, }; const RuleCustomFields: React.FC = ({ ruleType, value, setValue, formErrors }) => { diff --git a/frontend/webapp/containers/main/sources/source-drawer-container/build-card.ts b/frontend/webapp/containers/main/sources/source-drawer-container/build-card.ts index 0f27272ef..daf455853 100644 --- a/frontend/webapp/containers/main/sources/source-drawer-container/build-card.ts +++ b/frontend/webapp/containers/main/sources/source-drawer-container/build-card.ts @@ -3,15 +3,12 @@ import type { K8sActualSource } from '@/types'; import { DataCardRow } from '@/reuseable-components'; const buildCard = (source: K8sActualSource) => { - const { name, kind, namespace, instrumentedApplicationDetails } = source; - const { containerName, language } = instrumentedApplicationDetails?.containers?.[0] || {}; + const { name, kind, namespace } = source; const arr: DataCardRow[] = [ { title: DISPLAY_TITLES.NAMESPACE, value: namespace }, { title: DISPLAY_TITLES.KIND, value: kind }, - { title: DISPLAY_TITLES.CONTAINER_NAME, value: containerName }, - { title: DISPLAY_TITLES.NAME, value: name }, - { title: DISPLAY_TITLES.LANGUAGE, value: language }, + { title: DISPLAY_TITLES.NAME, value: name, tooltip: 'K8s resource name' }, ]; return arr; diff --git a/frontend/webapp/reuseable-components/data-card/data-card-fields/index.tsx b/frontend/webapp/reuseable-components/data-card/data-card-fields/index.tsx index 4a227d264..dc449ea79 100644 --- a/frontend/webapp/reuseable-components/data-card/data-card-fields/index.tsx +++ b/frontend/webapp/reuseable-components/data-card/data-card-fields/index.tsx @@ -87,7 +87,11 @@ const renderValue = (type: DataCardRow['type'], value: DataCardRow['value']) => }); return ( - + ); diff --git a/frontend/webapp/reuseable-components/notification-note/index.tsx b/frontend/webapp/reuseable-components/notification-note/index.tsx index 35ff36575..8223c695a 100644 --- a/frontend/webapp/reuseable-components/notification-note/index.tsx +++ b/frontend/webapp/reuseable-components/notification-note/index.tsx @@ -33,7 +33,7 @@ const Container = styled.div<{ $isLeaving?: boolean }>` overflow: hidden; padding-bottom: 1px; border-radius: 32px; - animation: ${({ $isLeaving }) => ($isLeaving ? slide.out['right'] : slide.in['right'])} ${TRANSITION_DURATION}ms forwards; + animation: ${({ $isLeaving }) => ($isLeaving ? slide.out['top'] : slide.in['top'])} ${TRANSITION_DURATION}ms forwards; } `; diff --git a/frontend/webapp/types/instrumentation-rules.ts b/frontend/webapp/types/instrumentation-rules.ts index f8919ce2c..74a5d4548 100644 --- a/frontend/webapp/types/instrumentation-rules.ts +++ b/frontend/webapp/types/instrumentation-rules.ts @@ -1,5 +1,6 @@ // Enumeration of possible Instrumentation Rule Types export enum InstrumentationRuleType { + UNKNOWN_TYPE = 'UnknownType', PAYLOAD_COLLECTION = 'PayloadCollection', } diff --git a/frontend/webapp/utils/constants/string.tsx b/frontend/webapp/utils/constants/string.tsx index b74a35243..56a4ab275 100644 --- a/frontend/webapp/utils/constants/string.tsx +++ b/frontend/webapp/utils/constants/string.tsx @@ -35,6 +35,8 @@ export const ACTION = { export const FORM_ALERTS = { REQUIRED_FIELDS: 'Required fields are missing', FIELD_IS_REQUIRED: 'This field is required', + FORBIDDEN: 'Forbidden', + CANNOT_EDIT_RULE: 'Cannot edit instrumentation rule of this type', }; export const NOTIFICATION: { diff --git a/frontend/webapp/utils/functions/strings/derive-type-from-rule/index.ts b/frontend/webapp/utils/functions/strings/derive-type-from-rule/index.ts index 30051146d..ebd0994c6 100644 --- a/frontend/webapp/utils/functions/strings/derive-type-from-rule/index.ts +++ b/frontend/webapp/utils/functions/strings/derive-type-from-rule/index.ts @@ -5,5 +5,5 @@ export const deriveTypeFromRule = (rule: InstrumentationRuleInput | Instrumentat return InstrumentationRuleType.PAYLOAD_COLLECTION; } - return undefined; + return InstrumentationRuleType.UNKNOWN_TYPE; };