Three.js geometry not visible properly

Hi Guys
I am working on a boolean functionality (maching operations), using this library.

Below is the json data for groove and ,milling operation that needs to be applied on a board

 {
              "type": "Groove", //GROOVE
              "depth":15,
              "width": 15,
              "length": 960,
              "position": {
                 "x": 1,
                "x": 0,
                "z": 0,
              }
            },
			 {
              "$type": "Milling", //MILLING
              "depth": 30,
              "path": [
                {
                  "type": "MachiningVertex",
                  "pointX": 810,
                  "pointY": 118.195,
                  "pointZ": 0,
                  "bulge": 0
                },
                {
                 
                   "type": "MachiningVertex",
                  "pointX": 702.915,
                  "pointY": 118.195,
                  "pointZ": 0,
                  "bulge": -0.3576277811100314
                },
                {
                
               "type": "MachiningVertex",
                  "pointX": 702.915,
                  "pointY": 619.732,
                  "pointZ": 0,
                  "bulge": 0
                },
                {
            
                 "type": "MachiningVertex",
                  "pointX": 764.094,
                  "pointY": 619.732,
                  "pointZ": 0,
                  "bulge": 0
                },
                {
         
                "type": "MachiningVertex",
                  "pointX": 764.094,
                  "pointY": 869.406,
                  "pointZ": 0,
                  "bulge": 0
                },
                {

                  "type": "MachiningVertex",
                  "pointX": 810,
                  "pointY": 869.406,
                  "pointZ": 0,
                  "bulge": 0
                },
                {
                  "pointX": 810,
                  "pointY": 1000,
                  "pointZ": 0,
                  "bulge": 0
                }
              ],
              "position": {
                "z": 100,
                "y": 20,
                "z": 0,
                
              }
            },

I read the data and apply the operation to my basemesh like given below and instead of adding base mesh i add resulted mesh using the below function.

applyMachiningOperations(baseMesh, machining) {
    let resultMesh = baseMesh.clone();
    if (resultMesh instanceof THREE.Mesh &&
      (resultMesh.geometry instanceof THREE.BufferGeometry)) {
        let geometry, operatedMesh
        switch (true) {
          case operation.type.includes("Groove"):
            geometry = new THREE.BoxGeometry(operation.width, operation.length, operation.depth);
            break; */
          case operation.type.includes("Milling"):
            geometry = new THREE.TubeGeometry(
              new THREE.CatmullRomCurve3(operation.path.map(pt => new THREE.Vector3(pt.pointX, pt.pointY, pt.pointZ))),
              64,
              operation.depth,
              8,
              false
            );
            break;
        
          default:
            console.error("Unsupported operation type:", operation.$type);
            return;
        }

        operatedMesh = new THREE.Mesh(geometry, new THREE.MeshPhongMaterial({ 
          color: 0xffff00
        
        }));
        this.scene().add(operatedMesh)
        operatedMesh.applyMatrix4(matrix);
        resultMesh.updateMatrix();
        operatedMesh.updateMatrix()
        resultMesh = CSG.subtract(resultMesh, operatedMesh);
      });
      return resultMesh
    }

I am perfectly able to create resulted mesh for groove but for milling i am faccing material issue. please refer to the image attached.

The issue, that i am facing is: if faces of two meshes are on top of each other, they are z-fighting.
See circle B, in diagram, for for the z-fighting issue. I tried to resolve it by doing the following things:

  1. polygonOffset = true, polygonOffsetUnits = 1, polygonOffsetFactor = 1,resultMesh.material.needsUpdate = true

  2. logarithmicDepthBuffer: true


    Here you see “dark blue” color, because there is another mesh present on the other side of the light blue mesh.
    Both of these meshes are important and their positions cannot be changed.

is it beacause i am using the wrong geomtery for the data for milling operations or do you guys have any idea what would be the best approach to do so.