feat: added following system using cookies

src/views/profile.nim

@@ -12,7 +12,7 @@ proc renderStat(num: int; class: string; text=""): VNode =
     span(class="profile-stat-num"):
       text insertSep($num, ',')
 
-proc renderUserCard*(user: User; prefs: Prefs): VNode =
+proc renderUserCard*(user: User; prefs: Prefs; path: string): VNode =
   let class = if user.sensitive: "profile-card nsfw" else: "profile-card"
   buildHtml(tdiv(class=class)):
     tdiv(class="profile-card-info"):
@@ -25,9 +25,12 @@ proc renderUserCard*(user: User; prefs: Prefs): VNode =
       a(class="profile-card-avatar", href=url, target="_blank"):
         genImg(user.getUserPic(size))
 
-      tdiv(class="profile-card-tabs-name"):
-        linkUser(user, class="profile-card-fullname")
-        linkUser(user, class="profile-card-username")
+      tdiv(class="profile-header"):
+        tdiv(class="profile-card-tabs-name"):
+          linkUser(user, class="profile-card-fullname")
+          linkUser(user, class="profile-card-username")
+
+        renderFollowButton(user, prefs, path)
 
     tdiv(class="profile-card-extra"):
       if user.bio.len > 0:
@@ -110,7 +113,7 @@ proc renderProfile*(profile: var Profile; prefs: Prefs; path: string): VNode =
 
     let sticky = if prefs.stickyProfile: " sticky" else: ""
     tdiv(class=("profile-tab" & sticky)):
-      renderUserCard(profile.user, prefs)
+      renderUserCard(profile.user, prefs, path)
       if profile.photoRail.len > 0:
         renderPhotoRail(profile)
 

src/views/renderutils.nim

@@ -100,3 +100,15 @@ proc getTabClass*(query: Query; tab: QueryKind): string =
 proc getAvatarClass*(prefs: Prefs): string =
   if prefs.squareAvatars: "avatar"
   else: "avatar round"
+
+proc renderFollowButton*(user: User; prefs: Prefs; path: string): VNode =
+  let
+    isFollowing = user.username in prefs.following
+    action = if isFollowing: "/unfollow" else: "/follow"
+    text = if isFollowing: "Unfollow" else: "Follow"
+    class = if isFollowing: "follow-button unfollow" else: "follow-button"
+
+  buildHtml(form(action=action, `method`="post", class="follow-form")):
+    refererField path
+    hiddenField("user", user.username)
+    button(class=class, `type`="submit"): text text

src/views/search.nim

@@ -108,7 +108,7 @@ proc renderTweetSearch*(results: Timeline; prefs: Prefs; path: string;
 
     renderTimelineTweets(results, prefs, path, pinned)
 
-proc renderUserSearch*(results: Result[User]; prefs: Prefs): VNode =
+proc renderUserSearch*(results: Result[User]; prefs: Prefs; path: string): VNode =
   buildHtml(tdiv(class="timeline-container")):
     tdiv(class="timeline-header"):
       form(`method`="get", action="/search", class="search-field", autocomplete="off"):
@@ -117,4 +117,4 @@ proc renderUserSearch*(results: Result[User]; prefs: Prefs): VNode =
         button(`type`="submit"): icon "search"
 
     renderSearchTabs(results.query)
-    renderTimelineUsers(results, prefs)
+    renderTimelineUsers(results, prefs, path)

src/views/timeline.nim

@@ -55,7 +55,7 @@ proc renderThread(thread: Tweets; prefs: Prefs; path: string): VNode =
       renderTweet(tweet, prefs, path, class=(header & "thread"),
                   index=i, last=(i == thread.high), showThread=show)
 
-proc renderUser(user: User; prefs: Prefs): VNode =
+proc renderUser(user: User; prefs: Prefs; path: string): VNode =
   let class = if user.sensitive: "timeline-item nsfw" else: "timeline-item"
   buildHtml(tdiv(class=class)):
     a(class="tweet-link", href=("/" & user.username))
@@ -67,6 +67,7 @@ proc renderUser(user: User; prefs: Prefs): VNode =
         tdiv(class="tweet-name-row"):
           tdiv(class="fullname-and-username"):
             linkUser(user, class="fullname")
+          renderFollowButton(user, prefs, path)
         linkUser(user, class="username")
 
       tdiv(class="tweet-content media-body", dir="auto"):
@@ -79,7 +80,7 @@ proc renderTimelineUsers*(results: Result[User]; prefs: Prefs; path=""): VNode =
 
     if results.content.len > 0:
       for user in results.content:
-        renderUser(user, prefs)
+        renderUser(user, prefs, path)
       if results.bottom.len > 0:
         renderMore(results.query, results.bottom)
       renderToTop()