diff --git a/packages/nc-gui/utils/urlUtils.ts b/packages/nc-gui/utils/urlUtils.ts index 1d21a98848..9d13496b1c 100644 --- a/packages/nc-gui/utils/urlUtils.ts +++ b/packages/nc-gui/utils/urlUtils.ts @@ -5,25 +5,31 @@ export const replaceUrlsWithLink = (text: string): boolean | string => { } const rawText = text.toString() - // create a temporary element to sanitise the string - // by encoding any html code + // Create a temporary element to sanitize the string by encoding any HTML code const tempEl = document.createElement('div') tempEl.textContent = rawText const sanitisedText = tempEl.innerHTML - let found = false - const out = sanitisedText.replace(/URI::\(([^)]+)\)(?: LABEL::\(([^)]*)\))?/g, (_, url, label) => { - found = true + const protocolRegex = /^(https?|ftp|mailto|file):\/\// + + const out = sanitisedText.replace(/URI::\(([^)]*)\)(?: LABEL::\(([^)]*)\))?/g, (_, url, label) => { + if (!url.trim() && !label) { + return ' ' + } + + const fullUrl = protocolRegex.test(url) ? url : url.trim() ? `http://${url}` : '' + const anchorLabel = label || url || '' + const a = document.createElement('a') - a.textContent = label || url // Use the label if it exists and is not empty, otherwise use the URL - a.setAttribute('href', url) + a.textContent = anchorLabel + a.setAttribute('href', fullUrl) a.setAttribute('class', ' nc-cell-field-link') a.setAttribute('target', '_blank') a.setAttribute('rel', 'noopener,noreferrer') return a.outerHTML }) - return found && out + return out } export const isValidURL = (str: string, extraProps?) => {