Only allow one component to be dropped

#2515_1 #2515_2

So I have a very ugly solution right now:

	editor.on('load',
		function() {
			var existingComponents = editor.getComponents();
			if (existingComponents.models.filter(function(e) { return e.attributes.tagName === 'form'; }).length > 0) {
				$($($("body .gjs-block-category")[1]).find(".gjs-block")[0]).hide();
			}
		}
	);

	editor.on('component:add', component => {
		if (component.is('form')) {
			$($($("body .gjs-block-category")[1]).find(".gjs-block")[0]).hide();
		}
	});
	editor.on('component:remove', component => {
		if (component.is('form')) {
			$($($("body .gjs-block-category")[1]).find(".gjs-block")[0]).show();
		}
	});

This basically looks whether the component is in the canvas on load. If it is then it hides the draggable component button - Here I could use a better way to hide the button - how? I can get to the component with const form = editor.BlockManager.get('form'); but how do I hide it once I have it? Then I have listeners for add and remove to hide and show the component button - same issue as above.

This seems like a horrible way to do it. There must be some setting I am missing for "only allowed one". Any suggestions?