import { Outline } from "@react-three/postprocessing";
import { BlendFunction } from "postprocessing";
import { Object3D } from "three";

type OutlineInstanceProps = {
    selection?: Object3D | Object3D[] | null;
    color: number;
    xRay?: boolean;
    width?: number;
    edgeStrength?: number;
};

function OutlineInstance({
    selection,
    color,
    xRay = true,
    width = 2000,
    edgeStrength = 5,
}: OutlineInstanceProps) {
    if (!selection) return null;

    const sel = Array.isArray(selection) ? selection : [selection];

    return (
        <Outline
            selection={sel}
            selectionLayer={10}
            width={width}
            blendFunction={BlendFunction.ALPHA}
            edgeStrength={edgeStrength}
            resolutionScale={2}
            pulseSpeed={0}
            visibleEdgeColor={color}
            hiddenEdgeColor={color}
            blur
            xRay={xRay}
        />
    );
}

export default OutlineInstance