How to use the three.Scene function in three

useEffect(() => {
      scene.current = new THREE.Scene()
      // TODO introspect models
      updateModels({})
      setLocalState({value:{scene: scene.current}})
      // do any other pre-loading stuff here
      document.fonts.ready.then(() => {
        // let the app know we're ready to render
        setReady(true)
      })
      return function cleanup () {
        scene.current = null
      }
    }, [])

/**
     * Set of callbacks that children of this element pass via context.subscribeToMouseEvents
     * in order to receive mouse events that pertain to the objects that they manage.
     * @private
     */
    this.callbacks_ = {};

    /**
     * Reference to the root div element.
     * @private
     */
    this.ref_ = React.createRef();

    // Set up scene.

    this.scene = new THREE.Scene();
    this.scene.background = new THREE.Color(0xffffff);

    // Set up renderer.

    this.renderer = new THREE.WebGLRenderer({ antialias: true });
    this.renderer.shadowMap.enabled = true;
    this.renderer.shadowMap.type = THREE.PCFSoftShadowMap;
    this.renderer.setSize(this.props.width, this.props.height);

    // Set up camera.

    this.camera = new THREE.PerspectiveCamera(
      45,
      this.props.width / this.props.height,
      0.1,
      1000

var actions = {
        areaActions: this.context.areaActions,
        holesActions: this.context.holesActions,
        itemsActions: this.context.itemsActions,
        linesActions: this.context.linesActions,
        projectActions: this.context.projectActions
      };

      var state = this.props.state;

      var data = state.scene;
      var canvasWrapper = ReactDOM.findDOMNode(this.refs.canvasWrapper);

      var scene3D = new Three.Scene();

      // As I need to show the pointer above all scene objects, I use this workaround http://stackoverflow.com/a/13309722
      var sceneOnTop = new Three.Scene();

      //RENDERER
      this.renderer.setClearColor(new Three.Color(SharedStyle.COLORS.white));
      this.renderer.setSize(this.width, this.height);

      // LOAD DATA
      this.planData = parseData(data, actions, catalog);

      scene3D.add(this.planData.plan);

      // CAMERA
      var aspectRatio = this.width / this.height;
      var camera = new Three.PerspectiveCamera(45, aspectRatio, 0.1, 300000);

createScene(force = false, width, height) {
    if (this.props.objectScene === this.objectScene && !force) {
      return;
    }

    if (!width) {
      width = this.canvas.clientWidth;
      height = this.canvas.clientHeight;
    }

    this.objectScene = this.props.objectScene;
    const distance = (this.objectScene ? this.objectScene.distance * 4 : this.state.distance);

    this.scene = new THREE.Scene();
    this.camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 1000);
    this.camera.up = new THREE.Vector3(0, 1, 0);
    this.camera.position.x = Math.cos(this.rotation) * distance;
    this.camera.position.y = distance / 4;
    this.camera.position.z = Math.sin(this.rotation) * distance;

    const c = new OrbitControls(this.camera, this.canvas);
    c.target = new THREE.Vector3(0, this.objectScene ? (this.objectScene.maxExtentHeight + this.state.cameraFocusHeight) / 2 : 0, 0);
    c.update();

    this.renderer = new THREE.WebGLRenderer({
      canvas: this.canvas,
    });
    this.renderer.setSize(width, height);

    // Grid

constructor( gomlDoc ) {
      super( "scene", gomlDoc );
      this.coreObject = new THREE.Scene;
    }
  },

setUpEnvironment() {
    this.scene = new THREE.Scene()
    var fov = 20
    this.camera = new THREE.PerspectiveCamera(fov, this.canvasRef.current.clientWidth / this.canvasRef.current.clientHeight, 1, 10000)
    this.camera.position.set(0, 0, 170)
    this.renderer.setClearColor('#000000')

    let fsize = 4096
    this.analyser.fftSize = fsize
    let bufferLength = this.analyser.frequencyBinCount
    this.dataArray = new Uint8Array(bufferLength)
    this.spectrum = new Spectrum()
  }

_setupScene() {
    this.scene = new Scene();

    const light = new AmbientLight(0xffffff, 1);
    this.scene.add(light);

    const directionalLight = new DirectionalLight(0xffffff, 0.3);
    directionalLight.position.set(1000, 1000, 1000);
    directionalLight.castShadow = true;
    this.scene.add(directionalLight);

    this.shadow = new Shadow();
    this.scene.add(this.shadow);
  }

constructor(props) {
    super(props);
    const { width, height } = props.dimensions;
    this.scene = new THREE.Scene();
    this.camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 1000);

    this.renderer = new THREE.WebGLRenderer({ alpha: true });
    this.renderer.setSize(width, height);

    const hemiLight = new THREE.HemisphereLight(0xffffff, 0xffffff, 0.6);
    hemiLight.position.set(0, 500, 0);
    this.scene.add(hemiLight);

    const dirLight = new THREE.DirectionalLight(0xffffff, 1);
    dirLight.position.set(-1, 0.75, 1);
    dirLight.position.multiplyScalar(50);
    dirLight.name = "dirlight";
    this.scene.add(dirLight);

    this.camera.position.y = 1;

initializeModel() {
    const threejsWindowWidth = 600;
    const threejsWindowHeight = 460;
    scene = new THREE.Scene();
    camera = new THREE.PerspectiveCamera(50, threejsWindowWidth / threejsWindowHeight, 0.1, 1000);
    renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
    renderer.setSize(threejsWindowWidth, threejsWindowHeight);
    renderer.setClearColor(0xffffff, 0);
    document.querySelector('#boxContainer').appendChild(renderer.domElement);

    renderer.domElement.id = 'box';

    const arealight = new THREE.AmbientLight(0x666666);
    scene.add(arealight);

    const frontlight = new THREE.PointLight(0xffffff, 0.5);
    frontlight.position.set(0, 0, 80);
    scene.add(frontlight);

    const rightlight = new THREE.PointLight(0xffffff, 0.4);