circular structure to JSON --> starting at object with constructor

[Saar1985]

I have version 3.0.4 , after adding Lens flare have this error on every page resize
Uncaught TypeError: Converting circular structure to JSON
--> starting at object with constructor 'Object'
| property 'children' -> object with constructor 'Array'
| index 0 -> object with constructor 'Object'
--- property 'parent' closes the circle
at JSON.stringify ()
at util.tsx:38:7
at react-stack-bottom-frame (react-reconciler.development.js:14492:20)
at renderWithHooks (react-reconciler.development.js:3914:22)

My Effects.jsx code

// Effects.jsx
import React, { useMemo } from 'react';
import { EffectComposer, Bloom, LensFlare } from '@react-three/postprocessing';
import { useTexture } from "@react-three/drei";
import { Color } from 'three';

export function Effects() {
const lensDirtTexture = useTexture('/lensDirtTexture.png');

// use simple, serializable props instead of complex Three.js classes directly
const lensFlareProps = useMemo(() => ({
    enabled: true,
    opacity: 1.0,
    position: { x: -25, y: 6, z: -60 },
    glareSize: 0.35,
    starPoints: 6,
    animated: true,
    followMouse: false,
    anamorphic: false,
    colorGain: new Color('#38160b'), // Hex string converted safely here
    flareSpeed: 0.4,
    flareShape: 0.1,
    flareSize: 0.005,
    secondaryGhosts: true,
    ghostScale: 0.1,
    aditionalStreaks: true,
    starBurst: true,
    haloScale: 0.5,
    lensDirtTexture: lensDirtTexture
}), [lensDirtTexture]);

return (
    <EffectComposer>
        <Bloom
            luminanceThreshold={0.5}
            mipmapBlur
            luminanceSmoothing={0.2}
            intensity={0.2}
        />
        <LensFlare {...lensFlareProps} />
    </EffectComposer>
);

}