Reorder timeline tweets according to their threads

public/style.css

@@ -322,6 +322,10 @@ video {
     display: contents !important;
 }
 
+.retweet {
+    margin-top: -5px !important;
+}
+
 .retweet, .pinned, .tweet-stats {
     align-content: center;
     color: hsla(240,1%,73%,.7);

src/api.nim

@@ -284,9 +284,12 @@ proc getTimeline*(username, after: string): Future[Timeline] {.async.} =
   result = await finishTimeline(json, none(Query))
 
 proc getTimelineSearch*(username, after: string; query: Query): Future[Timeline] {.async.} =
+  let queryParam = genQueryParam(query)
+  let queryEncoded = encodeUrl(queryParam, usePlus=false)
+
   let headers = newHttpHeaders({
     "Accept": jsonAccept,
-    "Referer": $(base / ("search?f=tweets&q=from%3A$1&src=typd" % username)),
+    "Referer": $(base / ("search?f=tweets&vertical=default&q=$1&src=typd" % queryEncoded)),
     "User-Agent": agent,
     "X-Requested-With": "XMLHttpRequest",
     "Authority": "twitter.com",
@@ -296,7 +299,7 @@ proc getTimelineSearch*(username, after: string; query: Query): Future[Timeline]
   let params = {
     "f": "tweets",
     "vertical": "default",
-    "q": genQueryParam(query),
+    "q": queryParam,
     "src": "typd",
     "include_available_features": "1",
     "include_entities": "1",

src/parser.nim

@@ -62,6 +62,7 @@ proc parseTweet*(node: XmlNode): Tweet =
 
   result = Tweet(
     id:        tweet.attr("data-item-id"),
+    threadId:  tweet.attr("data-conversation-id"),
     text:      getTweetText(tweet),
     time:      getTimestamp(tweet),
     shortTime: getShortTime(tweet),

src/types.nim

@@ -92,6 +92,7 @@ type
 
   Tweet* = ref object
     id*: string
+    threadId*: string
     profile*: Profile
     text*: string
     time*: Time

src/views/user.nimf

@@ -1,5 +1,5 @@
 #? stdtmpl(subsChar = '$', metaChar = '#')
-#import xmltree, strutils, uri
+#import xmltree, strutils, uri, algorithm
 #import ../types, ../formatters, ../utils, ../search
 #include "tweet.nimf"
 #
@@ -68,7 +68,7 @@
 #end proc
 #
 #proc renderTimeline*(timeline: Timeline; profile: Profile; beginning: bool): string =
-#var retweets: seq[string]
+#var threads: seq[string]
 #var query = "?"
 #if timeline.query.isSome: query = genQueryUrl(get(timeline.query))
 #end if
@@ -80,10 +80,24 @@
   #end if
   #
   #for tweet in timeline.tweets:
-  #if tweet.id in retweets: continue
-  #elif tweet.retweet.isSome: retweets.add tweet.id
+  #if tweet.threadId in threads: continue
   #end if
+  #proc threadFilter(it: Tweet): bool =
+  #it.retweet.isNone and it.reply.len == 0 and it.threadId == tweet.threadId
+  #end proc
+  #let thread = timeline.tweets.filter(threadFilter)
+  #if thread.len < 2:
   ${renderTweet(tweet, "timeline-tweet")}
+  #else:
+  <div class="thread-line">
+    #for i, threadTweet in thread.sortedByIt(it.time):
+    #let last = (i == thread.high)
+    #let class = if last: "timeline-tweet" else: "thread"
+    ${renderTweet(threadTweet, class, first=(i == 0), last=last)}
+    #end for
+  </div>
+  #threads.add tweet.threadId
+  #end if
   #end for
   #
   #if timeline.hasMore or timeline.query.isSome and timeline.tweets.len > 0: