Fix no way to unassign instances in Web UI

packages/master/src/ControlConnection.js

@@ -356,6 +356,9 @@ class ControlConnection extends BaseConnection {
 				instance_id,
 				serialized_config: instance.config.serialize("slave"),
 			});
+		} else {
+			instance.status = "unassigned";
+			this._master.instanceUpdated(instance);
 		}
 	}
 

packages/web_ui/src/components/AssignInstanceModal.jsx

@@ -28,6 +28,10 @@ export default function AssignInstanceModal(props) {
 			return;
 		}
 
+		if (slaveId === "null") {
+			slaveId = null;
+		}
+
 		setApplying(true);
 		libLink.messages.assignInstanceCommand.send(control, {
 			instance_id: props.id,
@@ -67,9 +71,12 @@ export default function AssignInstanceModal(props) {
 				the instance.  Note that reassigning an instance from
 				one slave to another will not move the server save over.
 			</Paragraph>
-			<Form form={form} initialValues={{ slave: props.slaveId }}>
+			<Form form={form} initialValues={{ slave: props.slaveId === null ? "null" : props.slaveId }}>
 				<Form.Item name="slave" label="Slave">
 					<Select>
+						<Select.Option value={"null"}>
+							<Typography.Text italic>Unassigned</Typography.Text>
+						</Select.Option>
 						{slaveList.map((slave) => <Select.Option
 							key={slave["id"]}
 							value={slave["id"]}

packages/web_ui/src/components/InstanceList.jsx

@@ -16,6 +16,9 @@ export default function InstanceList(props) {
 	let [slaveList] = useSlaveList();
 
 	function slaveName(slaveId) {
+		if (slaveId === null) {
+			return "";
+		}
 		let slave = slaveList.find(s => s.id === slaveId);
 		if (slave) {
 			return slave.name;