diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/lib/strings.ts | 46 | ||||
-rw-r--r-- | src/view/com/composer/ComposePost.tsx | 29 | ||||
-rw-r--r-- | src/view/com/util/RichText.tsx | 10 |
3 files changed, 64 insertions, 21 deletions
diff --git a/src/lib/strings.ts b/src/lib/strings.ts index c8a9171a3..ea2a4dd9f 100644 --- a/src/lib/strings.ts +++ b/src/lib/strings.ts @@ -82,13 +82,18 @@ export function extractEntities( } { // links - const re = /(^|\s)(https?:\/\/[\S]+)(\b)/dg + const re = + /(^|\s)((https?:\/\/[\S]+)|([a-z][a-z0-9]*\.[a-z0-9\.]+[\S]*))(\b)/dg while ((match = re.exec(text))) { + let value = match[2] + if (!value.startsWith('http')) { + value = `https://${value}` + } ents.push({ type: 'link', - value: match[2], + value, index: { - start: match.indices[1][0], // skip the (^|\s) but include the '@' + start: match.indices[2][0], // skip the (^|\s) end: match.indices[2][1], }, }) @@ -97,6 +102,41 @@ export function extractEntities( return ents.length > 0 ? ents : undefined } +interface DetectedLink { + link: string +} +type DetectedLinkable = string | DetectedLink +export function detectLinkables(text: string): DetectedLinkable[] { + const re = + /((^|\s)@[a-z0-9\.-]*)|((^|\s)https?:\/\/[\S]+)|((^|\s)[a-z][a-z0-9]*\.[a-z0-9\.]+[\S]*)/gi + const segments = [] + let match + let start = 0 + while ((match = re.exec(text))) { + let matchIndex = match.index + let matchValue = match[0] + + if (/\s/.test(matchValue)) { + // HACK + // skip the starting space + // we have to do this because RN doesnt support negative lookaheads + // -prf + matchIndex++ + matchValue = matchValue.slice(1) + } + + if (start !== matchIndex) { + segments.push(text.slice(start, matchIndex)) + } + segments.push({link: matchValue}) + start = matchIndex + matchValue.length + } + if (start < text.length) { + segments.push(text.slice(start)) + } + return segments +} + export function makeValidHandle(str: string): string { if (str.length > 20) { str = str.slice(0, 20) diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx index c104041aa..cc9eca068 100644 --- a/src/view/com/composer/ComposePost.tsx +++ b/src/view/com/composer/ComposePost.tsx @@ -20,6 +20,7 @@ import {useStores} from '../../../state' import * as apilib from '../../../state/lib/api' import {ComposerOpts} from '../../../state/models/shell-ui' import {s, colors, gradients} from '../../lib/styles' +import {detectLinkables} from '../../../lib/strings' const MAX_TEXT_LENGTH = 256 const WARNING_TEXT_LENGTH = 200 @@ -108,24 +109,18 @@ export const ComposePost = observer(function ComposePost({ : undefined const textDecorated = useMemo(() => { - const re = /(@[a-z0-9\.]*)|(https?:\/\/[\S]+)/gi - const segments = [] - let match - let start = 0 let i = 0 - while ((match = re.exec(text))) { - segments.push(text.slice(start, match.index)) - segments.push( - <Text key={i++} style={{color: colors.blue3}}> - {match[0]} - </Text>, - ) - start = match.index + match[0].length - } - if (start < text.length) { - segments.push(text.slice(start)) - } - return segments + return detectLinkables(text).map(v => { + if (typeof v === 'string') { + return v + } else { + return ( + <Text key={i++} style={{color: colors.blue3}}> + {v.link} + </Text> + ) + } + }) }, [text]) return ( diff --git a/src/view/com/util/RichText.tsx b/src/view/com/util/RichText.tsx index 3c54094ba..a67f90a63 100644 --- a/src/view/com/util/RichText.tsx +++ b/src/view/com/util/RichText.tsx @@ -77,7 +77,9 @@ function* toSegments(text: string, entities: Entity[]) { let subtext = text.slice(currEnt.index.start, currEnt.index.end) if ( !subtext.trim() || - stripUsername(subtext) !== stripUsername(currEnt.value) + (currEnt.type === 'mention' && + stripUsername(subtext) !== stripUsername(currEnt.value)) || + (currEnt.type === 'link' && !isSameLink(subtext, currEnt.value)) ) { // dont yield links to empty strings or strings that don't match the entity value yield subtext @@ -99,3 +101,9 @@ function* toSegments(text: string, entities: Entity[]) { function stripUsername(v: string): string { return v.trim().replace('@', '') } + +function isSameLink(a: string, b: string) { + a = a.startsWith('http') ? a : `https://${a}` + b = b.startsWith('http') ? b : `https://${b}` + return a === b +} |