fix(replay): fix weird loading of screen name (#73115)

for mobile replays, because the `isVideoReplay` check was not working
right away (data is still loading), it was rendering a double screen
name. weird behavior, so i'm putting in a loading placeholder when
`isLoading` is true.



before:


https://github.com/getsentry/sentry/assets/56095982/941ef3af-fad1-4dcb-bd34-23be182c760c

after:


https://github.com/getsentry/sentry/assets/56095982/4183cd69-bca8-400e-923e-65e632794b2d

static/app/components/replays/replayView.tsx

@@ -8,6 +8,7 @@ import ReplayCurrentUrl from 'sentry/components/replays/replayCurrentUrl';
 import ReplayPlayer from 'sentry/components/replays/replayPlayer';
 import ReplayProcessingError from 'sentry/components/replays/replayProcessingError';
 import {ReplaySidebarToggleButton} from 'sentry/components/replays/replaySidebarToggleButton';
+import TextCopyInput from 'sentry/components/textCopyInput';
 import {space} from 'sentry/styles/space';
 import useIsFullscreen from 'sentry/utils/window/useIsFullscreen';
 import Breadcrumbs from 'sentry/views/replays/detail/breadcrumbs';
@@ -32,7 +33,15 @@ function ReplayView({toggleFullscreen, isLoading}: Props) {
       <PlayerBreadcrumbContainer>
         <PlayerContainer>
           <ContextContainer>
-            {isVideoReplay ? <ReplayCurrentScreen /> : <ReplayCurrentUrl />}
+            {isLoading ? (
+              <TextCopyInput size="sm" disabled>
+                {''}
+              </TextCopyInput>
+            ) : isVideoReplay ? (
+              <ReplayCurrentScreen />
+            ) : (
+              <ReplayCurrentUrl />
+            )}
             <BrowserOSIcons showBrowser={!isVideoReplay} isLoading={isLoading} />
             {isFullscreen ? (
               <ReplaySidebarToggleButton