Allow diffing with @codemirror/merge

[jtpio]

Expand the current functionality with a new command to allow creating diffs on the frontend via @codemirror/merge: https://github.com/codemirror/merge

With @codemirror/merge, we don't need to rely on nbdime running on the server to produce a diff.

It may also open the door for deeper integration with the existing notebook code cells (partial diff acceptance, reuse of JupyterLab codemirror extensions...).

For now, maybe we can still keep both since the two views have different styling, and the commands are meant to be used programmatically by other extensions. And nbdime could diff whole notebooks.

• Expose two commands to add diffs to the cell input footer, with codemirror or nbdime
• Add accept and reject commands to the codemirror diff view
• Make opening the diff by default a command argument
• Show the approve / reject buttons via a command argument

@codemirror/merge

jupyterlab-cell-diff-codemirror.mp4

nbdime

jupyterlab-cell-diff-nbdime-2.mp4

To test

jupyter lab --expose-app-in-browser

Example command:

await window.jupyterapp.commands.execute('jupyterlab-cell-diff:show-codemirror', {
      originalSource: `import math

  def calculate_area(radius):
      return math.pi * radius * radius

  def calculate_circumference(radius):
      return 2 * math.pi * radius

  # Test with a circle
  r = 5
  area = calculate_area(r)
  circumference = calculate_circumference(r)

  print(f"Radius: {r}")
  print(f"Area: {area}")
  print(f"Circumference: {circumference}")`,

      newSource: `import math

  def calculate_area(radius):
      """Calculate the area of a circle"""
      if radius < 0:
          raise ValueError("Radius cannot be negative")
      return math.pi * radius ** 2

  def calculate_circumference(radius):
      """Calculate the circumference of a circle"""
      if radius < 0:
          raise ValueError("Radius cannot be negative")
      return 2 * math.pi * radius

  def circle_info(radius):
      """Get complete circle information"""
      area = calculate_area(radius)
      circumference = calculate_circumference(radius)
      return {"radius": radius, "area": area, "circumference": 
  circumference}

  # Test with multiple circles
  for r in [3, 5, 7.5]:
      info = circle_info(r)
      print(f"Circle with radius {info['radius']}: 
  area={info['area']:.2f}, 
  circumference={info['circumference']:.2f}")`,

      cellId: '19ec5632-7f22-48c2-b3f7-4c175683f34a',
      notebookPath: 'Untitled1.ipynb'
  });

[jtpio]

The extension in action:

jupyterlite-ai-diffs-2.mp4

[jtpio]

Happy to take a look #5 after as a follow-up.

[Zsailer]

This is awesome. Thank you @jtpio !

[jtpio]

Just opened #8 as a follow-up.

Maybe we could try to get #8 in, and then aim for a 0.5.0 release?

There is also jupyter-ai-contrib/jupyterlab-magic-wand#13 to update to the new command name.