feat(replay): Gap in replay timeline

[c298lee]

Creates gaps in the timeline between App in Background and App in Foreground frames. If there's no App in Foreground frame after App in Background, the gap continues to the end of the replay.

Example gap:

Example gap to end of replay:

Relates to https://github.com/getsentry/sentry/issues/71665

[codecov[bot]]

Bundle Report

Changes will decrease total bundle size by 41.91kB :arrow_down:

Bundle name	Size	Change
app-webpack-bundle-array-push	27.25MB	41.91kB :arrow_down:

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 47.36842% with 20 lines in your changes missing coverage. Please review.

Project coverage is 78.06%. Comparing base (0298eef) to head (e78f667). Report is 160 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master   #73475      +/-   ##
==========================================
+ Coverage   78.01%   78.06%   +0.04%     
==========================================
  Files        6635     6645      +10     
  Lines      296747   296932     +185     
  Branches    51109    51140      +31     
==========================================
+ Hits       231512   231790     +278     
+ Misses      58851    58827      -24     
+ Partials     6384     6315      -69     

Files	Coverage Δ
.../components/replays/breadcrumbs/replayTimeline.tsx	76.92% <100.00%> (+0.92%)	:arrow_up:
static/app/utils/replays/replayReader.tsx	84.37% <100.00%> (+0.24%)	:arrow_up:
static/app/utils/replays/types.tsx	74.46% <100.00%> (+2.37%)	:arrow_up:
...pp/components/replays/breadcrumbs/timelineGaps.tsx	33.33% <33.33%> (ø)

... and 216 files with indirect coverage changes

[michellewzhang]

would be good to test with a few more replays (especially those with multiple gaps) before merging - you can ping @romtsn or @brustolin or @krystofwoldrich to generate some!

[krystofwoldrich]

Here is an Android example replay with multiple app suspensions. Looks good.