MOBILE-4168 core: Send to reconnect page in auth guard

src/core/features/login/pages/reconnect/reconnect.html

@@ -10,6 +10,7 @@
     </ion-toolbar>
 </ion-header>
 <ion-content class="ion-padding" (keydown)="keyDown($event)" (keyup)="keyUp($event)">
+    <core-loading [hideUntil]="!showLoading">
         <div class="list-item-limited-width">
             <div class="ion-text-wrap ion-text-center ion-margin-bottom" [ngClass]="{'item-avatar-center': showSiteAvatar}">
                 <!-- Show user avatar. -->
@@ -42,7 +43,7 @@
                         <p>{{username}}</p>
                     </ion-label>
                 </ion-item>
-            <ion-item class="ion-margin-bottom">
+                <ion-item class="ion-margin-bottom" *ngIf="!isBrowserSSO">
                     <ion-label class="sr-only">{{ 'core.login.password' | translate }}</ion-label>
                     <core-show-password name="password">
                         <ion-input class="core-ioninput-password" name="password" type="password"
@@ -55,15 +56,21 @@
                     <ion-button expand="block" fill="outline" (click)="cancel($event)" class="ion-margin ion-text-wrap">
                         {{ 'core.login.cancel' | translate }}
                     </ion-button>
-                <ion-button type="submit" expand="block" [disabled]="!credForm.valid"
+                    <ion-button *ngIf="!isBrowserSSO" type="submit" expand="block" [disabled]="!credForm.valid"
                         class="ion-margin core-login-login-button ion-text-wrap">
                         {{ 'core.login.loginbutton' | translate }}
                     </ion-button>
                 </div>
 
-            <ng-container *ngIf="showScanQR">
+                <ion-button expand="block" *ngIf="isBrowserSSO" (click)="openBrowserSSO()"
+                    class="ion-margin core-login-login-button ion-text-wrap">
+                    {{ 'core.login.loginbutton' | translate }}
+                </ion-button>
+
+                <ng-container *ngIf="showScanQR && !isBrowserSSO">
                     <div class="ion-text-center ion-padding core-login-site-qrcode-separator">{{ 'core.login.or' | translate }}</div>
-                <ion-button expand="block" fill="outline" class="ion-margin core-login-site-qrcode" (click)="showInstructionsAndScanQR()">
+                    <ion-button expand="block" fill="outline" class="ion-margin core-login-site-qrcode"
+                        (click)="showInstructionsAndScanQR()">
                         <ion-icon slot="start" name="fas-qrcode" aria-hidden="true"></ion-icon>
                         {{ 'core.scanqr' | translate }}
                     </ion-button>
@@ -86,8 +93,9 @@
                         <h3 class="item-heading">{{ 'core.login.potentialidps' | translate }}</h3>
                     </ion-label>
                 </ion-item>
-            <ion-button [fill]="'outline'" *ngFor="let provider of identityProviders" class="ion-text-wrap ion-margin core-oauth-provider"
+                <ion-button [fill]="'outline'" *ngFor="let provider of identityProviders"
-                (click)="oauthClicked(provider)" [attr.aria-label]="provider.name" expand="block">
+                    class="ion-text-wrap ion-margin core-oauth-provider" (click)="oauthClicked(provider)" [attr.aria-label]="provider.name"
+                    expand="block">
                     <img [src]="provider.iconurl" alt="" width="32" height="32" slot="start">
                     <ion-label>{{ provider.name }}</ion-label>
                 </ion-button>
@@ -100,4 +108,5 @@
                 </ion-button>
             </ion-list>
         </div>
+    </core-loading>
 </ion-content>

src/core/features/login/pages/reconnect/reconnect.ts

@@ -49,10 +49,12 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
     identityProviders?: CoreSiteIdentityProvider[];
     showForgottenPassword = true;
     showSiteAvatar = false;
+    isBrowserSSO = false;
     isOAuth = false;
     isLoggedOut: boolean;
     siteId!: string;
     showScanQR = false;
+    showLoading = true;
 
     protected siteConfig?: CoreSitePublicConfigResponse;
     protected viewLeft = false;
@@ -107,6 +109,8 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
             this.showSiteAvatar = !!this.userAvatar && !CoreLoginHelper.getFixedSites();
 
             this.checkSiteConfig(site);
+
+            this.showLoading = false;
         } catch (error) {
             CoreDomUtils.showErrorModal(error);
 
@@ -151,6 +155,7 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
             CoreEvents.trigger(CoreEvents.LOGIN_SITE_CHECKED, { config: this.siteConfig });
         }
 
+        this.isBrowserSSO = !this.isOAuth && CoreLoginHelper.isSSOLoginNeeded(this.siteConfig.typeoflogin);
         this.showScanQR = CoreLoginHelper.displayQRInSiteScreen() ||
             CoreLoginHelper.displayQRInCredentialsScreen(this.siteConfig.tool_mobile_qrcodetype);
 
@@ -251,6 +256,23 @@ export class CoreLoginReconnectPage implements OnInit, OnDestroy {
         CoreLoginHelper.forgottenPasswordClicked(this.siteUrl, this.username, this.siteConfig);
     }
 
+    /**
+     * Open browser for SSO login.
+     */
+    openBrowserSSO(): void {
+        if (!this.siteConfig) {
+            return;
+        }
+
+        CoreLoginHelper.confirmAndOpenBrowserForSSOLogin(
+            this.siteUrl,
+            this.siteConfig.typeoflogin,
+            undefined,
+            this.siteConfig.launchurl,
+            this.redirectData,
+        );
+    }
+
     /**
      * An OAuth button was clicked.
      *

src/core/features/mainmenu/guards/auth.ts

@@ -15,6 +15,7 @@
 import { Injectable } from '@angular/core';
 import { CanLoad, CanActivate, UrlTree } from '@angular/router';
 import { CoreLoginHelper } from '@features/login/services/login-helper';
+import { CoreApp } from '@services/app';
 
 import { CoreSites } from '@services/sites';
 import { Router } from '@singletons';
@@ -45,9 +46,22 @@ export class CoreMainMenuAuthGuard implements CanLoad, CanActivate {
         }
 
         if (CoreLoginHelper.isSiteLoggedOut()) {
-            await CoreSites.logout();
+            // Send the user to reconnect page.
+            const newRoute = Router.parseUrl('/login/reconnect');
+            const siteId = CoreSites.getCurrentSiteId();
 
-            return Router.parseUrl('/login');
+            // Pass redirect data (if any and belongs to same site).
+            let redirect = CoreApp.consumeMemoryRedirect();
+            if (!redirect?.timemodified || Date.now() - redirect.timemodified > 20000 || redirect.siteId !== siteId) {
+                redirect = null;
+            }
+
+            newRoute.queryParams = {
+                siteId,
+                ...redirect,
+            };
+
+            return newRoute;
         }
 
         return true;