diff --git a/frontend/src/ts/db.ts b/frontend/src/ts/db.ts
index f353f9774..2f81b8a7a 100644
--- a/frontend/src/ts/db.ts
+++ b/frontend/src/ts/db.ts
@@ -35,6 +35,7 @@ import {
   configurationPromise,
   get as getServerConfiguration,
 } from "./ape/server-configuration";
+import { Connection } from "@monkeytype/schemas/connections";
 
 let dbSnapshot: Snapshot | undefined;
 const firstDayOfTheWeek = getFirstDayOfTheWeek();
@@ -268,19 +269,7 @@ export async function initSnapshot(): Promise<Snapshot | false> {
       );
     }
 
-    snap.connections = Object.fromEntries(
-      connectionsData.map((connection) => {
-        const isMyRequest =
-          getAuthenticatedUser()?.uid === connection.initiatorUid;
-
-        return [
-          isMyRequest ? connection.friendUid : connection.initiatorUid,
-          connection.status === "pending" && !isMyRequest
-            ? "incoming"
-            : connection.status,
-        ];
-      })
-    );
+    snap.connections = convertConnections(connectionsData);
 
     dbSnapshot = snap;
     return dbSnapshot;
@@ -1116,6 +1105,32 @@ export async function getTestActivityCalendar(
   return dbSnapshot.testActivityByYear[yearString];
 }
 
+export function updateConnections(connections: Connection[]): void {
+  const snapshot = getSnapshot();
+  if (!snapshot) return;
+
+  snapshot.connections = convertConnections(connections);
+  setSnapshot(snapshot);
+}
+
+function convertConnections(
+  connectionsData: Connection[]
+): Snapshot["connections"] {
+  return Object.fromEntries(
+    connectionsData.map((connection) => {
+      const isMyRequest =
+        getAuthenticatedUser()?.uid === connection.initiatorUid;
+
+      return [
+        isMyRequest ? connection.friendUid : connection.initiatorUid,
+        connection.status === "pending" && !isMyRequest
+          ? "incoming"
+          : connection.status,
+      ];
+    })
+  );
+}
+
 // export async function DB.getLocalTagPB(tagId) {
 //   function cont() {
 //     let ret = 0;
diff --git a/frontend/src/ts/elements/account-button.ts b/frontend/src/ts/elements/account-button.ts
index d1e63d057..c3cd2bbf7 100644
--- a/frontend/src/ts/elements/account-button.ts
+++ b/frontend/src/ts/elements/account-button.ts
@@ -96,7 +96,7 @@ export function updateFriendRequestsIndicator(): void {
   }
 
   $("nav .view-account > .notificationBubble").addClass("hidden");
-  $("nav goToFriends > .notificationBubble").addClass("hidden");
+  $("nav .goToFriends > .notificationBubble").addClass("hidden");
 }
 
 const coarse = window.matchMedia("(pointer:coarse)")?.matches;
diff --git a/frontend/src/ts/elements/account-settings/blocked-user-table.ts b/frontend/src/ts/elements/account-settings/blocked-user-table.ts
index 20743cc49..fda64aa8f 100644
--- a/frontend/src/ts/elements/account-settings/blocked-user-table.ts
+++ b/frontend/src/ts/elements/account-settings/blocked-user-table.ts
@@ -76,13 +76,15 @@ function refreshList(): void {
 }
 
 element.on("click", "table button.delete", async (e) => {
-  const id = (e.target as HTMLElement).parentElement?.parentElement?.dataset[
-    "id"
-  ];
+  const row = (e.target as HTMLElement).closest("tr") as HTMLElement;
+  const id = row.dataset["id"];
+
   if (id === undefined) {
     throw new Error("Cannot find id of target.");
   }
 
+  row.querySelectorAll("button").forEach((button) => (button.disabled = true));
+
   const response = await Ape.connections.delete({ params: { id } });
   if (response.status !== 200) {
     Notifications.add(`Cannot unblock user: ${response.body.message}`, -1);
@@ -92,8 +94,7 @@ element.on("click", "table button.delete", async (e) => {
 
     const snapshot = DB.getSnapshot();
     if (snapshot) {
-      const uid = (e.target as HTMLElement).parentElement?.parentElement
-        ?.dataset["uid"];
+      const uid = row.dataset["uid"];
       if (uid === undefined) {
         throw new Error("Cannot find uid of target.");
       }
diff --git a/frontend/src/ts/pages/friends.ts b/frontend/src/ts/pages/friends.ts
index 365255b75..deb24ec75 100644
--- a/frontend/src/ts/pages/friends.ts
+++ b/frontend/src/ts/pages/friends.ts
@@ -138,6 +138,7 @@ async function fetchPendingConnections(): Promise<void> {
     pendingRequests = undefined;
   } else {
     pendingRequests = result.body.data;
+    DB.updateConnections(pendingRequests);
   }
 }
 
@@ -380,10 +381,12 @@ $(".pageFriends .pendingRequests table").on("click", async (e) => {
 
   if (action === undefined) return;
 
-  const id = e.target.parentElement?.parentElement?.dataset["id"];
+  const row = e.target.closest("tr") as HTMLElement;
+  const id = row.dataset["id"];
   if (id === undefined) {
     throw new Error("Cannot find id of target.");
   }
+  row.querySelectorAll("button").forEach((button) => (button.disabled = true));
 
   const result =
     action === "rejected"
@@ -407,8 +410,7 @@ $(".pageFriends .pendingRequests table").on("click", async (e) => {
 
     const snapshot = DB.getSnapshot();
     if (snapshot) {
-      const friendUid =
-        e.target.parentElement?.parentElement?.dataset["friendUid"];
+      const friendUid = row.dataset["friendUid"];
       if (friendUid === undefined) {
         throw new Error("Cannot find friendUid of target.");
       }
@@ -435,16 +437,14 @@ $(".pageFriends .friends table").on("click", async (e) => {
 
   if (action === undefined) return;
 
-  if (action === "remove") {
-    const connectionId =
-      e.target.parentElement?.parentElement?.dataset["connectionId"];
-    if (connectionId === undefined) {
-      throw new Error("Cannot find id of target.");
-    }
+  const row = e.target.closest("tr") as HTMLElement;
+  const connectionId = row.dataset["connectionId"];
+  if (connectionId === undefined) {
+    throw new Error("Cannot find id of target.");
+  }
 
-    const name =
-      e.target.parentElement?.parentElement?.querySelector("a.entryName")
-        ?.textContent ?? "";
+  if (action === "remove") {
+    const name = row.querySelector("a.entryName")?.textContent ?? "";
 
     removeFriendModal.show([connectionId, name], {});
   }