fix axes names in axes panel

Author: dmt0

src/components/fields/AxesSelector.js

@@ -16,36 +16,45 @@ class AxesSelector extends Component {
   }
 
   render() {
-    const {axesTargetHandler, axesTarget, localize: _} = this.context;
+    const {
+      axesTargetHandler,
+      axesTarget,
+      fullLayout,
+      localize: _,
+    } = this.context;
     const {axesOptions} = this.props;
     const maxOptions = axesOptions.length > 4; // eslint-disable-line
 
-    if (maxOptions) {
-      return (
-        <Field {...this.props} label={_('Axis to Style')}>
-          <Dropdown
-            options={axesOptions.map(option => {
-              if (option.value !== 'allaxes') {
-                return {
+    const multipleSublots =
+      fullLayout &&
+      fullLayout._subplots &&
+      Object.values(fullLayout._subplots).some(s => s.length > 1);
+
+    const options = multipleSublots
+      ? axesOptions.map(
+          option =>
+            option.value === 'allaxes'
+              ? option
+              : {
                   label: option.title,
                   value: option.value,
-                };
-              }
-
-              return option;
-            })}
-            value={axesTarget}
-            onChange={axesTargetHandler}
-            clearable={false}
-          />
-        </Field>
-      );
-    }
+                }
+        )
+      : axesOptions;
 
-    return (
+    return maxOptions ? (
+      <Field {...this.props} label={_('Axis to Style')}>
+        <Dropdown
+          options={options}
+          value={axesTarget}
+          onChange={axesTargetHandler}
+          clearable={false}
+        />
+      </Field>
+    ) : (
       <Field {...this.props} center>
         <RadioBlocks
-          options={axesOptions}
+          options={options}
           activeOption={axesTarget}
           onOptionChange={axesTargetHandler}
         />