NewPanelEdit: Fixed missing react keys in list error

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

@@ -184,11 +184,14 @@ export const TabsBarContent: React.FC<{
         </div>
         </div>
       ) : (
       ) : (
         <>
         <>
-          {tabSelections.map(item => {
-            return (
-              <Tab label={item.label} active={activeTab === item.value} onChangeTab={() => setActiveTab(item.value)} />
-            );
-          })}
+          {tabSelections.map(item => (
+            <Tab
+              key={item.value}
+              label={item.label}
+              active={activeTab === item.value}
+              onChangeTab={() => setActiveTab(item.value)}
+            />
+          ))}
           <div className="flex-grow-1" />
           <div className="flex-grow-1" />
         </>
         </>
       )}
       )}
@@ -219,7 +222,7 @@ const tabSelections: Array<SelectableValue<string>> = [
     value: 'options',
     value: 'options',
   },
   },
   {
   {
-    label: 'Data',
+    label: 'Fields',
     value: 'defaults',
     value: 'defaults',
   },
   },
   {
   {

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

@@ -96,49 +96,50 @@ export const PanelOptionsTab: FC<Props> = ({
   }
   }
 
 
   elements.push(
   elements.push(
-    <>
-      <OptionsGroup title="Panel links" key="panel links" defaultToClosed={true}>
-        <DataLinksInlineEditor
-          links={panel.links}
-          onChange={links => onPanelConfigChange('links', links)}
-          suggestions={linkVariablesSuggestions}
-          data={[]}
-        />
-      </OptionsGroup>
-      <OptionsGroup title="Panel repeats" key="panel repeats" defaultToClosed={true}>
-        <Forms.Field
-          label="Repeat by variable"
-          description="Repeat this panel for each value in the selected variable.
+    <OptionsGroup title="Panel links" key="panel links" defaultToClosed={true}>
+      <DataLinksInlineEditor
+        links={panel.links}
+        onChange={links => onPanelConfigChange('links', links)}
+        suggestions={linkVariablesSuggestions}
+        data={[]}
+      />
+    </OptionsGroup>
+  );
+
+  elements.push(
+    <OptionsGroup title="Panel repeats" key="panel repeats" defaultToClosed={true}>
+      <Forms.Field
+        label="Repeat by variable"
+        description="Repeat this panel for each value in the selected variable.
           This is not visible while in edit mode. You need to go back to dashboard and then update the variable or
           This is not visible while in edit mode. You need to go back to dashboard and then update the variable or
           reload the dashboard."
           reload the dashboard."
-        >
+      >
+        <Select
+          value={panel.repeat}
+          onChange={value => onPanelConfigChange('repeat', value.value)}
+          options={variableOptions}
+        />
+      </Forms.Field>
+      {panel.repeat && (
+        <Forms.Field label="Repeat direction">
+          <Forms.RadioButtonGroup
+            options={directionOptions}
+            value={panel.repeatDirection || 'h'}
+            onChange={value => onPanelConfigChange('repeatDirection', value)}
+          />
+        </Forms.Field>
+      )}
+
+      {panel.repeat && panel.repeatDirection === 'h' && (
+        <Forms.Field label="Max per row">
           <Select
           <Select
-            value={panel.repeat}
-            onChange={value => onPanelConfigChange('repeat', value.value)}
-            options={variableOptions}
+            options={maxPerRowOptions}
+            value={panel.maxPerRow}
+            onChange={value => onPanelConfigChange('maxPerRow', value.value)}
           />
           />
         </Forms.Field>
         </Forms.Field>
-        {panel.repeat && (
-          <Forms.Field label="Repeat direction">
-            <Forms.RadioButtonGroup
-              options={directionOptions}
-              value={panel.repeatDirection || 'h'}
-              onChange={value => onPanelConfigChange('repeatDirection', value)}
-            />
-          </Forms.Field>
-        )}
-
-        {panel.repeat && panel.repeatDirection === 'h' && (
-          <Forms.Field label="Max per row">
-            <Select
-              options={maxPerRowOptions}
-              value={panel.maxPerRow}
-              onChange={value => onPanelConfigChange('maxPerRow', value.value)}
-            />
-          </Forms.Field>
-        )}
-      </OptionsGroup>
-    </>
+      )}
+    </OptionsGroup>
   );
   );
 
 
   return <>{elements}</>;
   return <>{elements}</>;

public/app/plugins/panel/table2/TablePanel.tsx

@@ -20,6 +20,6 @@ export class TablePanel extends Component<Props> {
       return <div>No Table Data...</div>;
       return <div>No Table Data...</div>;
     }
     }
 
 
-    return <Table height={height} width={width} data={data.series[0]} noHeader={!options.showHeader} />;
+    return <Table height={height - 16} width={width} data={data.series[0]} noHeader={!options.showHeader} />;
   }
   }
 }
 }

public/app/plugins/panel/table2/module.tsx

@@ -15,7 +15,6 @@ export const plugin = new PanelPlugin<Options, CustomFieldConfig>(TablePanel)
           min: 20,
           min: 20,
           max: 300,
           max: 300,
         },
         },
-        defaultValue: 1,
       })
       })
       .addSelect({
       .addSelect({
         id: 'displayMode',
         id: 'displayMode',