JSFiddle - React, Tailwind, and code Playground

JavaScript

var all       = new L.MarkerClusterGroup(), 
			suppliers = new L.MarkerClusterGroup(),
			users     = new L.MarkerClusterGroup();
		
		var Icon = L.Icon.extend({
				options: {
					iconUrl: 'test.jpg',
					className: 'icon'
				}
			});
		
		var AddressIcon2;
		
		result = $.parseJSON(data);	
		
		$.each(result,function(key,value) {       
			
			if (value.type=='user') {			
				
			
				var popup_html = '<span>test</span>';
				var temp_marker = new L.Marker([value.lat,value.lon], {icon: UserIcon }).bindPopup(popup_html,{className: 'user'});
				users.addLayer(temp_marker);
				all.addLayer(temp_marker);
				
				
			} else {
		
				var popup_html = '<span>test</span>';
				var temp_marker = new L.Marker([value.lat, value.lon], {icon: Icon }).bindPopup(popup_html);
				suppliers.addLayer(temp_marker);
				all.addLayer(temp_marker);
			
			}
				
		});
		
		map.addLayer(all);
		
		L.control.layers( {"all" : all , "users" : users , "suppliers" : suppliers}, {}).addTo(map);