JSFiddle - React, Tailwind, and code Playground

HTML

<script src="DragControls.js"></script>
<html>

  <head>
    <title>Threejs</title>
  </head>

  <body>
  </body>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/101/three.min.js"></script>
  <script src="https://cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/DragControls.js"></script>
  <script src="//cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/TrackballControls.js"></script>
  <script src="https://cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/OrbitControls.js"></script>

</html>

JavaScript

var cargoJson = {"transport_modes":[{"name":"sea","container":[{"name":"20 FT","dimension":{"length":"5.898","width":"2.352","height":"2.385"},"capacity":"28230"}]}]}
var camera, scene, renderer;
var wireframe = [];
var container = cargoJson.transport_modes[0].container[0];
var scaling_factor = 100;
var container_dimension = {width:container.dimension.width * scaling_factor,height:container.dimension.height * scaling_factor,length:container.dimension.length * scaling_factor};

var position = position = {
	x:0,
	y:0,
	z:0
};

var last_cube;
var objects = [];
var controls;
var palleteDeimension = {
    isSet : false
};
raycaster = new THREE.Raycaster();
var mouse = new THREE.Vector2();
			var wireframe;
			init3dModel();
			initDragCargo();
			animate();
			addCargo({width:200,height:50,length:500},'#ffffff');
			addCargo({width:200,height:50,length:500},'#ffffff');
			addCargo({width:200,height:50,length:460},'#ff6fff');
			addCargo({width:200,height:50,length:80},'#ff6fff');
			addCargo({width:200,height:50,length:60},'#ff66ff');
			//addCargo({width:200,height:50,length:40},'#ffffff');
			//addCargo({width:200,height:50,length:20},'#ffffff');
			
			
			

			
			function onMouseMove( event ) {
				// calculate mouse position in normalized device coordinates
				// (-1 to +1) for both components
				mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
				mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
			}
			function init3dModel(){
				//container_dimension = {width:container.width * scaling_factor, height:container.height * scaling_factor, length:container.length * scaling_factor};
				if(scene){
					scene.remove.apply(scene, scene.children);
				}
				objects = []; 				
				initRenderer();
				initCamera(); 
				addContainer();    
				animate();
			}
			function initCamera(){
				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 2000 );
				camera.position.z = 700;
				controls = new THREE.OrbitControls(...