appview/pages: show user avatar in profile dropdown #287

merged
opened by uncenter.dev targeting master from uncenter.dev/core: feat/pic-handle-profile-dropdown

Similar to GitHub, your handle in the top right (for the profile dropdown) now shows the user's avatar to the side.

Changed files
+18 -12
appview
pages
templates
+3 -2
appview/pages/templates/layouts/topbar.html
··· 38 38 <summary 39 39 class="cursor-pointer list-none" 40 40 > 41 - {{ didOrHandle .Did .Handle }} 41 + {{ $user := didOrHandle .Did .Handle }} 42 + {{ template "user/fragments/picHandle" $user }} 42 43 </summary> 43 44 <div 44 45 class="absolute flex flex-col right-0 mt-4 p-4 rounded w-48 bg-white dark:bg-gray-800 dark:text-white border border-gray-200 dark:border-gray-700" 45 46 > 46 - <a href="/{{ didOrHandle .Did .Handle }}">profile</a> 47 + <a href="/{{ $user }}">profile</a> 47 48 <a href="/knots">knots</a> 48 49 <a href="/spindles">spindles</a> 49 50 <a href="/settings">settings</a>
+1 -1
appview/pages/templates/repo/issues/issue.html
··· 33 33 <span class="text-gray-500 dark:text-gray-400 text-sm flex flex-wrap items-center gap-1"> 34 34 opened by 35 35 {{ $owner := didOrHandle .Issue.OwnerDid .IssueOwnerHandle }} 36 - {{ template "user/fragments/picHandle" $owner }} 36 + {{ template "user/fragments/picHandleLink" $owner }} 37 37 <span class="select-none before:content-['\00B7']"></span> 38 38 <time title="{{ .Issue.Created | longTimeFmt }}"> 39 39 {{ .Issue.Created | timeFmt }}
+1 -1
appview/pages/templates/repo/issues/issues.html
··· 66 66 67 67 <span class="ml-1"> 68 68 {{ $owner := index $.DidHandleMap .OwnerDid }} 69 - {{ template "user/fragments/picHandle" $owner }} 69 + {{ template "user/fragments/picHandleLink" $owner }} 70 70 </span> 71 71 72 72 <span class="before:content-['·']">
+1 -1
appview/pages/templates/repo/pulls/fragments/pullHeader.html
··· 29 29 <span class="text-gray-500 dark:text-gray-400 text-sm flex flex-wrap items-center gap-1"> 30 30 opened by 31 31 {{ $owner := index $.DidHandleMap .Pull.OwnerDid }} 32 - {{ template "user/fragments/picHandle" $owner }} 32 + {{ template "user/fragments/picHandleLink" $owner }} 33 33 <span class="select-none before:content-['\00B7']"></span> 34 34 <time>{{ .Pull.Created | timeFmt }}</time> 35 35
+1 -1
appview/pages/templates/repo/pulls/pulls.html
··· 76 76 </span> 77 77 78 78 <span class="ml-1"> 79 - {{ template "user/fragments/picHandle" $owner }} 79 + {{ template "user/fragments/picHandleLink" $owner }} 80 80 </span> 81 81 82 82 <span>
+4 -4
appview/pages/templates/timeline.html
··· 61 61 {{ $userHandle := index $.DidHandleMap .Repo.Did }} 62 62 <div class="flex items-center"> 63 63 <p class="text-gray-600 dark:text-gray-300 flex flex-wrap items-center gap-2"> 64 - {{ template "user/fragments/picHandle" $userHandle }} 64 + {{ template "user/fragments/picHandleLink" $userHandle }} 65 65 {{ if .Source }} 66 66 forked 67 67 <a ··· 95 95 {{ $subjectHandle := index $.DidHandleMap .Follow.SubjectDid }} 96 96 <div class="flex items-center"> 97 97 <p class="text-gray-600 dark:text-gray-300 flex flex-wrap items-center gap-2"> 98 - {{ template "user/fragments/picHandle" $userHandle }} 98 + {{ template "user/fragments/picHandleLink" $userHandle }} 99 99 followed 100 - {{ template "user/fragments/picHandle" $subjectHandle }} 100 + {{ template "user/fragments/picHandleLink" $subjectHandle }} 101 101 <time 102 102 class="text-gray-700 dark:text-gray-400 text-xs" 103 103 >{{ .Follow.FollowedAt | timeFmt }}</time ··· 109 109 {{ $repoOwnerHandle := index $.DidHandleMap .Star.Repo.Did }} 110 110 <div class="flex items-center"> 111 111 <p class="text-gray-600 dark:text-gray-300 flex items-center gap-2"> 112 - {{ template "user/fragments/picHandle" $starrerHandle }} 112 + {{ template "user/fragments/picHandleLink" $starrerHandle }} 113 113 starred 114 114 <a 115 115 href="/{{ $repoOwnerHandle }}/{{ .Star.Repo.Name }}"
+2 -2
appview/pages/templates/user/fragments/picHandle.html
··· 1 1 {{ define "user/fragments/picHandle" }} 2 - <a href="/{{ . }}" class="flex items-center"> 2 + <div class="flex items-center"> 3 3 <img 4 4 src="{{ tinyAvatar . }}" 5 5 alt="{{ . }}" 6 6 class="rounded-full h-6 w-6 mr-1 border border-gray-300 dark:border-gray-700" 7 7 /> 8 8 {{ . | truncateAt30 }} 9 - </a> 9 + </div> 10 10 {{ end }}
+5
appview/pages/templates/user/fragments/picHandleLink.html
··· 1 + {{ define "user/fragments/picHandle" }} 2 + <a href="/{{ . }}"> 3 + {{ template "user/fragments/picHandleLink" . }} 4 + </a> 5 + {{ end }}