Update mobile app sign in page (#4264)
# What this PR does Changed the text of the deep link sign in button and reorders the sections so that the qr code is on top in mobile mode ## Which issue(s) this PR closes Closes https://github.com/grafana/oncall-mobile-app/issues/605 ## Checklist - [x] Unit, integration, and e2e (if applicable) tests updated - [x] Documentation added (or `pr:no public docs` PR label added if not required) - [x] Added the relevant release notes label (see labels prefixed w/ `release:`). These labels dictate how your PR will show up in the autogenerated release notes.
This commit is contained in:
parent
9afbcfc063
commit
5188a8d7b8
4 changed files with 79 additions and 79 deletions
|
|
@ -203,10 +203,10 @@ export const MobileAppConnection = observer(({ userPk }: Props) => {
|
|||
</Block>
|
||||
)}
|
||||
<Block shadowed bordered withBackground className={cx('container__box')}>
|
||||
<DownloadIcons />
|
||||
{content}
|
||||
</Block>
|
||||
<Block shadowed bordered withBackground className={cx('container__box')}>
|
||||
{content}
|
||||
<DownloadIcons />
|
||||
</Block>
|
||||
</div>
|
||||
{mobileAppIsCurrentlyConnected && isCurrentUser && !disconnectingMobileApp && (
|
||||
|
|
|
|||
|
|
@ -15,6 +15,25 @@ exports[`MobileAppConnection it shows a QR code if the app isn't already connect
|
|||
<div
|
||||
class="container"
|
||||
>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<div
|
||||
class="css-1yjvs5a"
|
||||
>
|
||||
Loading...
|
||||
|
||||
<div
|
||||
class="css-1tqtz24"
|
||||
data-testid="Spinner"
|
||||
>
|
||||
<i
|
||||
aria-label="loading spinner"
|
||||
class="fa fa-spinner fa-spin fa-spin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
|
|
@ -101,25 +120,6 @@ exports[`MobileAppConnection it shows a QR code if the app isn't already connect
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<div
|
||||
class="css-1yjvs5a"
|
||||
>
|
||||
Loading...
|
||||
|
||||
<div
|
||||
class="css-1tqtz24"
|
||||
data-testid="Spinner"
|
||||
>
|
||||
<i
|
||||
aria-label="loading spinner"
|
||||
class="fa fa-spinner fa-spin fa-spin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -141,6 +141,25 @@ exports[`MobileAppConnection it shows a loading message if it is currently disco
|
|||
<div
|
||||
class="container"
|
||||
>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<div
|
||||
class="css-1yjvs5a"
|
||||
>
|
||||
Loading...
|
||||
|
||||
<div
|
||||
class="css-1tqtz24"
|
||||
data-testid="Spinner"
|
||||
>
|
||||
<i
|
||||
aria-label="loading spinner"
|
||||
class="fa fa-spinner fa-spin fa-spin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
|
|
@ -227,25 +246,6 @@ exports[`MobileAppConnection it shows a loading message if it is currently disco
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<div
|
||||
class="css-1yjvs5a"
|
||||
>
|
||||
Loading...
|
||||
|
||||
<div
|
||||
class="css-1tqtz24"
|
||||
data-testid="Spinner"
|
||||
>
|
||||
<i
|
||||
aria-label="loading spinner"
|
||||
class="fa fa-spinner fa-spin fa-spin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -267,6 +267,25 @@ exports[`MobileAppConnection it shows a loading message if it is currently fetch
|
|||
<div
|
||||
class="container"
|
||||
>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<div
|
||||
class="css-1yjvs5a"
|
||||
>
|
||||
Loading...
|
||||
|
||||
<div
|
||||
class="css-1tqtz24"
|
||||
data-testid="Spinner"
|
||||
>
|
||||
<i
|
||||
aria-label="loading spinner"
|
||||
class="fa fa-spinner fa-spin fa-spin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
|
|
@ -353,25 +372,6 @@ exports[`MobileAppConnection it shows a loading message if it is currently fetch
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<div
|
||||
class="css-1yjvs5a"
|
||||
>
|
||||
Loading...
|
||||
|
||||
<div
|
||||
class="css-1tqtz24"
|
||||
data-testid="Spinner"
|
||||
>
|
||||
<i
|
||||
aria-label="loading spinner"
|
||||
class="fa fa-spinner fa-spin fa-spin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -434,6 +434,15 @@ exports[`MobileAppConnection it shows an error message if there was an error dis
|
|||
<div
|
||||
class="container"
|
||||
>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<span
|
||||
class="css-77ouhj--primary css-77ouhj--medium css-1d6rs0l"
|
||||
>
|
||||
There was an error disconnecting your mobile app. Please try again.
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
|
|
@ -520,15 +529,6 @@ exports[`MobileAppConnection it shows an error message if there was an error dis
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<span
|
||||
class="css-77ouhj--primary css-77ouhj--medium css-1d6rs0l"
|
||||
>
|
||||
There was an error disconnecting your mobile app. Please try again.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -550,6 +550,15 @@ exports[`MobileAppConnection it shows an error message if there was an error fet
|
|||
<div
|
||||
class="container"
|
||||
>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<span
|
||||
class="css-77ouhj--primary css-77ouhj--medium css-1d6rs0l"
|
||||
>
|
||||
There was an error fetching your QR code. Please try again.
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
|
|
@ -636,15 +645,6 @@ exports[`MobileAppConnection it shows an error message if there was an error fet
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="css-1x53p5e css-1x53p5e--bordered css-1x53p5e--shadowed css-1x53p5e--withBackGround container__box"
|
||||
>
|
||||
<span
|
||||
class="css-77ouhj--primary css-77ouhj--medium css-1d6rs0l"
|
||||
>
|
||||
There was an error fetching your QR code. Please try again.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export const LinkLoginButton: FC<Props> = (props: Props) => {
|
|||
window.open(mobileDeepLink, '_blank');
|
||||
}}
|
||||
>
|
||||
Sign in
|
||||
Connect Mobile App
|
||||
</Button>
|
||||
</VerticalGroup>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ exports[`LinkLoginButton it renders properly 1`] = `
|
|||
<span
|
||||
class="css-1riaxdn"
|
||||
>
|
||||
Sign in
|
||||
Connect Mobile App
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue