Enhance Diff View

[NaccOll]

Related GitHub Issue

Relate: #7285

Description

The diff view only shows the differences between the current checkpoint and the next one.

This PR enhances the diff view by adding three modes.

full: Shows the changes between the first checkpoint and the current workspace. Currently, this can only be triggered via the button that appears when a task is completed.(Delete this button according to the discussion)

from-init: Shows the changes between the first checkpoint and the selected checkpoint. This can be triggered from any checkpoint menu.

to-current: Shows the changes between the selected checkpoint and the current checkpoint. This can be triggered from any checkpoint menu.

Test Procedure

Simply turn on the checkpoint feature and trigger the file modification with llm. The checkpoint menu will have a more button, click it to see two new view buttons

Pre-Submission Checklist

• Issue Linked: This PR is linked to an approved GitHub Issue (see "Related GitHub Issue" above).
• Scope: My changes are focused on the linked issue (one major feature/fix per PR).
• Self-Review: I have performed a thorough self-review of my code.
• Testing: New and/or updated tests have been added to cover my changes (if applicable).
• Documentation Impact: I have considered if my changes require documentation updates (see "Documentation Updates" section below).
• Contribution Guidelines: I have read and agree to the Contributor Guidelines.

Screenshots / Videos

Documentation Updates

Need to update the documentation description of the checkpoint section

Additional Notes

Get in Touch

NaccOll

---

Important

Enhance diff view with new modes full, from-init, and to-current for improved checkpoint comparisons.

• Behavior:
  • Adds three diff view modes: full, from-init, and to-current in checkpointDiff function in index.ts.
  • full: Compares from the first checkpoint to the current workspace.
  • from-init: Compares from the first checkpoint to the selected checkpoint.
  • to-current: Compares from the selected checkpoint to the current workspace.
• UI Components:
  • Updates CheckpointMenu.tsx to include options for new diff modes.
  • Adds hasCheckpoint prop to ChatRow.tsx and ChatView.tsx to manage UI state.
• Tests:
  • Modifies checkpoint.test.ts to test to-current mode.
• Schema:
  • Updates WebviewMessage.ts to include new modes in checkoutDiffPayloadSchema.

^{This description was created by for 588fae7. You can customize this summary. It will automatically update as commits are pushed.}

[roomote]

Thank you for your contribution! I've reviewed the changes and found that this is a solid implementation of the diff view enhancements. The three new modes (from-init, to-current, and full) provide valuable functionality for viewing checkpoint differences. I have some suggestions for improvement, particularly around edge case handling.

[roomote]

Consider extracting this switch logic into a separate function for better testability and readability. Something like:

This would make the logic easier to unit test independently.

[daniel-lxs]

Hey @NaccOll I like this idea! It does worry me that the "View Diff With First Checkpoint" button might be a bit too prominent and also a bit confusing, should we look into a different way of showing the diff at the end of the task? I would love to have some feedback from @brunobergher.

[NaccOll]

Hey @NaccOll I like this idea! It does worry me that the "View Diff With First Checkpoint" button might be a bit too prominent and also a bit confusing, should we look into a different way of showing the diff at the end of the task? I would love to have some feedback from @brunobergher.

Once the team has final ideas on the UI, let me know and I'll make changes.

[brunobergher]

I can see the value in this, but I worry about adding so many buttons to a UI element which appears multiple times in a conversation, especially for a relatively secondary scenario (basic diffs are probably enough for 80% of the case, and the remainder would be served by this).

I'd propose moving the selector of the type of differ elsewhere

1. My preference would be in the diff view itself, at the very top, as toggle buttons/tabs. That way the user can change their mind about the diff anchor while looking at it.
2. If not there, I'd make the "View Diff" button in the checkpoint ChatRow item a dropdown, giving users the option of which diff type to choose. It avoids clutter, even if it still forces a choice when most of the time people will want the first option.

[NaccOll]

1. My preference would be in the diff view itself, at the very top, as toggle buttons/tabs. That way the user can change their mind about the diff anchor while looking at it.

This sounds like a major UI/UX overhaul, and I'll just have to wait for the team to finish it if they choose to do it.

2. If not there, I'd make the "View Diff" button in the checkpoint ChatRow item a dropdown, giving users the option of which diff type to choose. It avoids clutter, even if it still forces a choice when most of the time people will want the first option.

This is a small adjustment, but there seems to be no mention of the logic of how full mode should be triggered. Perhaps I could create a checkpoint before calling attempt_completion to ensure UI consistency?

@daniel-lxs What do you think about this?

[daniel-lxs]

I'm not sure what the best way to do this. Bruno has more knowledge about what this should look like and where to place it.

I would recommend following either one of Bruno's recommendation since ultimately he is making the calls on how the UI should look like nowadays.

[daniel-lxs]

Thank you @NaccOll
I made some adjustments to the translations and I couldn't push to this PR so I created this one #8796