GraphNG: adding possibility to toggle tooltip, graph and legend for series (#29575)

public/app/features/dashboard/components/PanelEditor/DynamicConfigValueEditor.tsx

@@ -11,6 +11,7 @@ interface DynamicConfigValueEditorProps {
   context: FieldOverrideContext;
   onRemove: () => void;
   isCollapsible?: boolean;
+  isSystemOverride?: boolean;
 }
 
 export const DynamicConfigValueEditor: React.FC<DynamicConfigValueEditorProps> = ({
@@ -20,6 +21,7 @@ export const DynamicConfigValueEditor: React.FC<DynamicConfigValueEditorProps> =
   onChange,
   onRemove,
   isCollapsible,
+  isSystemOverride,
 }) => {
   const theme = useTheme();
   const styles = getStyles(theme);
@@ -37,9 +39,11 @@ export const DynamicConfigValueEditor: React.FC<DynamicConfigValueEditorProps> =
         {item.name}
         {!isExpanded && includeCounter && item.getItemsCount && <Counter value={item.getItemsCount(property.value)} />}
       </Label>
-      <div>
-        <IconButton name="times" onClick={onRemove} />
-      </div>
+      {!isSystemOverride && (
+        <div>
+          <IconButton name="times" onClick={onRemove} />
+        </div>
+      )}
     </HorizontalGroup>
   );
 

public/app/features/dashboard/components/PanelEditor/OverrideEditor.tsx

@@ -6,6 +6,7 @@ import {
   FieldConfigOptionsRegistry,
   FieldConfigProperty,
   GrafanaTheme,
+  isSystemOverride as isSystemOverrideGuard,
   VariableSuggestionsScope,
 } from '@grafana/data';
 import {
@@ -136,6 +137,8 @@ export const OverrideEditor: React.FC<OverrideEditorProps> = ({
     );
   };
 
+  const isSystemOverride = isSystemOverrideGuard(override);
+
   return (
     <OptionsGroup renderTitle={renderOverrideTitle} id={name} key={name}>
       <Field label={matcherLabel}>
@@ -150,6 +153,7 @@ export const OverrideEditor: React.FC<OverrideEditorProps> = ({
       <>
         {override.properties.map((p, j) => {
           const item = registry.getIfExists(p.id);
+          console.log('item', item);
 
           if (!item) {
             return <div>Unknown property: {p.id}</div>;
@@ -162,6 +166,7 @@ export const OverrideEditor: React.FC<OverrideEditorProps> = ({
             <DynamicConfigValueEditor
               key={`${p.id}/${j}`}
               isCollapsible={isCollapsible}
+              isSystemOverride={isSystemOverride}
               onChange={value => onDynamicConfigValueChange(j, value)}
               onRemove={() => onDynamicConfigValueRemove(j)}
               property={p}
@@ -173,7 +178,7 @@ export const OverrideEditor: React.FC<OverrideEditorProps> = ({
             />
           );
         })}
-        {override.matcher.options && (
+        {!isSystemOverride && override.matcher.options && (
           <div className={styles.propertyPickerWrapper}>
             <ValuePicker
               label="Add override property"

public/app/features/dashboard/components/PanelEditor/OverrideFieldConfigEditor.tsx

@@ -82,6 +82,7 @@ export const OverrideFieldConfigEditor: React.FC<Props> = props => {
           variant="secondary"
           options={fieldMatchersUI
             .list()
+            .filter(o => !o.excludeFromPicker)
             .map<SelectableValue<string>>(i => ({ label: i.name, value: i.id, description: i.description }))}
           onChange={value => onOverrideAdd(value)}
           isFullWidth={false}