fabric.js updating Line coordinates inside of a Group

Question

I have set up the functionality that I want with a regular line using fabric.js. See the code pen below. I can hit the add arrow button to add a line to the canvas and then double click on the line to see 2 circles show up that I can then drag around to move either end of the line.

https://codepen.io/jrabes/pen/KKZEBVe

I want to make this line an arrow with the same functionality. When I add the line and a triangle for the arrow head to a fabric.Group and then try to update the coordinates for the line, the line gets thrown out of the group and I can't select it anymore. I set up a code pen with what I've been trying below.

https://codepen.io/jrabes/pen/VwyRBVp

After double clicking on the line in the group and moving the left circle:
Group selected and still showing original line location after editing line:

I'm not attached to this particular set up at all, so if there is a different/easier way to get an arrow set up with the ability to edit the endpoints I would love that.