Hashtags system in mobile app

Developing Hashtags System in a Mobile App

Hashtags in mobile app — three separate tasks: parsing #tag during text input, autocomplete in editor, and tag page with content. Each has nuances not visible from requirements.

Parsing and Highlighting in Text

Hashtag in text must be clickable and visually distinct — blue or brand color. On iOS this is NSAttributedString with custom attributes:

func attributedText(from text: String) -> NSAttributedString {
    let attributed = NSMutableAttributedString(string: text)
    let hashtagPattern = #"#[\w\u0400-\u04FF]+"#  // Cyrillic support
    let regex = try! NSRegularExpression(pattern: hashtagPattern)
    let matches = regex.matches(in: text, range: NSRange(text.startIndex..., in: text))
    for match in matches {
        attributed.addAttribute(.foregroundColor, value: UIColor.systemBlue, range: match.range)
        attributed.addAttribute(.link, value: "hashtag://\(match.range)", range: match.range)
    }
    return attributed
}

Tap handling — via UITextView.delegate method textView(_:shouldInteractWith:in:interaction:). Intercept hashtag:// URL scheme and open tag screen.

On Compose — AnnotatedString with SpanStyle:

buildAnnotatedString {
    val hashtagRegex = Regex("#[\\w\\u0400-\\u04FF]+")
    var lastIndex = 0
    hashtagRegex.findAll(text).forEach { match ->
        append(text.substring(lastIndex, match.range.first))
        pushStringAnnotation("HASHTAG", match.value)
        withStyle(SpanStyle(color = MaterialTheme.colorScheme.primary)) { append(match.value) }
        pop()
        lastIndex = match.range.last + 1
    }
    append(text.substring(lastIndex))
}

Important: hashtag regex must support not only ASCII but also Cyrillic, Arabic, and other Unicode alphabets — \w in most implementations doesn't cover them without explicit Unicode ranges.

Autocomplete on Input

On typing # in post creation field start hashtag database search. Logic:

1. Track cursor position in text.
2. Find # before cursor without spaces.
3. Text after # — search query.
4. Request GET /hashtags/suggest?q=sp with 200ms debounce.
5. Show dropdown below input field (not above — keyboard covers).

On iOS dropdown — separate UITableView, added to UIWindow above main content. Position by caretRect(for:) from UITextInput. On hashtag select from list — insert in text via replace(_:withText:) and hide dropdown.

On Compose — ExposedDropdownMenuBox or custom Popup tied to input field.

Hashtag Database and Analytics

Table hashtags (id, name, posts_count). On post publish parse hashtags, find or create record in hashtags, create link post_hashtags (post_id, hashtag_id). posts_count updated via queue.

Tag page — GET /hashtags/{name}/posts with pagination. Sort by date or popularity (posts with most engagement last N days). Trending hashtags: worker counts posts_count last 24 hours, result cached in Redis 30 minutes.

Name Normalization

Hashtags case-insensitive: #React, #react, #REACT — one tag. Store lowercase, on search — LOWER(name) = LOWER(?) or index on LOWER(name). Spaces and special chars in hashtag name — remove during normalization.

Timeline

Parsing and clickable hashtags in text — 1 day. Autocomplete on input — another 1 day. Tag page with feed — 1-2 days. Full system — 2-3 business days. Cost calculated individually.