fix: Improve login, server selection and proxy configuration (#2511)

No potentially malicious URLs referenced in markdown; added
servers stays in server selector list; the currently active server
is visible on the bottom right of smaller screens; a proxy configuration
can be provided now and works; a trailing slash in the added server
is no problem anymore, because it's removed.

FIXES: WEB-193

docs/backend-proxy.md

@@ -20,7 +20,7 @@ const proxyConfig = [
   {
     context: '/api',
     pathRewrite: { '^/api': '' },
-    target: 'http://api.icndb.com',
+    target: 'https://api.chucknorris.io',
     changeOrigin: true
   }
 ];

proxy.conf.js

@@ -1,6 +1,6 @@
 'use strict';
 
-const HttpsProxyAgent = require('https-proxy-agent');
+const { HttpsProxyAgent } = require('https-proxy-agent');
 
 /*
  * API proxy configuration.
@@ -19,9 +19,9 @@ const proxyConfig = [
 ];
 
 /*
- * Configures a corporate proxy agent for the API proxy if needed.
+ * Configures a proxy agent for the API proxy if needed.
  */
-function setupForCorporateProxy(proxyConfig) {
+function setupForProxy(proxyConfig) {
   if (!Array.isArray(proxyConfig)) {
     proxyConfig = [proxyConfig];
   }
@@ -30,14 +30,16 @@ function setupForCorporateProxy(proxyConfig) {
   let agent = null;
 
   if (proxyServer) {
-    console.log(`Using corporate proxy server: ${proxyServer}`);
+    console.log(`Using proxy server: ${proxyServer}`);
     agent = new HttpsProxyAgent(proxyServer);
     proxyConfig.forEach((entry) => {
       entry.agent = agent;
     });
+  } else {
+    console.warn('No proxy server configured. API requests will not be proxied.');
   }
 
   return proxyConfig;
 }
 
-module.exports = setupForCorporateProxy(proxyConfig);
+module.exports = setupForProxy(proxyConfig);

src/app/login/login.component.html

@@ -66,11 +66,11 @@
     -->
     <mifosx-login-form *ngIf="!resetPassword && !twoFactorAuthenticationRequired"></mifosx-login-form>
 
-    <div class="layout-row m-t-20">
+    <div class="layout-row">
       <mifosx-reset-password *ngIf="resetPassword"></mifosx-reset-password>
       <mifosx-two-factor-authentication *ngIf="twoFactorAuthenticationRequired"></mifosx-two-factor-authentication>
     </div>
-    <div class="layout-row m-t-20">
+    <div class="layout-row">
       <!-- Contact Information/Resources (hidden on smaller screens) -->
       <mat-list class="information-list align-items-center custom-horizontal-list hide-lt-lg">
         <mat-list-item

src/app/shared/footer/footer.component.html

@@ -1,4 +1,4 @@
-<div class="layout-column m-b-20" ngClass="{{ styleClass }}" id="footer" *ngIf="displayBackEndInfo">
+<div class="layout-column m-b-20 f12" ngClass="{{ styleClass }}" id="footer" *ngIf="displayBackEndInfo">
   <mat-divider class="divider align-center"></mat-divider>
   <div class="layout-column m-b-20 content-wrapper footer-center">
     <table class="versions">
@@ -15,8 +15,9 @@
         </td>
       </tr>
       <tr *ngIf="displayBackEndInfo">
-        <td colspan="2" class="center footer-content">
+        <td class="footer-content">{{ 'labels.inputs.Server' | translate }}</td>
-          <b>{{ server }}</b>
+        <td class="right footer-content">
+          {{ server }}
         </td>
       </tr>
       <tr *ngIf="isBusinessDateDefined">

src/app/shared/server-selector/server-selector.component.ts

@@ -65,9 +65,13 @@ export class ServerSelectorComponent implements OnInit {
    */
   addNewServer(): void {
     let servers;
-    this.settingsService.setServer(this.form.value.url);
+    let url = this.form.value.url;
+    if (url.endsWith('/')) {
+      url = url.slice(0, -1);
+    }
+    this.settingsService.setServer(url);
     servers = this.settingsService.servers;
-    servers.push(this.form.value.url);
+    servers.push(url);
     this.settingsService.setServers(servers);
     window.location.reload();
   }

src/app/web-app.component.ts

@@ -205,8 +205,10 @@ export class WebAppComponent implements OnInit {
     }
     // Set default max date picker as Today
     this.settingsService.setBusinessDate(this.dateUtils.formatDate(new Date(), SettingsService.businessDateFormat));
-    // Set the server list from the env var FINERACT_API_URLS
+    // Set the server list from the env var FINERACT_API_URLS, but avoid overwriting "Add new server" user choice
-    this.settingsService.setServers(environment.baseApiUrls.split(','));
+    if (!this.settingsService.servers) {
+      this.settingsService.setServers(environment.baseApiUrls.split(','));
+    }
     // Set the Tenant Identifier(s) list from the env var
     if (!localStorage.getItem('mifosXTenantIdentifier')) {
       this.settingsService.setTenantIdentifier(environment.fineractPlatformTenantId || 'default');