1 files changed, 35 insertions, 0 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitAddComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitAddComponent.js
new file mode 100644
index 00000000..4e9dbc7e
--- /dev/null
+++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitAddComponent.js
@@ -0,0 +1,35 @@
+import PropTypes from 'prop-types'
+import React from 'react'
+
+class UnitAddComponent extends React.Component {
+    static propTypes = {
+        units: PropTypes.array.isRequired,
+        onAdd: PropTypes.func.isRequired,
+    }
+
+    render() {
+        return (
+            <div className="form-inline">
+                <div className="form-group w-100">
+                    <select className="form-control w-70 mr-1" ref={(unitSelect) => (this.unitSelect = unitSelect)}>
+                        {this.props.units.map((unit) => (
+                            <option value={unit._id} key={unit._id}>
+                                {unit.name}
+                            </option>
+                        ))}
+                    </select>
+                    <button
+                        type="submit"
+                        className="btn btn-outline-primary"
+                        onClick={() => this.props.onAdd(this.unitSelect.value)}
+                    >
+                        <span className="fa fa-plus mr-2" />
+                        Add
+                    </button>
+                </div>
+            </div>
+        )
+    }
+}
+
+export default UnitAddComponent