react/threejs-how to create curvy version of rectAreaLight in react three fiber

Question

Hi, I managed to make rectangle shape of lighting effect as shown in A. But, how to make a similar lighting effect in B?

I could not find a curvy version of light API code provided by threeJs/react-three-fibre.

What I currently have in mind is stacking up rectAreaLight by manually adjusting the angle. However, I think this could make the lighting effect ugly and occupy lots of memory spaces.

It would be better if I can somehow make the rectAreaLight 'curvy', but I do not know how to do it or whether it can be done or not.

CodeSandbox: https://codesandbox.io/s/condescending-wiles-oev8pn?file=/src/App.js

Below I attached the codes.

import { Canvas } from '@react-three/fiber';
import { Suspense } from 'react';
import * as THREE from 'three';
import { OrbitControls, PerspectiveCamera } from '@react-three/drei';
const angleToRadians = (angleInDeg: number): number =>
  (Math.PI / 180) * angleInDeg;

function App() {
  return (
    <Canvas
      id='three-canvas-container'
      style={{ height: '100vh', width: '100vw' }}
      shadows
    >
      <Suspense fallback='loading'>
        <PerspectiveCamera makeDefault position={[0, 2, 5]} zoom={1} />
        <OrbitControls enableDamping={false} rotateSpeed={0.5} zoomSpeed={1} />
        <ambientLight args={['#ffffff', 1]} />
        <pointLight args={['#ffffff', 30, 10, 10]} position={[0, 0, 0]} />

        <mesh //left wall
          rotation={[0, angleToRadians(90), 0]}
          position={[-3, 0, 2]}
        >
          <planeGeometry args={[4, 4]} />
          <meshStandardMaterial color={'#091945'} side={THREE.DoubleSide} />
        </mesh>
        <mesh //right wall
          rotation={[0, angleToRadians(90), 0]}
          position={[3, 0, 2]}
        >
          <planeGeometry args={[4, 4]} />
          <meshStandardMaterial color={'purple'} side={THREE.DoubleSide} />
        </mesh>
        <mesh //top ceiling
          rotation={[angleToRadians(90), 0, 0]}
          position={[0, 2, 2]}
        >
          <planeGeometry args={[7, 11]} />
          <meshStandardMaterial color={'#091940'} side={THREE.FrontSide} />
        </mesh>
        <mesh //bottom floor
          rotation={[angleToRadians(90), 0, 0]}
          position={[0, -2, 2]}
        >
          <planeGeometry args={[7, 11]} />
          <meshStandardMaterial color={'#091940'} side={THREE.DoubleSide} />
        </mesh>

        <mesh //middle curve wall
          rotation={[
            angleToRadians(90),
            angleToRadians(90),
            angleToRadians(-90),
          ]}
          position={[0, -0.02, 0]}
        >
          <cylinderGeometry args={[3, 3, 4, 50, 1, true, 0, Math.PI]} />
          <meshStandardMaterial color={'#320945'} side={THREE.DoubleSide} />
        </mesh>

        <group //lighting on rect
          position={[-2.8, 1, 2]}
        >
          <mesh
            rotation={[0, angleToRadians(90), 0]}
            // position={[-2, 3.9 + Y_OFFSET, -0]}
          >
            <boxBufferGeometry args={[1, 0.2, 0.1]} />
            <meshStandardMaterial color={'#091945'} side={THREE.DoubleSide} />
          </mesh>
          <rectAreaLight
            args={['#50339b', 50, 1, 0.1]}
            // position={[-2, 3.9 + Y_OFFSET, -0]}
            rotation={[
              angleToRadians(0),
              angleToRadians(90),
              angleToRadians(0),
            ]}
          />
        </group>

        <group //lighting on curve
          position={[0, 0, -1]}
          scale={0.5}
        >
          <mesh
            rotation={[
              angleToRadians(90),
              angleToRadians(90),
              angleToRadians(-90),
            ]}
          >
            <cylinderGeometry args={[3.95, 3.95, 1, 50, 1, true, 0, Math.PI]} />
            <meshStandardMaterial
              //   color={new THREE.Color(0xffffff)} //bottom line is the original color. change to white for better visibility
              color={new THREE.Color(0x320945)}
              side={THREE.DoubleSide}
            />
          </mesh>
          {/* light code */}
        </group>
      </Suspense>
    </Canvas>
  );
}

export default App;