D3js Enable X-Axis Re-Scale on Zoom

I have a Dynamic chart that has got a zoom, but on zoom the X-Axis just stretches and also exits my set Clip-Path. Could anyone help me in resolving both these issues, they seem like a simple fix, but I’m new to D3, so I’d appreciate any help.

Working Code Here: https://codesandbox.io/s/x-axis-stretching-kbz88l?file=/index.html