From 990bcc0f6ee9d4cfab74904cea62273a1b7757eb Mon Sep 17 00:00:00 2001
From: alexm <alexm@verdnatura.es>
Date: Wed, 28 Dec 2022 11:18:53 +0100
Subject: [PATCH] feat(app): only use ui-view for routing

---
 e2e/helpers/selectors.js                      |  2 +-
 e2e/paths/01-salix/04_recoverPassword.spec.js |  5 +-
 front/core/services/auth.js                   |  2 +-
 front/salix/components/app/app.html           |  8 +--
 front/salix/components/app/app.js             |  6 --
 front/salix/components/login/login.html       | 57 +++++++++----------
 front/salix/components/login/style.scss       |  2 +-
 front/salix/routes.js                         | 33 ++++++++---
 8 files changed, 56 insertions(+), 59 deletions(-)

diff --git a/e2e/helpers/selectors.js b/e2e/helpers/selectors.js
index f6a299011..e1792ea7b 100644
--- a/e2e/helpers/selectors.js
+++ b/e2e/helpers/selectors.js
@@ -30,7 +30,7 @@ export default {
         firstModuleRemovePinIcon: 'vn-home a:nth-child(1) vn-icon[icon="remove_circle"]'
     },
     recoverPassword: {
-        recoverPasswordButton: 'vn-login a[ui-sref="recoverPassword"]',
+        recoverPasswordButton: 'vn-login a[ui-sref="recover-password"]',
         email: 'vn-recover-password vn-textfield[ng-model="$ctrl.email"]',
         sendEmailButton: 'vn-recover-password vn-submit',
     },
diff --git a/e2e/paths/01-salix/04_recoverPassword.spec.js b/e2e/paths/01-salix/04_recoverPassword.spec.js
index 67e6362d3..e6cb02ab1 100644
--- a/e2e/paths/01-salix/04_recoverPassword.spec.js
+++ b/e2e/paths/01-salix/04_recoverPassword.spec.js
@@ -1,8 +1,7 @@
 import selectors from '../../helpers/selectors';
 import getBrowser from '../../helpers/puppeteer';
 
-// https://redmine.verdnatura.es/issues/4995 fix login
-xdescribe('RecoverPassword path', async() => {
+describe('RecoverPassword path', async() => {
     let browser;
     let page;
 
@@ -11,7 +10,7 @@ xdescribe('RecoverPassword path', async() => {
         page = browser.page;
 
         await page.waitToClick(selectors.recoverPassword.recoverPasswordButton);
-        await page.waitForState('recoverPassword');
+        await page.waitForState('recover-password');
     });
 
     afterAll(async() => {
diff --git a/front/core/services/auth.js b/front/core/services/auth.js
index 04520cd0b..c15a34d94 100644
--- a/front/core/services/auth.js
+++ b/front/core/services/auth.js
@@ -24,7 +24,7 @@ export default class Auth {
     initialize() {
         let criteria = {
             to: state => {
-                const outLayout = ['login', 'recoverPassword', 'resetPassword'];
+                const outLayout = ['login', 'recover-password', 'reset-password'];
                 return !outLayout.some(ol => ol == state.name);
             }
         };
diff --git a/front/salix/components/app/app.html b/front/salix/components/app/app.html
index d32c9f68b..d6169308a 100644
--- a/front/salix/components/app/app.html
+++ b/front/salix/components/app/app.html
@@ -1,9 +1,3 @@
-<vn-layout
-    ng-if="$ctrl.showLayout">
-</vn-layout>
-<ui-view
-    name="login"
-    ng-if="!$ctrl.showLayout">
-</ui-view>
+<ui-view></ui-view>
 <vn-snackbar vn-id="snackbar"></vn-snackbar>
 <vn-debug-info></vn-debug-info>
diff --git a/front/salix/components/app/app.js b/front/salix/components/app/app.js
index 91a8d2215..97384d1e1 100644
--- a/front/salix/components/app/app.js
+++ b/front/salix/components/app/app.js
@@ -19,12 +19,6 @@ export default class App extends Component {
         this.vnApp.logger = this;
     }
 
-    get showLayout() {
-        const state = this.$state.current.name || this.$location.$$path.substring(1).replace('/', '.');
-        const outLayout = ['login', 'recoverPassword', 'resetPassword', 'reset-password'];
-        return state && !outLayout.some(ol => ol == state);
-    }
-
     $onDestroy() {
         this.deregisterCallback();
         this.vnApp.logger = null;
diff --git a/front/salix/components/login/login.html b/front/salix/components/login/login.html
index 807e4b284..963c23061 100644
--- a/front/salix/components/login/login.html
+++ b/front/salix/components/login/login.html
@@ -1,32 +1,27 @@
-<div class="box">
-	<img src="./logo.svg"/>
-	<form name="form" ng-submit="$ctrl.submit()">
-        <vn-textfield
-            label="User"
-            ng-model="$ctrl.user"
-            vn-id="userField"
-            vn-focus>
-        </vn-textfield>
-        <vn-textfield
-            label="Password"
-            ng-model="$ctrl.password"
-            type="password">
-        </vn-textfield>
-        <vn-check
-            label="Do not close session"
-            ng-model="$ctrl.remember"
-            name="remember">
-        </vn-check>
-        <div class="footer">
-            <vn-submit label="Enter" ng-click="$ctrl.submit()"></vn-submit>
-            <div class="spinner-wrapper">
-                <vn-spinner enable="$ctrl.loading"></vn-spinner>
-            </div>
-            <!--<div class="vn-pt-lg">
-                <a ui-sref="recoverPassword" translate>
-                    I do not remember my password
-                </a>
-            </div>-->
-        </div>
-    </form>
+<vn-textfield
+    label="User"
+    ng-model="$ctrl.user"
+    vn-id="userField"
+    vn-focus>
+</vn-textfield>
+<vn-textfield
+    label="Password"
+    ng-model="$ctrl.password"
+    type="password">
+</vn-textfield>
+<vn-check
+    label="Do not close session"
+    ng-model="$ctrl.remember"
+    name="remember">
+</vn-check>
+<div class="footer">
+    <vn-submit label="Enter" ng-click="$ctrl.submit()"></vn-submit>
+    <div class="spinner-wrapper">
+        <vn-spinner enable="$ctrl.loading"></vn-spinner>
+    </div>
+    <div class="vn-pt-lg">
+        <a ui-sref="recover-password" translate>
+            I do not remember my password
+        </a>
+    </div>
 </div>
diff --git a/front/salix/components/login/style.scss b/front/salix/components/login/style.scss
index 5a7e72245..8985893f2 100644
--- a/front/salix/components/login/style.scss
+++ b/front/salix/components/login/style.scss
@@ -25,7 +25,7 @@ vn-recover-password{
     }
 }
 
-vn-login{
+vn-out-layout{
 	position: absolute;
 	height: 100%;
 	width: 100%;
diff --git a/front/salix/routes.js b/front/salix/routes.js
index 613dc7288..f32c143ef 100644
--- a/front/salix/routes.js
+++ b/front/salix/routes.js
@@ -3,27 +3,38 @@ import getMainRoute from 'core/lib/get-main-route';
 
 config.$inject = ['$stateProvider', '$urlRouterProvider'];
 function config($stateProvider, $urlRouterProvider) {
-    $urlRouterProvider.otherwise('/');
+    $urlRouterProvider
+        .otherwise('/');
 
     $stateProvider
+        .state('layout', {
+            abstract: true,
+            template: '<vn-layout></vn-layout>',
+        })
+        .state('outLayout', {
+            abstract: true,
+            template: '<vn-out-layout></vn-out-layout>',
+        })
         .state('login', {
+            parent: 'outLayout',
             url: '/login?continue',
             description: 'Login',
-            views: {
-                'login': {template: '<vn-login></vn-login>'},
-            }
+            template: '<vn-login></vn-login>'
         })
-        .state('recoverPassword', {
+        .state('recover-password', {
+            parent: 'outLayout',
             url: '/recover-password',
-            description: 'Recover-password',
-            template: '<vn-recover-password>asd</vn-recover-password>'
+            description: 'Recover password',
+            template: '<vn-recover-password></vn-recover-password>'
         })
-        .state('resetPassword', {
+        .state('reset-password', {
+            parent: 'outLayout',
             url: '/reset-password',
-            description: 'Reset-password',
+            description: 'Reset password',
             template: '<vn-reset-password></vn-reset-password>'
         })
         .state('home', {
+            parent: 'layout',
             url: '/',
             description: 'Home',
             template: '<vn-home></vn-home>'
@@ -54,6 +65,10 @@ function config($stateProvider, $urlRouterProvider) {
             };
             if (route.abstract)
                 configRoute.abstract = true;
+
+            if (!route.state.includes('.'))
+                configRoute.parent = 'layout';
+
             if (route.routeParams)
                 configRoute.params = route.routeParams;