fix(value): fix linkify pipe (DEV-270)

src/app/main/pipes/string-transformation/linkify.pipe.spec.ts

@@ -13,10 +13,10 @@ describe('LinkifyPipe', () => {
         expect(pipe).toBeTruthy();
     });
 
-    it('should recognize the url without protocol but with hashtag at the end', () => {
+    it('should not recognize the url if protocol does not exist', () => {
         const text = 'You can visit the app on app.dasch.swiss/#';
         const linkifiedSnippet = pipe.transform(text);
-        expect(linkifiedSnippet).toEqual('You can visit the app on <a href="http://app.dasch.swiss/#" target="_blank">app.dasch.swiss/#</a>');
+        expect(linkifiedSnippet).toEqual('You can visit the app on app.dasch.swiss/#');
     });
 
     it('should recognize the url with protocol followed by full stop', () => {
@@ -26,14 +26,14 @@ describe('LinkifyPipe', () => {
     });
 
     it('should recognize both urls in the example text', () => {
-        const text = 'You can visit the app on https://app.dasch.swiss and the documentation on docs.dasch.swiss.';
+        const text = 'You can visit the app on https://app.dasch.swiss and the documentation on https://docs.dasch.swiss.';
         const linkifiedSnippet = pipe.transform(text);
-        expect(linkifiedSnippet).toEqual('You can visit the app on <a href="https://app.dasch.swiss" target="_blank">https://app.dasch.swiss</a> and the documentation on <a href="http://docs.dasch.swiss" target="_blank">docs.dasch.swiss</a>.');
+        expect(linkifiedSnippet).toEqual('You can visit the app on <a href="https://app.dasch.swiss" target="_blank">https://app.dasch.swiss</a> and the documentation on <a href="https://docs.dasch.swiss" target="_blank">https://docs.dasch.swiss</a>.');
     });
 
     it('should keep the spaces after a full stop or after a comma', () => {
         const text = 'This is just a title. And it could have an URL, but it doesn\'t have one. ';
         const linkifiedSnippet = pipe.transform(text);
-        expect(linkifiedSnippet).toEqual('This is just a title. And it could have an URL, but it doesn\'t have one.');
+        expect(linkifiedSnippet).toEqual('This is just a title. And it could have an URL, but it doesn\'t have one. ');
     });
 });

src/app/main/pipes/string-transformation/linkify.pipe.ts

@@ -1,5 +1,5 @@
 import { Pipe, PipeTransform } from '@angular/core';
-
+import { CustomRegex } from 'src/app/workspace/resource/values/custom-regex';
 /**
  * this pipe analyses a string and converts any url into a href tag
  *
@@ -10,48 +10,18 @@ import { Pipe, PipeTransform } from '@angular/core';
 export class LinkifyPipe implements PipeTransform {
 
     transform(value: string): string {
-        let stylizedText = '';
         if (value && value.length > 0) {
-            for (let str of value.split(' ')) {
-                // if string/url ends with a full stop '.' or colon ':' or comma ',' or semicolon ';' the pipe will not recognize the url
-                const lastChar = str.substring(str.length - 1);
-                const endsWithFullStop = (lastChar === '.' || lastChar === ':' || lastChar === ',' || lastChar === ';');
-                let end = ' ';
-                if (endsWithFullStop) {
-                    str = str.slice(0, -1);
-                    end = lastChar + ' ';
-                }
-                if (this._recognizeUrl(str)) {
-                    const url = this._setProtocol(str);
-                    stylizedText += `<a href="${url}" target="_blank">${str}</a>${end}`;
-                } else {
-                    stylizedText += str + end;
-                }
+            const match = value.match(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig);
+            let final = value;
+            if (match) {
+                match.map(url=>{
+                    final = final.replace(url,`<a href="${url}" target="_blank">${url}</a>`);
+                });
             }
-            return stylizedText.trim();
+            return final;
         } else {
             return value;
         }
     }
 
-    private _recognizeUrl(str: string): boolean {
-        const pattern = new RegExp(
-            '^(https?:\\/\\/)?' + // protocol
-            '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' + // domain name
-            '((\\d{1,3}\\.){3}\\d{1,3}))' + // oR ip (v4) address
-            '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*' + // port and path
-            '(\\?[;&a-z\\d%_.~+=-]*)?' + // query string
-            '(\\#[-a-z\\d_]*)?$',
-            'i'
-        ); // fragment locator
-        return pattern.test(str);
-    }
-
-    private _setProtocol(url: string): string {
-        if (!/^(?:f|ht)tps?\:\/\//.test(url)) {
-            url = 'http://' + url;
-        }
-        return url;
-    }
-
 }