move isFriend to DB, remove todo, change order of pb hover, hide addFriendButton

frontend/src/ts/db.ts

@@ -1136,6 +1136,17 @@ function convertConnections(
   );
 }
 
+export function isFriend(uid: string | undefined): boolean {
+  if (uid === undefined || uid === getAuthenticatedUser()?.uid) return false;
+
+  const snapshot = getSnapshot();
+  if (!snapshot) return false;
+
+  return Object.entries(snapshot.connections).some(
+    ([receiverUid, status]) => receiverUid === uid && status === "accepted"
+  );
+}
+
 // export async function DB.getLocalTagPB(tagId) {
 //   function cont() {
 //     let ret = 0;

frontend/src/ts/elements/profile.ts

@@ -73,7 +73,9 @@ export async function update(
   details.find(".name").text(profile.name);
   details
     .find(".userFlags")
-    .html(getHtmlByUserFlags({ ...profile, isFriend: isFriend(profile.uid) }));
+    .html(
+      getHtmlByUserFlags({ ...profile, isFriend: DB.isFriend(profile.uid) })
+    );
 
   if (profile.lbOptOut === true) {
     if (where === "profile") {
@@ -433,14 +435,6 @@ export function updateNameFontSize(where: ProfileViewPaths): void {
   nameField.style.fontSize = `${finalFontSize}px`;
 }
 
-function isFriend(uid: string | undefined): boolean {
-  if (uid === undefined || uid === getAuthenticatedUser()?.uid) return false;
-
-  return Object.entries(DB.getSnapshot()?.connections ?? []).some(
-    ([receiverUid, status]) => receiverUid === uid && status === "accepted"
-  );
-}
-
 export function updateFriendRequestButton(): void {
   const myUid = getAuthenticatedUser()?.uid;
   const profileUid = document
@@ -452,7 +446,9 @@ export function updateFriendRequestButton(): void {
   const hasRequest = DB.getSnapshot()?.connections[profileUid] !== undefined;
   const featureEnabled = getServerConfiguration()?.connections.enabled;
 
-  if (!featureEnabled || myUid === undefined || myProfile || hasRequest) {
+  if (!featureEnabled || myUid === undefined || myProfile) {
+    button?.classList.add("hidden");
+  } else if (hasRequest) {
     button?.classList.add("disabled");
   } else {
     button?.classList.remove("disabled");

frontend/src/ts/pages/friends.ts

@@ -370,8 +370,8 @@ function formatPb(entry?: PersonalBest):
   result.details = [
     `${getLanguageDisplayString(entry.language)}`,
     `${result.wpm} wpm`,
-    `${result.raw} raw`,
     `${result.acc} acc`,
+    `${result.raw} raw`,
     `${result.con} con`,
     `${dateFormat(entry.timestamp, "dd MMM yyyy")}`,
   ].join("\n");

frontend/src/ts/pages/leaderboards.ts

@@ -434,7 +434,10 @@ function buildTableRow(entry: LeaderboardEntry, me = false): HTMLElement {
     entry.uid
   }?isUid" class="entryName" uid=${entry.uid} router-link>${entry.name}</a>
           <div class="flagsAndBadge">
-            ${getHtmlByUserFlags({ ...entry, isFriend: isFriend(entry.uid) })}
+            ${getHtmlByUserFlags({
+              ...entry,
+              isFriend: DB.isFriend(entry.uid),
+            })}
             ${
               isSafeNumber(entry.badgeId) ? getBadgeHTMLbyId(entry.badgeId) : ""
             }
@@ -489,7 +492,10 @@ function buildWeeklyTableRow(
     entry.uid
   }?isUid" class="entryName" uid=${entry.uid} router-link>${entry.name}</a>
           <div class="flagsAndBadge">
-            ${getHtmlByUserFlags({ ...entry, isFriend: isFriend(entry.uid) })}
+            ${getHtmlByUserFlags({
+              ...entry,
+              isFriend: DB.isFriend(entry.uid),
+            })}
             ${
               isSafeNumber(entry.badgeId) ? getBadgeHTMLbyId(entry.badgeId) : ""
             }
@@ -1435,14 +1441,6 @@ export const page = new PageWithUrlParams({
   },
 });
 
-function isFriend(uid: string): boolean {
-  if (uid === getAuthenticatedUser()?.uid) return false;
-
-  return Object.entries(DB.getSnapshot()?.connections ?? []).some(
-    ([receiverUid, status]) => receiverUid === uid && status === "accepted"
-  );
-}
-
 $(async () => {
   Skeleton.save("pageLeaderboards");
 });

frontend/src/ts/pages/profile.ts

@@ -76,14 +76,14 @@ function reset(): void {
         </div>
         <div class="buttonGroup">
           <button
-            class="userReportButton"
+            class="userReportButton hidden"
             data-balloon-pos="left"
             aria-label="Report user"
           >
             <i class="fas fa-flag"></i>
           </button>
           <button
-            class="addFriendButton disabled"
+            class="addFriendButton hidden"
             data-balloon-pos="left"
             aria-label="Send friend request"
           >
@@ -245,7 +245,7 @@ $(".page.pageProfile").on("click", ".profile .userReportButton", () => {
 
   void UserReportModal.show({ uid, name, lbOptOut });
 });
-//TODO disabled
+
 $(".page.pageProfile").on("click", ".profile .addFriendButton", async () => {
   const friendName = $(".page.pageProfile .profile").attr("name") ?? "";