appview: implement follower and following pages for users #484

merged
opened by ptr.pet targeting master from [deleted fork]: followers-following-list
+2 -7
appview/db/profile.go
··· 348 348 return tx.Commit() 349 349 } 350 350 351 - func GetProfiles(e Execer, filters ...filter) ([]Profile, error) { 351 + func GetProfiles(e Execer, filters ...filter) (map[string]*Profile, error) { 352 352 var conditions []string 353 353 var args []any 354 354 for _, filter := range filters { ··· 448 448 idxs[did] = idx + 1 449 449 } 450 450 451 - var profiles []Profile 452 - for _, p := range profileMap { 453 - profiles = append(profiles, *p) 454 - } 455 - 456 - return profiles, nil 451 + return profileMap, nil 457 452 } 458 453 459 454 func GetProfile(e Execer, did string) (*Profile, error) {
+2 -6
appview/db/timeline.go
··· 151 151 return nil, nil 152 152 } 153 153 154 - profileMap := make(map[string]Profile) 155 154 profiles, err := GetProfiles(e, FilterIn("did", subjects)) 156 155 if err != nil { 157 156 return nil, err 158 157 } 159 - for _, p := range profiles { 160 - profileMap[p.Did] = p 161 - } 162 158 163 159 followStatMap := make(map[string]FollowStats) 164 160 for _, s := range subjects { ··· 174 170 175 171 var events []TimelineEvent 176 172 for _, f := range follows { 177 - profile, _ := profileMap[f.SubjectDid] 173 + profile, _ := profiles[f.SubjectDid] 178 174 followStatMap, _ := followStatMap[f.SubjectDid] 179 175 180 176 events = append(events, TimelineEvent{ 181 177 Follow: &f, 182 - Profile: &profile, 178 + Profile: profile, 183 179 FollowStats: &followStatMap, 184 180 EventAt: f.FollowedAt, 185 181 })
+5
appview/pages/funcmap.go
··· 271 271 "layoutCenter": func() string { 272 272 return "col-span-1 md:col-span-8 lg:col-span-6" 273 273 }, 274 + 275 + "normalizeForHtmlId": func(s string) string { 276 + // TODO: extend this to handle other cases? 277 + return strings.ReplaceAll(s, ":", "_") 278 + }, 274 279 } 275 280 } 276 281
+34 -5
appview/pages/pages.go
··· 411 411 } 412 412 413 413 type ProfileCard struct { 414 - UserDid string 415 - UserHandle string 416 - FollowStatus db.FollowStatus 417 - Followers int 418 - Following int 414 + UserDid string 415 + UserHandle string 416 + FollowStatus db.FollowStatus 417 + FollowersCount int 418 + FollowingCount int 419 419 420 420 Profile *db.Profile 421 421 } ··· 434 434 return p.execute("user/repos", w, params) 435 435 } 436 436 437 + type FollowCard struct { 438 + UserDid string 439 + UserDisplayName string 440 + FollowStatus db.FollowStatus 441 + FollowersCount int 442 + FollowingCount int 443 + Profile *db.Profile 444 + } 445 + 446 + type FollowersPageParams struct { 447 + LoggedInUser *oauth.User 448 + Followers []FollowCard 449 + Card ProfileCard 450 + } 451 + 452 + func (p *Pages) FollowersPage(w io.Writer, params FollowersPageParams) error { 453 + return p.execute("user/followers", w, params) 454 + } 455 + 456 + type FollowingPageParams struct { 457 + LoggedInUser *oauth.User 458 + Following []FollowCard 459 + Card ProfileCard 460 + } 461 + 462 + func (p *Pages) FollowingPage(w io.Writer, params FollowingPageParams) error { 463 + return p.execute("user/following", w, params) 464 + } 465 + 437 466 type FollowFragmentParams struct { 438 467 UserDid string 439 468 FollowStatus db.FollowStatus
+1 -1
appview/pages/templates/timeline.html
··· 150 150 {{ end }} 151 151 {{ end }} 152 152 {{ with $stat }} 153 - <div class="text-sm flex items-center gap-2 my-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-full text-sm"> 153 + <div class="text-sm flex items-center gap-2 my-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-full"> 154 154 <span class="flex-shrink-0">{{ i "users" "size-4" }}</span> 155 155 <span id="followers">{{ .Followers }} followers</span> 156 156 <span class="select-none after:content-['·']"></span>
+30
appview/pages/templates/user/followers.html
··· 1 + {{ define "title" }}{{ or .Card.UserHandle .Card.UserDid }} · followers {{ end }} 2 + 3 + {{ define "extrameta" }} 4 + <meta property="og:title" content="{{ or .Card.UserHandle .Card.UserDid }}'s followers" /> 5 + <meta property="og:type" content="object" /> 6 + <meta property="og:url" content="https://tangled.sh/{{ or .Card.UserHandle .Card.UserDid }}/followers" /> 7 + <meta property="og:description" content="{{ or .Card.Profile.Description .Card.UserHandle .Card.UserDid }}" /> 8 + {{ end }} 9 + 10 + {{ define "content" }} 11 + <div class="grid grid-cols-1 md:grid-cols-11 gap-4"> 12 + <div class="md:col-span-3 order-1 md:order-1"> 13 + {{ template "user/fragments/profileCard" .Card }} 14 + </div> 15 + <div id="all-followers" class="md:col-span-8 order-2 md:order-2"> 16 + {{ block "followers" . }}{{ end }} 17 + </div> 18 + </div> 19 + {{ end }} 20 + 21 + {{ define "followers" }} 22 + <p class="text-sm font-bold p-2 dark:text-white">ALL FOLLOWERS</p> 23 + <div id="followers" class="grid grid-cols-1 gap-4 mb-6"> 24 + {{ range .Followers }} 25 + {{ template "user/fragments/followCard" . }} 26 + {{ else }} 27 + <p class="px-6 dark:text-white">This user does not have any followers yet.</p> 28 + {{ end }} 29 + </div> 30 + {{ end }}
+30
appview/pages/templates/user/following.html
··· 1 + {{ define "title" }}{{ or .Card.UserHandle .Card.UserDid }} · following {{ end }} 2 + 3 + {{ define "extrameta" }} 4 + <meta property="og:title" content="{{ or .Card.UserHandle .Card.UserDid }}'s following" /> 5 + <meta property="og:type" content="object" /> 6 + <meta property="og:url" content="https://tangled.sh/{{ or .Card.UserHandle .Card.UserDid }}/following" /> 7 + <meta property="og:description" content="{{ or .Card.Profile.Description .Card.UserHandle .Card.UserDid }}" /> 8 + {{ end }} 9 + 10 + {{ define "content" }} 11 + <div class="grid grid-cols-1 md:grid-cols-11 gap-4"> 12 + <div class="md:col-span-3 order-1 md:order-1"> 13 + {{ template "user/fragments/profileCard" .Card }} 14 + </div> 15 + <div id="all-following" class="md:col-span-8 order-2 md:order-2"> 16 + {{ block "following" . }}{{ end }} 17 + </div> 18 + </div> 19 + {{ end }} 20 + 21 + {{ define "following" }} 22 + <p class="text-sm font-bold p-2 dark:text-white">ALL FOLLOWING</p> 23 + <div id="following" class="grid grid-cols-1 gap-4 mb-6"> 24 + {{ range .Following }} 25 + {{ template "user/fragments/followCard" . }} 26 + {{ else }} 27 + <p class="px-6 dark:text-white">This user does not follow anyone yet.</p> 28 + {{ end }} 29 + </div> 30 + {{ end }}
+2 -2
appview/pages/templates/user/fragments/follow.html
··· 1 1 {{ define "user/fragments/follow" }} 2 - <button id="followBtn" 2 + <button id="{{ normalizeForHtmlId .UserDid }}" 3 3 class="btn mt-2 w-full flex gap-2 items-center group" 4 4 5 5 {{ if eq .FollowStatus.String "IsNotFollowing" }} ··· 9 9 {{ end }} 10 10 11 11 hx-trigger="click" 12 - hx-target="#followBtn" 12 + hx-target="#{{ normalizeForHtmlId .UserDid }}" 13 13 hx-swap="outerHTML" 14 14 > 15 15 {{ if eq .FollowStatus.String "IsNotFollowing" }}Follow{{ else }}Unfollow{{ end }}
+28
appview/pages/templates/user/fragments/followCard.html
··· 1 + {{ define "user/fragments/followCard" }} 2 + <div class="flex flex-col divide-y divide-gray-200 dark:divide-gray-700 border border-gray-200 dark:border-gray-700 rounded-sm"> 3 + <div class="py-4 px-6 drop-shadow-sm rounded bg-white dark:bg-gray-800 flex items-center gap-4"> 4 + <div class="flex-shrink-0 max-h-full w-24 h-24"> 5 + <img class="object-cover rounded-full p-2" src="{{ fullAvatar .UserHandle }}" /> 6 + </div> 7 + 8 + <div class="flex-1 min-h-0 justify-around flex flex-col"> 9 + <a href="/{{ .UserHandle }}"> 10 + <span class="font-bold dark:text-white overflow-hidden text-ellipsis whitespace-nowrap max-w-full">{{ .UserDisplayName | truncateAt30 }}</span> 11 + </a> 12 + <p class="text-sm pb-2 md:pb-2">{{.Profile.Description}}</p> 13 + <div class="text-sm flex items-center gap-2 my-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-full"> 14 + <span class="flex-shrink-0">{{ i "users" "size-4" }}</span> 15 + <span id="followers">{{ .FollowersCount }} followers</span> 16 + <span class="select-none after:content-['·']"></span> 17 + <span id="following">{{ .FollowingCount }} following</span> 18 + </div> 19 + </div> 20 + 21 + {{ if ne .FollowStatus.String "IsSelf" }} 22 + <div class="max-w-24"> 23 + {{ template "user/fragments/follow" . }} 24 + </div> 25 + {{ end }} 26 + </div> 27 + </div> 28 + {{ end }}
+17 -14
appview/pages/templates/user/fragments/profileCard.html
··· 1 1 {{ define "user/fragments/profileCard" }} 2 + {{ $userIdent := didOrHandle .UserDid .UserHandle }} 2 3 <div class="bg-white dark:bg-gray-800 px-6 py-4 rounded drop-shadow-sm max-h-fit"> 3 4 <div class="grid grid-cols-3 md:grid-cols-1 gap-1 items-center"> 4 5 <div id="avatar" class="col-span-1 flex justify-center items-center"> ··· 8 9 </div> 9 10 <div class="col-span-2"> 10 11 <div class="flex items-center flex-row flex-nowrap gap-2"> 11 - <p title="{{ didOrHandle .UserDid .UserHandle }}" 12 + <p title="{{ $userIdent }}" 12 13 class="text-lg font-bold dark:text-white overflow-hidden text-ellipsis whitespace-nowrap"> 13 - {{ didOrHandle .UserDid .UserHandle }} 14 + {{ $userIdent }} 14 15 </p> 15 - <a href="/{{ didOrHandle .UserDid .UserHandle }}/feed.atom">{{ i "rss" "size-4" }}</a> 16 + <a href="/{{ $userIdent }}/feed.atom">{{ i "rss" "size-4" }}</a> 16 17 </div> 17 18 18 19 <div class="md:hidden"> 19 - {{ block "followerFollowing" (list .Followers .Following) }} {{ end }} 20 + {{ block "followerFollowing" (list . $userIdent) }} {{ end }} 20 21 </div> 21 22 </div> 22 23 <div class="col-span-3 md:col-span-full"> ··· 29 30 {{ end }} 30 31 31 32 <div class="hidden md:block"> 32 - {{ block "followerFollowing" (list $.Followers $.Following) }} {{ end }} 33 + {{ block "followerFollowing" (list $ $userIdent) }} {{ end }} 33 34 </div> 34 35 35 36 <div class="flex flex-col gap-2 mb-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-full"> ··· 42 43 {{ if .IncludeBluesky }} 43 44 <div class="flex items-center gap-2"> 44 45 <span class="flex-shrink-0">{{ template "user/fragments/bluesky" "w-4 h-4 text-black dark:text-white" }}</span> 45 - <a id="bluesky-link" href="https://bsky.app/profile/{{ $.UserDid }}">{{ didOrHandle $.UserDid $.UserHandle }}</a> 46 + <a id="bluesky-link" href="https://bsky.app/profile/{{ $.UserDid }}">{{ $userIdent }}</a> 46 47 </div> 47 48 {{ end }} 48 49 {{ range $link := .Links }} ··· 88 89 {{ end }} 89 90 90 91 {{ define "followerFollowing" }} 91 - {{ $followers := index . 0 }} 92 - {{ $following := index . 1 }} 93 - <div class="flex items-center gap-2 my-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-full text-sm"> 94 - <span class="flex-shrink-0">{{ i "users" "size-4" }}</span> 95 - <span id="followers">{{ $followers }} followers</span> 96 - <span class="select-none after:content-['·']"></span> 97 - <span id="following">{{ $following }} following</span> 98 - </div> 92 + {{ $root := index . 0 }} 93 + {{ $userIdent := index . 1 }} 94 + {{ with $root }} 95 + <div class="flex items-center gap-2 my-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-full text-sm"> 96 + <span class="flex-shrink-0">{{ i "users" "size-4" }}</span> 97 + <span id="followers"><a href="/{{ $userIdent }}/followers">{{ .FollowersCount }} followers</a></span> 98 + <span class="select-none after:content-['·']"></span> 99 + <span id="following"><a href="/{{ $userIdent }}/following">{{ .FollowingCount }} following</a></span> 100 + </div> 101 + {{ end }} 99 102 {{ end }} 100 103
+188 -12
appview/state/profile.go
··· 17 17 "github.com/gorilla/feeds" 18 18 "tangled.sh/tangled.sh/core/api/tangled" 19 19 "tangled.sh/tangled.sh/core/appview/db" 20 + "tangled.sh/tangled.sh/core/appview/oauth" 20 21 "tangled.sh/tangled.sh/core/appview/pages" 21 22 ) 22 23 ··· 136 137 Repos: pinnedRepos, 137 138 CollaboratingRepos: pinnedCollaboratingRepos, 138 139 Card: pages.ProfileCard{ 139 - UserDid: ident.DID.String(), 140 - UserHandle: ident.Handle.String(), 141 - Profile: profile, 142 - FollowStatus: followStatus, 143 - Followers: followers, 144 - Following: following, 140 + UserDid: ident.DID.String(), 141 + UserHandle: ident.Handle.String(), 142 + Profile: profile, 143 + FollowStatus: followStatus, 144 + FollowersCount: followers, 145 + FollowingCount: following, 145 146 }, 146 147 Punchcard: punchcard, 147 148 ProfileTimeline: timeline, ··· 184 185 LoggedInUser: loggedInUser, 185 186 Repos: repos, 186 187 Card: pages.ProfileCard{ 187 - UserDid: ident.DID.String(), 188 - UserHandle: ident.Handle.String(), 189 - Profile: profile, 190 - FollowStatus: followStatus, 191 - Followers: followers, 192 - Following: following, 188 + UserDid: ident.DID.String(), 189 + UserHandle: ident.Handle.String(), 190 + Profile: profile, 191 + FollowStatus: followStatus, 192 + FollowersCount: followers, 193 + FollowingCount: following, 194 + }, 195 + }) 196 + } 197 + 198 + func (s *State) makeFollowCards(ctx context.Context, loggedInUser *oauth.User, follows []db.Follow, extractDid func(db.Follow) string) ([]pages.FollowCard, error) { 199 + if len(follows) == 0 { 200 + return nil, nil 201 + } 202 + 203 + followDids := make([]string, 0, len(follows)) 204 + for _, follow := range follows { 205 + followDids = append(followDids, extractDid(follow)) 206 + } 207 + 208 + profiles, err := db.GetProfiles(s.db, db.FilterIn("did", followDids)) 209 + if err != nil { 210 + return nil, err 211 + } 212 + 213 + var loggedInUserFollowing map[string]struct{} 214 + if loggedInUser != nil { 215 + following, err := db.GetFollowing(s.db, loggedInUser.Did) 216 + if err != nil { 217 + return nil, err 218 + } 219 + if len(following) > 0 { 220 + loggedInUserFollowing = make(map[string]struct{}, len(following)) 221 + for _, follow := range following { 222 + loggedInUserFollowing[follow.SubjectDid] = struct{}{} 223 + } 224 + } 225 + } 226 + 227 + followCards := make([]pages.FollowCard, 0, len(follows)) 228 + for _, did := range followDids { 229 + var handle string 230 + if ident, err := s.idResolver.ResolveIdent(ctx, did); err != nil { 231 + log.Printf("can't resolve handle for %s: %s", did, err) 232 + handle = did 233 + } else if ident.Handle.IsInvalidHandle() { 234 + handle = fmt.Sprintf("handle.invalid (%s)", did) 235 + } else { 236 + handle = ident.Handle.String() 237 + } 238 + followersCount, followingCount, err := db.GetFollowerFollowingCount(s.db, did) 239 + if err != nil { 240 + log.Printf("getting follow stats for %s: %s", did, err) 241 + } 242 + followStatus := db.IsNotFollowing 243 + if loggedInUserFollowing != nil { 244 + if _, exists := loggedInUserFollowing[did]; exists { 245 + followStatus = db.IsFollowing 246 + } else if loggedInUser.Did == did { 247 + followStatus = db.IsSelf 248 + } 249 + } 250 + var profile *db.Profile 251 + if p, exists := profiles[did]; exists { 252 + profile = p 253 + } else { 254 + profile = &db.Profile{} 255 + profile.Did = did 256 + } 257 + followCards = append(followCards, pages.FollowCard{ 258 + UserDid: did, 259 + UserDisplayName: handle, 260 + FollowStatus: followStatus, 261 + FollowersCount: followersCount, 262 + FollowingCount: followingCount, 263 + Profile: profile, 264 + }) 265 + } 266 + return followCards, nil 267 + } 268 + 269 + func (s *State) followersPage(w http.ResponseWriter, r *http.Request) { 270 + ident, ok := r.Context().Value("resolvedId").(identity.Identity) 271 + if !ok { 272 + s.pages.Error404(w) 273 + return 274 + } 275 + 276 + profile, err := db.GetProfile(s.db, ident.DID.String()) 277 + if err != nil { 278 + log.Printf("getting profile data followers for %s: %s", ident.DID.String(), err) 279 + } 280 + 281 + loggedInUser := s.oauth.GetUser(r) 282 + 283 + followers, err := db.GetFollowers(s.db, ident.DID.String()) 284 + if err != nil { 285 + log.Printf("getting followers followers for %s: %s", ident.DID.String(), err) 286 + } 287 + followerCards, err := s.makeFollowCards( 288 + r.Context(), 289 + loggedInUser, 290 + followers, 291 + func(f db.Follow) string { return f.UserDid }, 292 + ) 293 + if err != nil { 294 + log.Printf("getting follow followers cards for %s: %s", ident.DID.String(), err) 295 + } 296 + 297 + followStatus := db.IsNotFollowing 298 + if loggedInUser != nil { 299 + followStatus = db.GetFollowStatus(s.db, loggedInUser.Did, ident.DID.String()) 300 + } 301 + 302 + followersCount, followingCount, err := db.GetFollowerFollowingCount(s.db, ident.DID.String()) 303 + if err != nil { 304 + log.Printf("getting follow stats followers for %s: %s", ident.DID.String(), err) 305 + } 306 + 307 + s.pages.FollowersPage(w, pages.FollowersPageParams{ 308 + LoggedInUser: loggedInUser, 309 + Followers: followerCards, 310 + Card: pages.ProfileCard{ 311 + UserDid: ident.DID.String(), 312 + UserHandle: ident.Handle.String(), 313 + Profile: profile, 314 + FollowStatus: followStatus, 315 + FollowersCount: followersCount, 316 + FollowingCount: followingCount, 317 + }, 318 + }) 319 + } 320 + 321 + func (s *State) followingPage(w http.ResponseWriter, r *http.Request) { 322 + ident, ok := r.Context().Value("resolvedId").(identity.Identity) 323 + if !ok { 324 + s.pages.Error404(w) 325 + return 326 + } 327 + 328 + profile, err := db.GetProfile(s.db, ident.DID.String()) 329 + if err != nil { 330 + log.Printf("getting profile data following for %s: %s", ident.DID.String(), err) 331 + } 332 + 333 + loggedInUser := s.oauth.GetUser(r) 334 + 335 + following, err := db.GetFollowing(s.db, ident.DID.String()) 336 + if err != nil { 337 + log.Printf("getting following following for %s: %s", ident.DID.String(), err) 338 + } 339 + followingCards, err := s.makeFollowCards( 340 + r.Context(), 341 + loggedInUser, 342 + following, 343 + func(f db.Follow) string { return f.SubjectDid }, 344 + ) 345 + if err != nil { 346 + log.Printf("getting follow following cards for %s: %s", ident.DID.String(), err) 347 + } 348 + 349 + followStatus := db.IsNotFollowing 350 + if loggedInUser != nil { 351 + followStatus = db.GetFollowStatus(s.db, loggedInUser.Did, ident.DID.String()) 352 + } 353 + 354 + followersCount, followingCount, err := db.GetFollowerFollowingCount(s.db, ident.DID.String()) 355 + if err != nil { 356 + log.Printf("getting follow stats following for %s: %s", ident.DID.String(), err) 357 + } 358 + 359 + s.pages.FollowingPage(w, pages.FollowingPageParams{ 360 + LoggedInUser: loggedInUser, 361 + Following: followingCards, 362 + Card: pages.ProfileCard{ 363 + UserDid: ident.DID.String(), 364 + UserHandle: ident.Handle.String(), 365 + Profile: profile, 366 + FollowStatus: followStatus, 367 + FollowersCount: followersCount, 368 + FollowingCount: followingCount, 193 369 }, 194 370 }) 195 371 }
+2
appview/state/router.go
··· 70 70 71 71 r.With(mw.ResolveIdent()).Route("/{user}", func(r chi.Router) { 72 72 r.Get("/", s.Profile) 73 + r.Get("/followers", s.followersPage) 74 + r.Get("/following", s.followingPage) 73 75 r.Get("/feed.atom", s.AtomFeedPage) 74 76 75 77 r.With(mw.ResolveRepo()).Route("/{repo}", func(r chi.Router) {
+7 -7
appview/strings/strings.go
··· 182 182 followStatus = db.GetFollowStatus(s.Db, loggedInUser.Did, id.DID.String()) 183 183 } 184 184 185 - followers, following, err := db.GetFollowerFollowingCount(s.Db, id.DID.String()) 185 + followersCount, followingCount, err := db.GetFollowerFollowingCount(s.Db, id.DID.String()) 186 186 if err != nil { 187 187 l.Error("failed to get follow stats", "err", err) 188 188 } ··· 190 190 s.Pages.StringsDashboard(w, pages.StringsDashboardParams{ 191 191 LoggedInUser: s.OAuth.GetUser(r), 192 192 Card: pages.ProfileCard{ 193 - UserDid: id.DID.String(), 194 - UserHandle: id.Handle.String(), 195 - Profile: profile, 196 - FollowStatus: followStatus, 197 - Followers: followers, 198 - Following: following, 193 + UserDid: id.DID.String(), 194 + UserHandle: id.Handle.String(), 195 + Profile: profile, 196 + FollowStatus: followStatus, 197 + FollowersCount: followersCount, 198 + FollowingCount: followingCount, 199 199 }, 200 200 Strings: all, 201 201 })