Odometer image previews infinitely loading

[Julesssss]

Problem

The image preview on the odometer distance page is loading indefinitely.

From @DylanDylann:

From my investigation, it seems to be caused by not resetting the isLoading state in ImageWithLoading. We may need to set isLoading to false in onLoadEnd.

Issue Owner

Current Issue Owner: @jakubkalinski0

[Julesssss]

@DylanDylann would you like to work on this while Jakub completes his other PRs?

[Julesssss]

@MelvinBot investigate this bug

[MelvinBot]

Proposal

Please re-state the problem that we are trying to solve in this issue.

The image preview on the odometer distance page shows an infinite loading spinner instead of displaying the captured photo.

What is the root cause of that problem?

The odometer ReceiptImage components at IOURequestStepDistanceOdometer.tsx:609 and line 651 set isAuthTokenRequired (bare JSX = true), even though the image sources are local blob URLs (created via URL.createObjectURL at line 265) or native file URIs that never need authentication.

When isAuthTokenRequired=true, Image/index.tsx:122-130 injects auth headers into the source. On web, BaseImage.tsx then passes this to useCachedImageSource, which returns null while it async-fetches the blob URL with headers. Meanwhile, BaseImage manually fires onLoadStart (line 29), causing ImageWithLoading to set isLoading=true. But since ExpoImage receives source={null}, it renders nothing and never fires onLoad or onError — the only two callbacks that reset isLoading to false (lines 62 and 57).

Additionally, if the session is expired, Image/index.tsx returns undefined for the source (line 135) and triggers the waitForSession callback, which also sets isLoading=true (line 106) with no path to reset it until reauthentication completes.

What changes do you think we should make in order to solve the problem?

Root cause fix: Remove isAuthTokenRequired from both ReceiptImage instances in IOURequestStepDistanceOdometer.tsx (lines 609 and 651). Local blob URLs and file URIs do not need authentication tokens, so the auth-header injection and session-based source management should be bypassed entirely.

Defensive fix: Add an onLoadEnd handler to ImageWithLoading.tsx that resets isLoading to false. This ensures the loading state is always cleared regardless of how the image load completes, protecting against similar issues in other contexts. The onLoadEnd type is already defined in Image/types.ts:64 but is not currently used by ImageWithLoading.

What alternative solutions did you explore? (Optional)

Only applying the onLoadEnd safety net without removing isAuthTokenRequired would fix the symptom but leave unnecessary auth-header injection on local files, which adds overhead and could cause subtle issues. Only removing isAuthTokenRequired fixes this specific case but leaves ImageWithLoading vulnerable to similar stuck-loading bugs whenever onLoad/onError fail to fire for any reason. Both changes together are recommended.

---

Next Steps for Contributor+ team: Reply with @MelvinBot implement this to create a draft PR, @MelvinBot <your feedback> to refine this analysis, or explain why you are rejecting Melvin's proposal.