fix: issue #482 (Ashigaru)

[fatherlinux]

Fixes #482.

Autonomous Ashigaru run — Claude Code (claude-sonnet-4-6, tier 1) in a sealed, unprivileged sandbox. Worked from an airlock-filtered brief. Draft, pending CI + human review. run_id: rotv-482-1781734890

[gemini-code-assist]

Code Review

This pull request simplifies the Sidebar component by removing the mobilePhotosVisible state and streamlining the conditional rendering of media elements. The review feedback identifies a usability issue where the POI navigation buttons are unresponsive to mouse clicks on mobile-width screens because the navigation logic is bound to onTouchEnd while onClick is a no-op. It is recommended to move the navigation logic directly into the onClick handler to ensure compatibility across all input devices.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

[gemini-code-assist]

On mobile-width screens (such as desktop browsers resized for testing, or mobile devices using pointing devices like a mouse or trackpad), these navigation buttons are completely unresponsive to clicks. This happens because pointing devices do not trigger onTouchEnd, and the onClick handler is a no-op that only prevents default behavior and propagation.

Since debouncedNavigate already implements a 300ms debounce mechanism to prevent rapid/double triggering, we can safely remove the onTouchEnd handler and perform the navigation directly inside the onClick handler. This simplifies the code and ensures pointing devices work correctly on mobile-width screens.

          {isMobile && !isEditing && !permalinkInfo && onNavigate && poiNavigationList && poiNavigationList.length > 1 && media.length > 0 && (
            <>
              {currentIndex > 0 && (
                <button
                  className="image-nav-btn image-nav-prev"
                  onClick={(e) => {
                    e.preventDefault();
                    e.stopPropagation();
                    debouncedNavigate('prev');
                  }}
                  aria-label="Previous POI"
                >
                  <span className="image-nav-chevron">‹</span>
                </button>
              )}
              {currentIndex < poiNavigationList.length - 1 && (
                <button
                  className="image-nav-btn image-nav-next"
                  onClick={(e) => {
                    e.preventDefault();
                    e.stopPropagation();
                    debouncedNavigate('next');
                  }}
                  aria-label="Next POI"
                >
                  <span className="image-nav-chevron">›</span>
                </button>
              )}
            </>
          )}

[gemini-code-assist]

On mobile-width screens (such as desktop browsers resized for testing, or mobile devices using pointing devices like a mouse or trackpad), these navigation buttons are completely unresponsive to clicks. This happens because pointing devices do not trigger onTouchEnd, and the onClick handler is a no-op that only prevents default behavior and propagation.

Since debouncedNavigate already implements a 300ms debounce mechanism to prevent rapid/double triggering, we can safely remove the onTouchEnd handler and perform the navigation directly inside the onClick handler. This simplifies the code and ensures pointing devices work correctly on mobile-width screens.

        {isMobile && !isEditing && !permalinkInfo && onNavigate && poiNavigationList && poiNavigationList.length > 1 && media.length > 0 && (
          <>
            {currentIndex > 0 && (
              <button
                className="image-nav-btn image-nav-prev"
                onClick={(e) => {
                  e.preventDefault();
                  e.stopPropagation();
                  debouncedNavigate('prev');
                }}
                aria-label="Previous POI"
              >
                <span className="image-nav-chevron">‹</span>
              </button>
            )}
            {currentIndex < poiNavigationList.length - 1 && (
              <button
                className="image-nav-btn image-nav-next"
                onClick={(e) => {
                  e.preventDefault();
                  e.stopPropagation();
                  debouncedNavigate('next');
                }}
                aria-label="Next POI"
              >
                <span className="image-nav-chevron">›</span>
              </button>
            )}
          </>
        )}