Warn the user on links that dont match their text (#1573)
* Add link warning modal when URLs do not match their text * Simplify the misleading link case for clarity * Fix typecheck * fix dark mode * Give a stronger visual indication of the root domain in the link warning * More rigorous URL mismatch logic * Remove debug --------- Co-authored-by: Ansh Nanda <anshnanda10@gmail.com>
This commit is contained in:
parent
2f157c152a
commit
fd5bbb2769
10 changed files with 357 additions and 3 deletions
|
@ -1,6 +1,7 @@
|
|||
import {AtUri} from '@atproto/api'
|
||||
import {PROD_SERVICE} from 'state/index'
|
||||
import TLDs from 'tlds'
|
||||
import psl from 'psl'
|
||||
|
||||
export function isValidDomain(str: string): boolean {
|
||||
return !!TLDs.find(tld => {
|
||||
|
@ -166,3 +167,53 @@ export function getYoutubeVideoId(link: string): string | undefined {
|
|||
}
|
||||
return videoId
|
||||
}
|
||||
|
||||
export function linkRequiresWarning(uri: string, label: string) {
|
||||
const labelDomain = labelToDomain(label)
|
||||
if (!labelDomain) {
|
||||
return true
|
||||
}
|
||||
try {
|
||||
const urip = new URL(uri)
|
||||
return labelDomain !== urip.hostname
|
||||
} catch {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
function labelToDomain(label: string): string | undefined {
|
||||
// any spaces just immediately consider the label a non-url
|
||||
if (/\s/.test(label)) {
|
||||
return undefined
|
||||
}
|
||||
try {
|
||||
return new URL(label).hostname
|
||||
} catch {}
|
||||
try {
|
||||
return new URL('https://' + label).hostname
|
||||
} catch {}
|
||||
return undefined
|
||||
}
|
||||
|
||||
export function isPossiblyAUrl(str: string): boolean {
|
||||
str = str.trim()
|
||||
if (str.startsWith('http://')) {
|
||||
return true
|
||||
}
|
||||
if (str.startsWith('https://')) {
|
||||
return true
|
||||
}
|
||||
const [firstWord] = str.split(/[\s\/]/)
|
||||
return isValidDomain(firstWord)
|
||||
}
|
||||
|
||||
export function splitApexDomain(hostname: string): [string, string] {
|
||||
const hostnamep = psl.parse(hostname)
|
||||
if (hostnamep.error || !hostnamep.listed || !hostnamep.domain) {
|
||||
return ['', hostname]
|
||||
}
|
||||
return [
|
||||
hostnamep.subdomain ? `${hostnamep.subdomain}.` : '',
|
||||
hostnamep.domain,
|
||||
]
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue