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:
Paul Frazee 2023-10-02 14:47:39 -07:00 committed by GitHub
parent 2f157c152a
commit fd5bbb2769
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 357 additions and 3 deletions

View file

@ -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,
]
}