Merge branch 'redmine-issues/18367' into '1.1'

REDMINE_ISSUE-18367

See merge request onegeo-suite/sites/onegeo-suite-site-login-vuejs!45

.gitlab-ci.yml

@@ -30,7 +30,7 @@ build_development:
   stage: build
   tags:
     - build
-  image: node:14.16.0
+  image: node:18.16.0
   script:
     - npm install --unsafe-perm
     - echo -e "

README.md

 # login-site
 
+## Pré-requis
+
+- nodejs (18.x)
+- npm (9.x)
+
 ## Project setup
 
 ```shell

package.json

 {
   "name": "onegeo-suite-site-login-vuejs",
-  "version": "1.0.0",
+  "version": "1.1.0-beta0",
   "private": true,
   "scripts": {
-    "dev": "cross-env NODE_ENV=development vue-cli-service serve --open --host localhost",
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
-    "test:unit": "vue-cli-service test:unit",
-    "test:e2e": "vue-cli-service test:e2e",
-    "lint": "vue-cli-service lint"
+    "dev": "NODE_OPTIONS=--openssl-legacy-provider cross-env NODE_ENV=development vue-cli-service serve --open --host localhost",
+    "serve": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service serve",
+    "build": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service build",
+    "test:unit": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service test:unit",
+    "test:e2e": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service test:e2e",
+    "lint": "NODE_OPTIONS=--openssl-legacy-provider vue-cli-service lint"
   },
   "dependencies": {
-    "axios": "~0.21.1",
+    "axios": "^1.5.0",
     "bootstrap-vue": "^2.21.2",
     "core-js": "^3.6.5",
     "corejs-typeahead": "^1.3.1",

src/components/OrganisationSelector.vue

@@ -184,7 +184,6 @@ export default {
     ...mapActions('organisations', [
       'GET_ORGANISATIONS_LIST',
       'GET_ORGANISATIONS_ROLES',
-      'SEARCH_ORGANISATIONS_LIST'
     ]),
 
     search(text) {

src/store/index.js

@@ -5,14 +5,37 @@ import modules from './modules';
 Vue.use(Vuex);
 
 const state = {
-  cancellableSearchRequest: null
+  abortControllers: [],
 };
 
-export const SET_CANCELLABLE_SEARCH_REQUEST = 'SET_CANCELLABLE_SEARCH_REQUEST';
-
 const mutations = {
-  [SET_CANCELLABLE_SEARCH_REQUEST]: (state, payload) => {
-    state.cancellableSearchRequest = payload;
+  SET_ABORT_CONTROLLER: (state, { id, controller }) => {
+    const index = state.abortControllers.findIndex(el => el.id === id);
+    if (index !== -1) {
+      state.abortControllers.splice(index, 1, {
+        id: id,
+        controller: controller
+      });
+    } else {
+      state.abortControllers.push({
+        id: id,
+        controller: controller
+      });
+    }
+  },
+  REMOVE_ABORT_CONTROLLER: (state, id) => {
+    const index = state.abortControllers.findIndex(el => el.id === id);
+    if (index !== -1) {
+      state.abortControllers.splice(index, 1);
+    }
+  },
+  RESET_ABORT_CONTROLLERS: (state) => {
+    state.abortControllers = [];
+  },
+  USE_ABORT_CONTROLLER: (state, id) => {
+    if (state.abortControllers.find(el => el.id === id)) {
+      state.abortControllers.find(el => el.id === id).controller.abort();
+    }
   }
 };
 

src/store/modules/organisations.store.js

@@ -13,55 +13,12 @@ const getters = { };
 export const GET_ORGANISATIONS_LIST = 'GET_ORGANISATIONS_LIST';
 export const GET_ORGANISATIONS_TYPES = 'GET_ORGANISATIONS_TYPES';
 export const GET_ORGANISATIONS_ROLES = 'GET_ORGANISATIONS_ROLES';
-export const SEARCH_ORGANISATIONS_LIST = 'SEARCH_ORGANISATIONS_LIST';
 
 const actions = {
   [GET_ORGANISATIONS_LIST]: async ({ commit }) => {
     const organisations = await client.getOrganisationsList();
     commit('SET_ORGANISATIONS_LIST', organisations);
   },
-  [SEARCH_ORGANISATIONS_LIST]: async ({ rootState, commit, dispatch }, text) => {
-
-    if (text) {
-      if (rootState.cancellableSearchRequest) {
-        rootState.cancellableSearchRequest.cancel();
-        commit('SET_CANCELLABLE_SEARCH_REQUEST', null, { root: true });
-      }
-
-      const cancelToken = axios.CancelToken.source();
-      commit('SET_CANCELLABLE_SEARCH_REQUEST', cancelToken, { root: true });
-      const url = `${process.env.VUE_APP_LOGIN_API}/organisations/?page=1&search=${text}`;
-
-      try {
-        const response = await axios.get(
-          url,
-          {
-            cancelToken: cancelToken.token,
-            ...process.env.NODE_ENV === 'development' && {
-              auth: {
-                username: process.env.VUE_APP_LOGIN_API_USERNAME,
-                password: process.env.VUE_APP_LOGIN_API_PASSWORD
-              }
-            }
-          }
-        );
-        if (response.status === 200) {
-          commit('SET_CANCELLABLE_SEARCH_REQUEST', null, { root: true });
-          const organisations = response.data;
-          if (organisations) {
-            commit('SET_ORGANISATIONS_LIST', organisations);
-          }
-        }
-      } catch(err) {
-        commit('SET_CANCELLABLE_SEARCH_REQUEST', null, { root: true });
-      }
-    } else {
-      dispatch('GET_ORGANISATIONS_LIST', {
-        direction: null,
-        field: null
-      });
-    }
-  },
   [GET_ORGANISATIONS_TYPES]: async ({ commit }) => {
     const types = await organisationAPI.getOrganisationsTypes();
     commit('SET_ORGANISATIONS_TYPES', types);

src/store/modules/usergroups.store.js

@@ -72,25 +72,27 @@ const actions = {
   },
 
   [SEARCH_SPHERES]: async ({ rootState, commit }, text) => {
-    if (rootState.cancellableSearchRequest) {
-      rootState.cancellableSearchRequest.cancel();
-      commit('SET_CANCELLABLE_SEARCH_REQUEST', null, { root: true });
+    if (rootState.abortControllers.length > 0) {
+      commit('USE_ABORT_CONTROLLER', 'search_spheres', { root: true });
     }
+    const controller = new AbortController();
+    commit('SET_ABORT_CONTROLLER', {
+      id: 'search_spheres',
+      controller: controller
+    }, { root: true });
 
-    const cancelToken = axios.CancelToken.source();
-    commit('SET_CANCELLABLE_SEARCH_REQUEST', cancelToken, { root: true });
     const url = new URL(path.join(USERGROUP_API_PATH, `user-groups/?page=1&search=${text}&usergroup_types=group-of-organisation`), DOMAIN);
 
     try {
       const response = await axios.get(
         url,
         {
-          cancelToken: cancelToken.token,
+          ...controller && { signal: controller.signal },
           ...DEV_AUTH && { auth: AUTH }
         }
       );
       if (response.status === 200) {
-        commit('SET_CANCELLABLE_SEARCH_REQUEST', null, { root: true });
+        commit('REMOVE_ABORT_CONTROLLER', 'search_spheres', { root: true });
         const usergroups = response.data;
         if (usergroups) {
           commit('SET_ERROR', null);
@@ -99,7 +101,7 @@ const actions = {
         }
       }
     } catch(err) {
-      commit('SET_CANCELLABLE_SEARCH_REQUEST', null, { root: true });
+      commit('REMOVE_ABORT_CONTROLLER', 'search_spheres', { root: true });
     }
   }
 };