appview: refactor top starred repos · alice.pds.demo.boltless.dev/core@f60213c

+1 -9

appview/pages/pages.go

··· 299 299 type TimelineParams struct { 300 300 LoggedInUser *oauth.User 301 301 Timeline []db.TimelineEvent 302 + Repos []db.Repo 302 303 } 303 304 304 305 func (p *Pages) Timeline(w io.Writer, params TimelineParams) error { 305 306 return p.execute("timeline/timeline", w, params) 306 - } 307 - 308 - type TopStarredReposLastWeekParams struct { 309 - LoggedInUser *oauth.User 310 - Repos []db.Repo 311 - } 312 - 313 - func (p *Pages) TopStarredReposLastWeek(w io.Writer, params TopStarredReposLastWeekParams) error { 314 - return p.executePlain("timeline/fragments/topStarredRepos", w, params) 315 307 } 316 308 317 309 type SettingsParams struct {

-25

appview/pages/templates/timeline/fragments/topStarredRepos.html

··· 1 - {{ define "timeline/fragments/topStarredRepos" }} 2 - <div class="w-full md:mx-0"> 3 - <div class="p-6"> 4 - <h3 class="font-bold text-xl text-gray-900 dark:text-white flex items-center gap-2 mb-3"> 5 - Trending 6 - {{ i "trending-up" "size-4 flex-shrink-0" }} 7 - </h3> 8 - </div> 9 - <div class="flex gap-3 overflow-x-auto pb-4 px-4 scrollbar-hide"> 10 - {{ range $index, $repo := .Repos }} 11 - <div class="flex-none w-72 relative h-full"> 12 - <div class="relative h-full items-stretch border border-gray-200 dark:border-gray-700 rounded-sm"> 13 - {{ template "user/fragments/repoCard" (list $ $repo true) }} 14 - </div> 15 - </div> 16 - {{ else }} 17 - <div class="py-8 px-6 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-sm"> 18 - <div class="text-sm text-gray-500 dark:text-gray-400 text-center"> 19 - No trending repositories this week 20 - </div> 21 - </div> 22 - {{ end }} 23 - </div> 24 - </div> 25 - {{ end }}

+29 -32

appview/pages/templates/timeline/timeline.html

View file

··· 7 7 <meta property="og:description" content="tightly-knit social coding" /> 8 8 {{ end }} 9 9 10 - 11 - 12 - 13 10 {{ define "content" }} 14 - {{ with .LoggedInUser }} 15 - {{ block "trending" . }}{{ end }} 16 - {{ block "timeline" $ }}{{ end }} 11 + {{ if .LoggedInUser }} 17 12 {{ else }} 18 13 {{ block "hero" $ }}{{ end }} 19 - {{ block "trending" . }}{{ end }} 20 - {{ block "timeline" $ }}{{ end }} 21 14 {{ end }} 22 - {{ end }} 23 - 24 - {{ define "trending" }} 25 15 26 - <div 27 - hx-get="/timeline/trending" 28 - hx-trigger="load" 29 - hx-indicator="#starred-loading" 30 - > 31 -  32 - <div id="starred-loading" class="htmx-indicator"> 33 - <div class="p-6"> 34 - <h3 class="font-bold text-xl text-gray-900 dark:text-white flex items-center gap-2 mb-3"> 35 - Trending 36 - {{ i "trending-up" "size-4 flex-shrink-0" }} 37 - </h3> 38 - </div> 39 - <div class="flex items-center justify-center py-8"> 40 - <div class="animate-spin rounded-full h-6 w-6 border-b-2 border-gray-900 dark:border-white"></div> 41 - <span class="ml-2 text-sm text-gray-500 dark:text-gray-400">Loading...</span> 42 - </div> 43 - </div> 44 - </div> 16 + {{ block "trending" $ }}{{ end }} 17 + {{ block "timeline" $ }}{{ end }} 45 18 {{ end }} 46 19 47 20 {{ define "hero" }} ··· 67 40 </div> 68 41 {{ end }} 69 42 43 + {{ define "trending" }} 44 + <div class="w-full md:mx-0 py-4"> 45 + <div class="px-6 pb-4"> 46 + <h3 class="text-xl font-bold dark:text-white flex items-center gap-2"> 47 + Trending 48 + {{ i "trending-up" "size-4 flex-shrink-0" }} 49 + </h3> 50 + </div> 51 + <div class="flex gap-4 overflow-x-auto scrollbar-hide items-stretch"> 52 + {{ range $index, $repo := .Repos }} 53 + <div class="flex-none h-full border border-gray-200 dark:border-gray-700 rounded-sm w-96"> 54 + {{ template "user/fragments/repoCard" (list $ $repo true) }} 55 + </div> 56 + {{ else }} 57 + <div class="py-8 px-6 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-sm"> 58 + <div class="text-sm text-gray-500 dark:text-gray-400 text-center"> 59 + No trending repositories this week 60 + </div> 61 + </div> 62 + {{ end }} 63 + </div> 64 + </div> 65 + {{ end }} 66 + 70 67 {{ define "timeline" }} 71 - <div> 72 - <div class="p-6"> 68 + <div class="py-4"> 69 + <div class="px-6 pb-4"> 73 70 <p class="text-xl font-bold dark:text-white">Timeline</p> 74 71 </div> 75 72

+2 -2

appview/pages/templates/user/fragments/repoCard.html

View file

··· 4 4 {{ $fullName := index . 2 }} 5 5 6 6 {{ with $repo }} 7 - <div class="py-4 px-6 gap-2 flex flex-col drop-shadow-sm rounded bg-white dark:bg-gray-800"> 7 + <div class="py-4 px-6 gap-1 flex flex-col drop-shadow-sm rounded bg-white dark:bg-gray-800 min-h-32"> 8 8 <div class="font-medium dark:text-white flex items-center"> 9 9 {{ if .Source }} 10 10 {{ i "git-fork" "w-4 h-4 mr-1.5 shrink-0" }} ··· 20 20 {{- end -}} 21 21 </div> 22 22 {{ with .Description }} 23 - <div class="text-gray-600 dark:text-gray-300 text-sm"> 23 + <div class="text-gray-600 dark:text-gray-300 text-sm line-clamp-2"> 24 24 {{ . | description }} 25 25 </div> 26 26 {{ end }}

-1

appview/state/router.go

View file

··· 112 112 r.Handle("/static/*", s.pages.Static()) 113 113 114 114 r.Get("/", s.Timeline) 115 - r.Get("/timeline/trending", s.TopStarredReposLastWeek) 116 115 117 116 r.Route("/repo", func(r chi.Router) { 118 117 r.Route("/new", func(r chi.Router) {

+4 -9

appview/state/state.go

View file

··· 193 193 s.pages.Notice(w, "timeline", "Uh oh! Failed to load timeline.") 194 194 } 195 195 196 - s.pages.Timeline(w, pages.TimelineParams{ 197 - LoggedInUser: user, 198 - Timeline: timeline, 199 - }) 200 - } 201 - 202 - func (s *State) TopStarredReposLastWeek(w http.ResponseWriter, r *http.Request) { 203 196 repos, err := db.GetTopStarredReposLastWeek(s.db) 204 197 if err != nil { 205 198 log.Println(err) ··· 207 200 return 208 201 } 209 202 210 - s.pages.TopStarredReposLastWeek(w, pages.TopStarredReposLastWeekParams{ 211 - Repos: repos, 203 + s.pages.Timeline(w, pages.TimelineParams{ 204 + LoggedInUser: user, 205 + Timeline: timeline, 206 + Repos: repos, 212 207 }) 213 208 } 214 209

Configure Feed

Configure Feed