feat: fetch avatars

src/home/fetch-github/fetch-avatar.ts

@@ -3,8 +3,7 @@ import { getGitHubAccessToken } from "../getters/get-github-access-token";
 import { getImageFromCache, saveImageToCache } from "../getters/get-indexed-db";
 import { renderErrorInModal } from "../rendering/display-popup-modal";
 import { organizationImageCache } from "./fetch-data";
-import { GitHubNotifications } from "../github-types";
-import { notifications } from "../home";
+import { GitHubAggregated, GitHubNotification, GitHubNotifications } from "../github-types";
 
 // Map to track ongoing avatar fetches
 const pendingFetches: Map<string, Promise<Blob | void>> = new Map();
@@ -100,10 +99,10 @@ export async function fetchAvatar(orgName: string): Promise<Blob | void> {
 }
 
 // fetches avatars for all tasks (issues) cached. it will fetch only once per organization, remaining are returned from cache
-export async function fetchAvatars() {
+export async function fetchAvatars(notifications: GitHubAggregated[]) {
   // fetches avatar for each organization for each task, but fetchAvatar() will only fetch once per organization, remaining are returned from cache
-  const avatarPromises = notifications.map(async (task: GitHubNotifications) => {
-    const [orgName] = task.repository_url.split("/").slice(-2);
+  const avatarPromises = notifications.map(async (task: GitHubAggregated) => {
+    const [orgName] = task.notification.repository.url.split("/").slice(-2);
     if (orgName) {
       return fetchAvatar(orgName);
     }

src/home/home.ts

@@ -1,7 +1,9 @@
 import { grid } from "../the-grid";
 import { authentication } from "./authentication";
 import { displayNotifications } from "./fetch-github/fetch-and-display-previews";
+import { fetchAvatars } from "./fetch-github/fetch-avatar";
 import { fetchAllNotifications, fetchIssueNotifications, fetchPullRequestNotifications } from "./fetch-github/fetch-data";
+import { GitHubNotifications } from "./github-types";
 import { readyToolbar } from "./ready-toolbar";
 import { renderServiceMessage } from "./render-service-message";
 import { renderErrorInModal } from "./rendering/display-popup-modal";
@@ -32,6 +34,9 @@ void (async function home() {
   void authentication();
   void readyToolbar();
   const notifications = await fetchAllNotifications();
+  if(notifications){
+    void fetchAvatars(notifications);
+  }
   void displayNotifications(notifications);
 
   // Register service worker for PWA

src/home/rendering/render-github-issues.ts

@@ -34,7 +34,7 @@ export function renderNotifications(notifications: GitHubAggregated[], skipAnima
   }
   notificationsContainer.classList.add("ready");
   // Call this function after the issues have been rendered
-  setupKeyboardNavigation(notificationsContainer);
+  //setupKeyboardNavigation(notificationsContainer);
 
   // Scroll to the top of the page
   window.scrollTo({ top: 0 });
@@ -62,7 +62,7 @@ function everyNewNotification({ notification, notificationsContainer }: { notifi
 
   const labels = parseAndGenerateLabels(notification.issue);
   const [organizationName, repositoryName] = notification.notification.repository.url.split("/").slice(-2);
-  setUpIssueElement(issueElement, notification, organizationName, repositoryName, labels, notification.html_url);
+  setUpIssueElement(issueElement, notification, organizationName, repositoryName, labels, notification.notification.subject.url);
   issueWrapper.appendChild(issueElement);
 
   notificationsContainer.appendChild(issueWrapper);