sample.tsx

import React from 'react';
import { ILights } from 'src/types/lights';
import { GLTF } from 'three-stdlib';
import { GltfModel } from './gltf-model';

export const GltfScene = (props: { gltf: GLTF | undefined; lights: ILights }) => {
  const { gltf, lights } = props;

  const gltfElement = gltf ? <GltfModel gltf={gltf} lightOption={lights.additonalLights} /> : <group />;

  const baseLightElement = lights.baseLight ? (
    <ambientLight intensity={lights.baseLight.intensity} visible={lights.baseLight.visible} />
  ) : (
    <group />
  );


  return (
    <group>
      {baseLightElement}
      {gltfElement}
    </group>
  );
};