[NRRPLT-8003] merge with dev

src/App.js

 import React from "react";
 
 import { HashRouter, Switch, Route } from "react-router-dom";
+import ExperimentsService from './services/proxy/experiments-service.js';
 
 import ExperimentsService from "./services/proxy/experiments.js";
 
@@ -10,7 +11,7 @@ import ExperimentList from "./components/experiment-list/experiment-list.js";
 class App extends React.Component {
   async componentDidMount() {
     try {
-      const experiments = await ExperimentsService.getExperiments();
+      const experiments = await ExperimentsService.instance.getExperiments();
       console.log(experiments);
     } catch (error) {
       console.error(`Failed to fetch the list of experiments. Error: ${error}`);

src/components/user-menu/user-menu.js

@@ -18,12 +18,14 @@ export default class UserMenu extends React.Component {
   }
 
   componentDidMount() {
-    this._userRequest = NrpUserService.getCurrentUser().then((currentUser) => {
-      this._userRequest = null;
-      this.setState(() => ({
-        user: currentUser,
-      }));
-    });
+    this._userRequest = NrpUserService.instance
+      .getCurrentUser()
+      .then((currentUser) => {
+        this._userRequest = null;
+        this.setState(() => ({
+          user: currentUser
+        }));
+      });
   }
 
   componentWillUnmount() {
@@ -33,7 +35,7 @@ export default class UserMenu extends React.Component {
   }
 
   onClickLogout() {
-    AuthenticationService.clearStoredToken();
+    AuthenticationService.instance.clearStoredToken();
     window.location.reload();
   }
 
@@ -48,7 +50,7 @@ export default class UserMenu extends React.Component {
           >
             <FontAwesomeIcon icon={faUserCircle} className="user-icon" />
             <div className="user-name">
-              {this.state.user ? this.state.user.displayName : "pending ..."}
+              {this.state.user ? this.state.user.displayName : 'pending ...'}
             </div>
           </Dropdown.Toggle>
 

src/services/authentication-service.js

 import config from '../config.json';
 
+let _instance = null;
+const SINGLETON_ENFORCER = Symbol();
+
 /**
-* Service taking care of OIDC/FS authentication for NRP accounts
-*/
+ * Service taking care of OIDC/FS authentication for NRP accounts
+ */
 class AuthenticationService {
-  /**
-  * Constructor
-  */
-  constructor() {
+  constructor(enforcer) {
+    if (enforcer !== SINGLETON_ENFORCER) {
+      throw new Error('Use AuthenticationService.instance');
+    }
+
     this.CLIENT_ID = config.auth.clientId;
     this.STORAGE_KEY = `tokens-${this.CLIENT_ID}@https://services.humanbrainproject.eu/oidc`;
     this.PROXY_URL = config.api.proxy.url;
@@ -15,8 +19,16 @@ class AuthenticationService {
     this.checkForNewTokenToStore();
   }
 
+  static get instance() {
+    if (_instance == null) {
+      _instance = new AuthenticationService(SINGLETON_ENFORCER);
+    }
+
+    return _instance;
+  }
+
   /**
-   * Checks if the current page URL contains access tokens. 
+   * Checks if the current page URL contains access tokens.
    * This happens when the successfully logging in at the proxy login page and being redirected back with the token info.
    * Will automatically remove additional access info and present a clean URL after being redirected.
    */
@@ -33,10 +45,7 @@ class AuthenticationService {
       //eslint-disable-next-line camelcase
       JSON.stringify([{ access_token: accessToken }])
     );
-    const pathMinusAccessToken = path.substr(
-      0,
-      path.indexOf('&access_token=')
-    );
+    const pathMinusAccessToken = path.substr(0, path.indexOf('&access_token='));
     window.location.href = pathMinusAccessToken;
   }
 
@@ -49,7 +58,7 @@ class AuthenticationService {
 
   /**
    * Get the stored access token.
-   * 
+   *
    * @return token The stored access token. Or strings identifying 'no-token' / 'malformed-token'.
    */
   getStoredToken() {
@@ -70,7 +79,7 @@ class AuthenticationService {
 
   /**
    * Opens the proxy's authentication page.
-   * 
+   *
    * @param {*} url The URL of the authentication page. If not an absolute URL it is assumed to be a subpage of the proxy.
    */
   openAuthenticationPage(url) {
@@ -78,9 +87,10 @@ class AuthenticationService {
 
     let absoluteUrl = /^https?:\/\//i;
     if (!absoluteUrl.test(url)) url = `${this.PROXY_URL}${url}`;
-    window.location.href = `${url}&client_id=${this
-      .CLIENT_ID}&redirect_uri=${encodeURIComponent(window.location.href)}`;
+    window.location.href = `${url}&client_id=${
+      this.CLIENT_ID
+    }&redirect_uri=${encodeURIComponent(window.location.href)}`;
   }
-};
+}
 
-export default new AuthenticationService();
\ No newline at end of file
+export default AuthenticationService;

src/services/http-service.js

 import AuthenticationService from './authentication-service.js';
 
 /**
-* Base class that performs http requests with default request options.
-* If children need other options they can override the options or the 
-* http verb (GET, POST, PUT etc) functions.
-*/
+ * Base class that performs http requests with default request options.
+ * If children need other options they can override the options or the
+ * http verb (GET, POST, PUT etc) functions.
+ */
 export class HttpService {
-    /**
-    * Create a simple http request object with default options, default method is GET
-    */
-    constructor() {
-        this.options = {
-            method: 'GET', // *GET, POST, PUT, DELETE, etc.
-            mode: 'cors', // no-cors, *cors, same-origin
-            cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
-            credentials: 'same-origin', // include, *same-origin, omit
-            headers: {
-                'Content-Type': 'application/json',
-                'Referer': 'http://localhost:9000/'
-            },
-            redirect: 'follow', // manual, *follow, error
-            referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
-            //body: JSON.stringify(data) // body data type must match "Content-Type" header
-        };
-    }
-
-    /**
-    * Perform a generic http request with options and url
-    * @param url - the url to perform the request
-    * @param options - the http options object
-    */
-    performRequest = async (url, options) => {
-        // Add authorization header
-        options.headers.Authorization = `Bearer ${AuthenticationService.getStoredToken()}`;
+  /**
+   * Create a simple http request object with default options, default method is GET
+   */
+  constructor() {
+    this.options = {
+      method: 'GET', // *GET, POST, PUT, DELETE, etc.
+      mode: 'cors', // no-cors, *cors, same-origin
+      cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
+      credentials: 'same-origin', // include, *same-origin, omit
+      headers: {
+        'Content-Type': 'application/json',
+        Referer: 'http://localhost:9000/'
+      },
+      redirect: 'follow', // manual, *follow, error
+      referrerPolicy: 'no-referrer' // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
+      //body: JSON.stringify(data) // body data type must match "Content-Type" header
+    };
+  }
 
-        const response = await fetch(url, options);
+  /**
+   * Perform a generic http request with options and url
+   * @param url - the url to perform the request
+   * @param options - the http options object
+   */
+  performRequest = async (url, options) => {
+    // Add authorization header
+    options.headers.Authorization = `Bearer ${AuthenticationService.instance.getStoredToken()}`;
 
-        // error handling
-        if (!response.ok) {
-            if (response.status === 477) {
-                const responseText = await response.text();
-                AuthenticationService.openAuthenticationPage(responseText);
-            } else if (response.status === 478) {
-                //TODO: redirect to maintenance page
-            }
+    const response = await fetch(url, options);
 
-            return response;
-        }
+    // error handling
+    if (!response.ok) {
+      if (response.status === 477) {
+        const responseText = await response.text();
+        AuthenticationService.instance.openAuthenticationPage(responseText);
+      } else if (response.status === 478) {
+        //TODO: redirect to maintenance page
+      }
 
-        return response.json();
+      return response;
     }
 
-    /**
-    * Perform a GET http request to a url
-    * @param url - the url to perform the request
-    */
-    httpRequestGET = (url) => {
-        // copy to avoid messing up the options object in case we need to reuse it
-        const { ...getOptions } = this.options;
-        return this.performRequest(url, getOptions);
-    }
+    return response.json();
+  };
 
-    /**
-    * Perform a POST http request to a url
-    * @param url - the url to perform the request
-    */
-    httpRequestPOST = (url) => {
-        // copy to avoid messing up the options object in case we need to reuse it
-        const { ...postOptions } = this.options;
-        postOptions.method = 'POST';
+  /**
+   * Perform a GET http request to a url
+   * @param url - the url to perform the request
+   */
+  httpRequestGET = (url) => {
+    // copy to avoid messing up the options object in case we need to reuse it
+    const { ...getOptions } = this.options;
+    return this.performRequest(url, getOptions);
+  };
 
-        return this.performRequest(url, postOptions);
-    }
+  /**
+   * Perform a POST http request to a url
+   * @param url - the url to perform the request
+   */
+  httpRequestPOST = (url) => {
+    // copy to avoid messing up the options object in case we need to reuse it
+    const { ...postOptions } = this.options;
+    postOptions.method = 'POST';
 
-    /**
-    * Perform a PUT http request to a url
-    * @param url - the url to perform the request
-    */
-    httpRequestPUT = async (url) => {
-        // copy to avoid messing up the options object in case we need to reuse it
-        const { ...putOptions } = this.options;
-        putOptions.method = 'PUT';
+    return this.performRequest(url, postOptions);
+  };
 
-        return this.performRequest(url, putOptions);
-    }
+  /**
+   * Perform a PUT http request to a url
+   * @param url - the url to perform the request
+   */
+  httpRequestPUT = async (url) => {
+    // copy to avoid messing up the options object in case we need to reuse it
+    const { ...putOptions } = this.options;
+    putOptions.method = 'PUT';
+
+    return this.performRequest(url, putOptions);
+  };
 
-    /**
-    * Set the options object in case a child wants to redefine it
-    * @param options - the new options object
-    */
-    setOptions = options => this.options = options;
-};
\ No newline at end of file
+  /**
+   * Set the options object in case a child wants to redefine it
+   * @param options - the new options object
+   */
+  setOptions = (options) => (this.options = options);
+}

src/services/proxy/experiments-service.js

+import endpoints from './data/endpoints.json';
+import config from '../../config.json';
+
+import { HttpService } from '../http-service.js';
+
+let _instance = null;
+const SINGLETON_ENFORCER = Symbol();
+
+/**
+ * Service that fetches the template experiments list from the proxy given
+ * that the user has authenticated successfully.
+ */
+class ExperimentsService extends HttpService {
+  constructor(enforcer) {
+    if (enforcer !== SINGLETON_ENFORCER) {
+      throw new Error('Use ExperimentsService.instance');
+    }
+
+    super();
+  }
+
+  static get instance() {
+    if (_instance == null) {
+      _instance = new ExperimentsService(SINGLETON_ENFORCER);
+    }
+
+    return _instance;
+  }
+
+  /**
+   * Retrieves the list of template experiments from the proxy and stores
+   * them in the experiments class property. If the experiments are already
+   * there it just returns them, else does an HTTP request.
+   *
+   * @return experiments - the list of template experiments
+   */
+  getExperiments = () => {
+    if (!this.experiments) {
+      const proxyEndpoint = endpoints.proxy;
+      const experimentsUrl = `${config.api.proxy.url}${proxyEndpoint.experiments.url}`;
+      this.experiments = this.httpRequestGET(experimentsUrl);
+    }
+
+    return this.experiments;
+  };
+}
+
+export default ExperimentsService;

src/services/proxy/experiments.js

-import endpoints from './data/endpoints.json'
-import config from '../../config.json';
-
-import { HttpService } from '../http-service.js';
-
-/**
-* Service that fetches the template experiments list from the proxy given
-* that the user has authenticated successfully.
-*/
-class ExperimentsService extends HttpService {
-
-    /**
-    * Retrieves the list of template experiments from the proxy and stores 
-    * them in the experiments class property. If the experiments are already
-    * there it just returns them, else does an HTTP request.
-    * 
-    * @return experiments - the list of template experiments
-    */
-    getExperiments = () => {
-        if (!this.experiments) {
-            const proxyEndpoint = endpoints.proxy;
-            const experimentsUrl = `${config.api.proxy.url}${proxyEndpoint.experiments.url}`;
-            this.experiments = this.httpRequestGET(experimentsUrl);
-        }
-        
-        return this.experiments;
-    }
-}
-
-
-export default new ExperimentsService();

src/services/proxy/nrp-user-service.js

@@ -6,97 +6,113 @@ import { HttpService } from '../http-service.js';
 const USERGROUP_NAME_ADMINS = 'hbp-sp10-administrators';
 const USERGROUP_NAME_CLUSTER_RESERVATION = 'hbp-sp10-cluster-reservation';
 
+let _instance = null;
+const SINGLETON_ENFORCER = Symbol();
+
 /**
-* Service managing all data related to NRP users.
-*/
+ * Service managing all data related to NRP users.
+ */
 class NrpUserService extends HttpService {
-    constructor() {
-        super();
-
-        this.PROXY_URL = config.api.proxy.url;
-        this.IDENTITY_BASE_URL = `${this.PROXY_URL}${endpoints.proxy.identity.url}`;
-        this.IDENTITY_ME_URL = `${this.PROXY_URL}${endpoints.proxy.identity.me.url}`;
-        this.IDENTITY_ME_GROUPS_URL = `${this.PROXY_URL}${endpoints.proxy.identity.me.groups.url}`;
+  constructor(enforcer) {
+    if (enforcer !== SINGLETON_ENFORCER) {
+      throw new Error('Use NrpUserService.instance');
     }
 
-    /**
-     * Get all user information for a given ID.
-     * @param {string} userID - the ID of the user
-     * @returns {promise} Request for the user
-     */
-    async getUser(userID) {
-        return await this.httpRequestGET(this.IDENTITY_BASE_URL + '/' + userID);
-    }
+    super();
 
-    /**
-     * Get the name displayed for a user ID.
-     * @param {string} userID - the ID of the user
-     * @returns {string} user name, or unknown
-     */
-    async getUserName(userID) {
-        return await this.getUser(userID)
-            .then(({ displayName }) => displayName)
-            .catch(() => 'Unknown');
-    }
+    this.PROXY_URL = config.api.proxy.url;
+    this.IDENTITY_BASE_URL = `${this.PROXY_URL}${endpoints.proxy.identity.url}`;
+    this.IDENTITY_ME_URL = `${this.PROXY_URL}${endpoints.proxy.identity.me.url}`;
+    this.IDENTITY_ME_GROUPS_URL = `${this.PROXY_URL}${endpoints.proxy.identity.me.groups.url}`;
+  }
 
-    /**
-     * Gives you the user currently logged in.
-     * 
-     * @return currentUser - the user currently logged in
-     */
-    async getCurrentUser() {
-        if (!this.currentUser) {
-            this.currentUser = await this.httpRequestGET(this.IDENTITY_ME_URL);
-        }
-        return this.currentUser;
+  static get instance() {
+    if (_instance == null) {
+      _instance = new NrpUserService(SINGLETON_ENFORCER);
     }
 
-    /**
-     * Gives you the currently defined user groups.
-     * 
-     * @return currentUserGroups - the user groups currently belonging to
-     */
-    async getCurrentUserGroups() {
-        if (!this.currentUserGroups) {
-            this.currentUserGroups = await this.httpRequestGET(this.IDENTITY_ME_GROUPS_URL);
-        }
-
-        return this.currentUserGroups;
-    }
+    return _instance;
+  }
 
-    /**
-     * Checks whether the current user is part of a specified group.
-     * @param {string} groupName - the name of the group to check
-     * @returns {boolean} Whether the user is part of the group.
-     */
-    async isGroupMember(groupName) {
-        return await this.getCurrentUserGroups().then(groups =>
-            groups.some(g => g.name === groupName)
-        );
-    }
+  /**
+   * Get all user information for a given ID.
+   * @param {string} userID - the ID of the user
+   * @returns {promise} Request for the user
+   */
+  async getUser(userID) {
+    return await this.httpRequestGET(this.IDENTITY_BASE_URL + '/' + userID);
+  }
 
-    /**
-     * Checks if the user is part of the cluster reservation group.
-     */
-    async isMemberOfClusterReservationGroup() {
-        return await this.isGroupMember(USERGROUP_NAME_CLUSTER_RESERVATION);
-    }
+  /**
+   * Get the name displayed for a user ID.
+   * @param {string} userID - the ID of the user
+   * @returns {string} user name, or unknown
+   */
+  async getUserName(userID) {
+    return await this.getUser(userID)
+      .then(({ displayName }) => displayName)
+      .catch(() => 'Unknown');
+  }
 
-    /**
-     * Checks if the user is part of the administrator group.
-     */
-    async isAdministrator() {
-        return await this.isGroupMember(USERGROUP_NAME_ADMINS);
+  /**
+   * Gives you the user currently logged in.
+   *
+   * @return currentUser - the user currently logged in
+   */
+  async getCurrentUser() {
+    if (!this.currentUser) {
+      this.currentUser = await this.httpRequestGET(this.IDENTITY_ME_URL);
     }
+    return this.currentUser;
+  }
 
-    /**
-     * Retrieve cluster reservations from the session storage.
-     * @returns {object} Cluster reservation
-     */
-    getReservation() {
-        return window.sessionStorage.getItem('clusterReservation');
+  /**
+   * Gives you the currently defined user groups.
+   *
+   * @return currentUserGroups - the user groups currently belonging to
+   */
+  async getCurrentUserGroups() {
+    if (!this.currentUserGroups) {
+      this.currentUserGroups = await this.httpRequestGET(
+        this.IDENTITY_ME_GROUPS_URL
+      );
     }
-}
 
+    return this.currentUserGroups;
+  }
+
+  /**
+   * Checks whether the current user is part of a specified group.
+   * @param {string} groupName - the name of the group to check
+   * @returns {boolean} Whether the user is part of the group.
+   */
+  async isGroupMember(groupName) {
+    return await this.getCurrentUserGroups().then((groups) =>
+      groups.some((g) => g.name === groupName)
+    );
+  }
+
+  /**
+   * Checks if the user is part of the cluster reservation group.
+   */
+  async isMemberOfClusterReservationGroup() {
+    return await this.isGroupMember(USERGROUP_NAME_CLUSTER_RESERVATION);
+  }
+
+  /**
+   * Checks if the user is part of the administrator group.
+   */
+  async isAdministrator() {
+    return await this.isGroupMember(USERGROUP_NAME_ADMINS);
+  }
+
+  /**
+   * Retrieve cluster reservations from the session storage.
+   * @returns {object} Cluster reservation
+   */
+  getReservation() {
+    return window.sessionStorage.getItem('clusterReservation');
+  }
+}
 
-export default new NrpUserService();
+export default NrpUserService;