Merge pull request #1105 from replicatedhq/select-one-items-same-name…

…-conflict Fix conflict between two select_one items with same name but different groups
replicatedhq · Mar 5, 2020 · 05f2156 · 05f2156
2 parents 0c9aed0 + 033f909
commit 05f2156
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/web/init/package.json b/web/init/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@replicatedhq/ship-init",
-  "version": "1.6.18",
+  "version": "1.6.19",
   "description": "Shared component that contains the Ship Init app",
   "author": "Replicated, Inc.",
   "license": "Apache-2.0",

diff --git a/web/init/src/components/config_render/ConfigRadio.jsx b/web/init/src/components/config_render/ConfigRadio.jsx
@@ -19,17 +19,17 @@ export default class ConfigRadio extends React.Component {
     const checked = val === this.props.name;
 
     return (
-      <div className="flex-auto flex u-marginRight--20">
+      <div className="flex-auto flex alignItems--center u-marginRight--20">
         <input
           type="radio"
           name={this.props.group}
-          id={this.props.name}
+          id={`${this.props.group}-${this.props.name}`}
           value={this.props.name}
           checked={checked}
           disabled={this.props.readOnly}
           onChange={(e) => this.handleOnChange(e)}
           className={`${this.props.className || ""} flex-auto ${this.props.readOnly ? "readonly" : ""}`} />
-        <label htmlFor={this.props.name} className={`u-marginLeft--small header-color field-section-sub-header u-userSelect--none ${this.props.readOnly ? "u-cursor--default" : "u-cursor--pointer"}`}>{this.props.title}</label>
+        <label htmlFor={`${this.props.group}-${this.props.name}`} className={`u-marginLeft--small header-color field-section-sub-header u-userSelect--none ${this.props.readOnly ? "u-cursor--default" : "u-cursor--pointer"}`}>{this.props.title}</label>
       </div>
     );
   }