Merge branch 'main' into gen-1976

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<Props> = () => {
+  const notify = useNotify();
   const { selectedItem, setSelectedItem } = useDrawerStore();
   const { formData, formErrors, handleFormChange, resetFormData, validateForm, loadFormWithDrawerItem } = useInstrumentationRuleFormData();
 
@@ -72,7 +73,11 @@ export const RuleDrawer: React.FC<Props> = () => {
   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 = () => {

frontend/webapp/containers/main/instrumentation-rules/rule-form-body/custom-fields/index.tsx

@@ -19,6 +19,7 @@ type ComponentType = React.FC<ComponentProps> | null;
 
 const componentsMap: Record<InstrumentationRuleType, ComponentType> = {
   [InstrumentationRuleType.PAYLOAD_COLLECTION]: PayloadCollection,
+  [InstrumentationRuleType.UNKNOWN_TYPE]: null,
 };
 
 const RuleCustomFields: React.FC<Props> = ({ ruleType, value, setValue, formErrors }) => {

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;

frontend/webapp/reuseable-components/data-card/data-card-fields/index.tsx

@@ -87,7 +87,11 @@ const renderValue = (type: DataCardRow['type'], value: DataCardRow['value']) =>
       });
 
       return (
-        <DataTab title={containerName} subTitle={`${capitalizeFirstLetter(language)} • Runtime: ${runtimeVersion}`} logo={getProgrammingLanguageIcon(language)}>
+        <DataTab
+          title={containerName}
+          subTitle={`${language === WORKLOAD_PROGRAMMING_LANGUAGES.JAVASCRIPT ? 'Node.js' : capitalizeFirstLetter(language)} • Runtime Version: ${runtimeVersion}`}
+          logo={getProgrammingLanguageIcon(language)}
+        >
           <InstrumentStatus language={language} />
         </DataTab>
       );

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;
   }
 `;
 

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',
 }
 

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: {

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;
 };