feat: render empty inbox

src/home/fetch-github/fetch-and-display-previews.ts

@@ -1,6 +1,5 @@
-import { GitHubNotifications } from "../github-types";
-import { pullRequestNotifications } from "../home";
-import { applyAvatarsToIssues, renderNotifications } from "../rendering/render-github-issues";
+import { GitHubAggregated, GitHubNotifications } from "../github-types";
+import { applyAvatarsToIssues, renderEmpty, renderNotifications } from "../rendering/render-github-issues";
 import { renderOrgHeaderLabel } from "../rendering/render-org-header";
 import { closeModal } from "../rendering/render-preview-modal";
 import { filterIssuesBySearch } from "../sorting/filter-issues-by-search";
@@ -72,7 +71,8 @@ function filterIssuesByOrganization(issues: GitHubNotifications): GitHubNotifica
 }
 
 // checks the cache's integrity, sorts issues, checks Directory/Proposals toggle, renders them and applies avatars
-export async function displayNotifications({
+export async function displayNotifications(
+  notifications: GitHubAggregated[] | null, {
   sorting,
   options = { ordering: "normal" },
   skipAnimation = false,
@@ -84,8 +84,12 @@ export async function displayNotifications({
   //const sortedIssues = sortIssuesController(cachedTasks, sorting, options);
   //let sortedAndFiltered = sortedIssues.filter(getProposalsOnlyFilter(isProposalOnlyViewer));
   //sortedAndFiltered = filterIssuesByOrganization(sortedAndFiltered);
-  renderNotifications(pullRequestNotifications, skipAnimation);
-  applyAvatarsToIssues();
+  if(notifications === null || notifications.length === 0){
+    renderEmpty();
+    return;
+  }
+  renderNotifications(notifications, skipAnimation);
+  //applyAvatarsToIssues();
 }
 
 export async function searchDisplayGitHubIssues({ searchText, skipAnimation = false }: { searchText: string; skipAnimation?: boolean }) {

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

@@ -4,6 +4,8 @@ import { getGitHubAccessToken } from "../getters/get-github-access-token";
 import { handleRateLimit } from "./handle-rate-limit";
 import { RequestError } from "@octokit/request-error";
 
+export const organizationImageCache = new Map<string, Blob | null>(); // this should be declared in image related script
+
 // Generalized function to fetch notifications from GitHub
 async function fetchNotifications(): Promise<GitHubNotifications | null> {
   const providerToken = await getGitHubAccessToken();

src/home/home.ts

@@ -28,12 +28,11 @@ if (!notificationsContainer) {
   throw new Error("Could not find issues container");
 }
 
-export const notifications = void fetchAllNotifications();
-
 void (async function home() {
   void authentication();
   void readyToolbar();
-  //  void displayNotifications();
+  const notifications = await fetchAllNotifications();
+  void displayNotifications(notifications);
 
   // Register service worker for PWA
   // if ("serviceWorker" in navigator) {

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

@@ -1,13 +1,13 @@
 import { marked } from "marked";
 import { organizationImageCache } from "../fetch-github/fetch-data";
-import { GitHubNotification, GitHubNotifications } from "../github-types";
+import { GitHubAggregated, GitHubNotification, GitHubNotifications } from "../github-types";
 import { renderErrorInModal } from "./display-popup-modal";
 import { closeModal, modal, modalBodyInner, bottomBar, titleAnchor, titleHeader, bottomBarClearLabels } from "./render-preview-modal";
 import { setupKeyboardNavigation } from "./setup-keyboard-navigation";
 import { waitForElement } from "./utils";
 import { notificationsContainer } from "../home";
 
-export function renderNotifications(tasks: GitHubNotifications, skipAnimation: boolean) {
+export function renderNotifications(tasks: GitHubAggregated[] | null, skipAnimation: boolean) {
   if (notificationsContainer.classList.contains("ready")) {
     notificationsContainer.classList.remove("ready");
     notificationsContainer.innerHTML = "";
@@ -39,6 +39,20 @@ export function renderNotifications(tasks: GitHubNotifications, skipAnimation: b
   // Scroll to the top of the page
   window.scrollTo({ top: 0 });
 }
+export function renderEmpty(){
+  const issueWrapper = document.createElement("div");
+  issueWrapper.style.marginTop = "20px";
+  const issueElement = document.createElement("div");
+  issueElement.innerHTML = `
+    <div class="info"><div class="title"><h3>No notifications found</h3></div></div>
+  `;
+  issueElement.classList.add("issue-element-inner");
+  issueWrapper.appendChild(issueElement);
+  notificationsContainer.appendChild(issueWrapper);
+
+  issueWrapper.classList.add("active");
+  notificationsContainer.classList.add("ready");
+}
 
 function everyNewNotification({ notification, notificationsContainer }: { notification: GitHubNotification; notificationsContainer: HTMLDivElement }) {
   const issueWrapper = document.createElement("div");