diff --git a/src/app/main/pipes/string-transformation/linkify.pipe.spec.ts b/src/app/main/pipes/string-transformation/linkify.pipe.spec.ts index dca2367e44..dd956514fd 100644 --- a/src/app/main/pipes/string-transformation/linkify.pipe.spec.ts +++ b/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 app.dasch.swiss/#'); + 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 https://app.dasch.swiss and the documentation on docs.dasch.swiss.'); + expect(linkifiedSnippet).toEqual('You can visit the app on https://app.dasch.swiss and the documentation on https://docs.dasch.swiss.'); }); 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. '); }); }); diff --git a/src/app/main/pipes/string-transformation/linkify.pipe.ts b/src/app/main/pipes/string-transformation/linkify.pipe.ts index b27412e783..e63eb7341e 100644 --- a/src/app/main/pipes/string-transformation/linkify.pipe.ts +++ b/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 += `${str}${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,`${url}`); + }); } - 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; - } - }