show avatars in account manager

juli.ee 97cf9d91 74934a18

verified
Changed files
+17 -8
src
components
+17 -8
src/components/account.tsx
··· 11 11 const AccountManager = () => { 12 12 const [openManager, setOpenManager] = createSignal(false); 13 13 const [sessions, setSessions] = createStore<Record<string, string | undefined>>(); 14 - const [avatar, setAvatar] = createSignal<string>(); 14 + const [avatars, setAvatars] = createStore<Record<Did, string>>(); 15 15 16 16 onMount(async () => { 17 17 await retrieveSession(); ··· 29 29 } 30 30 }); 31 31 }); 32 + sessionDids.forEach(async (did) => { 33 + const avatar = await getAvatar(did); 34 + if (avatar) setAvatars(did, avatar); 35 + }); 32 36 } 33 - 34 - const repo = localStorage.getItem("lastSignedIn"); 35 - if (repo) setAvatar(await getAvatar(repo as Did)); 36 37 }); 37 38 38 39 const resumeSession = async (did: Did) => { 39 40 localStorage.setItem("lastSignedIn", did); 40 41 retrieveSession(); 41 - setAvatar(await getAvatar(did)); 42 42 }; 43 43 44 44 const removeSession = async (did: Did) => { ··· 81 81 class="flex w-full items-center justify-between gap-1 truncate rounded-lg p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600" 82 82 onclick={() => resumeSession(did as Did)} 83 83 > 84 - <span class="truncate">{sessions[did]?.length ? sessions[did] : did}</span> 84 + <span class="flex items-center gap-2"> 85 + <img 86 + src={avatars[did as Did].replace("img/avatar/", "img/avatar_thumbnail/")} 87 + class="size-5 rounded-full" 88 + /> 89 + <span class="truncate">{sessions[did]?.length ? sessions[did] : did}</span> 90 + </span> 85 91 <Show when={did === agent()?.sub}> 86 92 <span class="iconify lucide--check shrink-0"></span> 87 93 </Show> ··· 110 116 onclick={() => setOpenManager(true)} 111 117 class="flex items-center rounded-lg p-1 hover:bg-neutral-200 active:bg-neutral-300 dark:hover:bg-neutral-700 dark:active:bg-neutral-600" 112 118 > 113 - {agent() && avatar() ? 114 - <img src={avatar()} class="size-5 rounded-full" /> 119 + {agent() && avatars[agent()!.sub] ? 120 + <img 121 + src={avatars[agent()!.sub].replace("img/avatar/", "img/avatar_thumbnail/")} 122 + class="size-5 rounded-full" 123 + /> 115 124 : <span class="iconify lucide--circle-user-round text-xl"></span>} 116 125 </button> 117 126 </>