tree fe917e628d4ce1a671a15d1430668e92983289c4
parent 7351cd9b711db0e828d22d995fe56c7f9f6ddb07
author David Crawshaw <david@zentus.com> 1749939453 +0000
committer David Crawshaw <david@zentus.com> 1749943207 -0700

webui: add URL parameters for diff view from/to commit selection

Enable direct linking to specific diff ranges by adding URL parameters that
sync with the diff range picker controls, allowing users to bookmark and
share specific diff views.

Problem Analysis:
Users couldn't link directly to specific diff ranges in the sketch diff view.
The from/to commit selectors would reset to defaults on page load, making it
impossible to bookmark or share links to specific commit comparisons. This
created friction when collaborating or returning to specific diff views.

Implementation Changes:

1. URL Parameter Synchronization (sketch-diff-range-picker.ts):
   - Added updateUrlParams() to write from/to/commit parameters to URL
   - Integrated URL updates into dispatchRangeEvent() for automatic sync
   - Used history.replaceState() to update URL without page reload
   - Clear unused parameters when switching between range/single modes

2. URL Parameter Initialization:
   - Added initializeFromUrlParams() to read URL parameters on load
   - Parse 'from'/'to' parameters for range mode initialization
   - Parse 'commit' parameter for single commit mode initialization
   - Return flag indicating successful URL-based initialization

3. Load Flow Enhancement:
   - Modified loadCommits() to check URL parameters before setting defaults
   - Skip default commit selection when URL parameters are present
   - Always dispatch range event to ensure diff view updates correctly

4. Browser Navigation Support:
   - Added popstate event listener for browser back/forward navigation
   - Implemented handlePopState() to re-initialize from URL parameters
   - Force component re-render and event dispatch on navigation

5. Mode Switching Improvements:
   - Enhanced setRangeType() with better default handling
   - Auto-populate missing commits when switching between modes
   - Maintain proper URL state during mode transitions

Technical Details:
- URL parameters: 'from', 'to' for range mode; 'commit' for single mode
- Empty 'to' parameter represents uncommitted changes (working directory)
- Parameters removed from URL when switching to incompatible modes
- Browser history updated without triggering page reloads
- Component lifecycle properly manages event listeners

URL Format Examples:
- Range mode: ?view=diff2&from=abc123&to=def456
- Uncommitted: ?view=diff2&from=abc123 (no 'to' parameter)
- Single commit: ?view=diff2&commit=abc123

Benefits:
- Direct linking to specific diff ranges via URL
- Bookmarkable diff views for easy return navigation
- Shareable links for collaboration and code review
- Browser back/forward navigation works correctly
- URL reflects current diff state at all times
- Seamless integration with existing diff view functionality

Testing:
- Verified URL updates when changing from/to commit selectors
- Confirmed URL initialization on page load with parameters
- Tested browser back/forward navigation updates UI correctly
- Validated mode switching (range ↔ single) updates URL appropriately
- Ensured uncommitted changes mode removes 'to' parameter
- Confirmed sharing URLs loads correct diff view state

This enhancement enables direct linking and improved navigation for the
sketch diff view while maintaining all existing functionality and providing
seamless URL-based state management.

Co-Authored-By: sketch <hello@sketch.dev>
Change-ID: sbf02a6a8bb4db673k