diff --git a/frontend/src/ts/elements/account-button.ts b/frontend/src/ts/elements/account-button.ts index 71b9ccdf7..47ec40e53 100644 --- a/frontend/src/ts/elements/account-button.ts +++ b/frontend/src/ts/elements/account-button.ts @@ -76,10 +76,10 @@ export function update(): void { ); } - updateFriendRequests(); + updateFriendRequestsIndicator(); } -export function updateFriendRequests(): void { +export function updateFriendRequestsIndicator(): void { const friends = getSnapshot()?.friends; if (friends !== undefined) { 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 d64eca550..20bad30ed 100644 --- a/frontend/src/ts/elements/account-settings/blocked-user-table.ts +++ b/frontend/src/ts/elements/account-settings/blocked-user-table.ts @@ -5,6 +5,7 @@ import { format } from "date-fns/format"; import { isAuthenticated } from "../../firebase"; import { getFriendUid } from "../../pages/friends"; import * as DB from "../../db"; +import { updateFriendRequestsIndicator } from "../account-button"; let blockedUsers: FriendRequest[] = []; const element = $("#pageAccountSettings .tab[data-tab='blockedUsers']"); @@ -99,6 +100,7 @@ element.on("click", "table button.delete", async (e) => { // eslint-disable-next-line @typescript-eslint/no-dynamic-delete, @typescript-eslint/no-unsafe-member-access delete snapshot.friends[uid]; + updateFriendRequestsIndicator(); } } }); diff --git a/frontend/src/ts/elements/profile.ts b/frontend/src/ts/elements/profile.ts index 253aff9b6..6beffa74c 100644 --- a/frontend/src/ts/elements/profile.ts +++ b/frontend/src/ts/elements/profile.ts @@ -19,6 +19,7 @@ import { Snapshot } from "../constants/default-snapshot"; import { getAvatarElement } from "../utils/discord-avatar"; import { formatXp } from "../utils/levels"; import { formatTopPercentage } from "../utils/misc"; +import { get as getServerConfiguration } from "../ape/server-configuration"; type ProfileViewPaths = "profile" | "account"; type UserProfileOrSnapshot = UserProfile | Snapshot; @@ -313,21 +314,9 @@ export async function update( if (profile.uid === getAuthenticatedUser()?.uid) { profileElement.find(".userReportButton").addClass("hidden"); - profileElement.find(".addFriendButton").addClass("hidden"); } else { profileElement.find(".userReportButton").removeClass("hidden"); } - if ( - profile.uid !== undefined && - (profile.uid === getAuthenticatedUser()?.uid || - DB.getSnapshot()?.friends[profile.uid] !== undefined) - ) { - profileElement.find(".addFriendButton").addClass("hidden"); - } else { - profileElement.find(".addFriendButton").removeClass("hidden"); - } - - //structure const bioAndKey = bio || keyboard; @@ -372,6 +361,8 @@ export async function update( } else if (socials && bioAndKey) { details.addClass("both"); } + + updateFriendRequestButton(); } export function updateXp( @@ -440,6 +431,26 @@ export function updateNameFontSize(where: ProfileViewPaths): void { nameField.style.fontSize = `${finalFontSize}px`; } +export function updateFriendRequestButton(): void { + const myUid = getAuthenticatedUser()?.uid; + const profileUid = document + .querySelector(".profile") + ?.getAttribute("uid") as string; + const button = document.querySelector(".profile .addFriendButton"); + if (button === null) { + throw new Error("button?"); + } + + const myProfile = myUid === profileUid; + const hasRequest = DB.getSnapshot()?.friends[profileUid] !== undefined; + const featureEnabled = getServerConfiguration()?.friends.enabled; + + if (!featureEnabled || myUid === undefined || myProfile || hasRequest) { + button?.classList.add("hidden"); + } else { + button?.classList.remove("hidden"); + } +} const throttledEvent = throttle(1000, () => { const activePage = ActivePage.get(); if (activePage && ["account", "profile"].includes(activePage)) { diff --git a/frontend/src/ts/pages/friends.ts b/frontend/src/ts/pages/friends.ts index 144b386ba..7a8a55179 100644 --- a/frontend/src/ts/pages/friends.ts +++ b/frontend/src/ts/pages/friends.ts @@ -53,6 +53,7 @@ export async function addFriend(friendName: string): Promise { const friendUid = getFriendUid(result.body.data); // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access snapshot.friends[friendUid] = result.body.data.status; + updatePendingRequests(); } return true; } @@ -120,7 +121,7 @@ async function fetchPendingRequests(): Promise { } } -async function updatePendingRequests(): Promise { +function updatePendingRequests(): void { $(".pageFriends .pendingRequests").addClass("hidden"); if (pendingRequests === undefined || pendingRequests.length === 0) { @@ -393,6 +394,7 @@ $(".pageFriends .pendingRequests table").on("click", async (e) => { // eslint-disable-next-line @typescript-eslint/no-dynamic-delete, @typescript-eslint/no-unsafe-member-access delete snapshot.friends[friendUid]; + updatePendingRequests(); } if (count === 1) { $(".pageFriends .pendingRequests").addClass("hidden"); @@ -455,7 +457,7 @@ export const page = new Page({ beforeShow: async (): Promise => { Skeleton.append("pageFriends", "main"); - void updatePendingRequests(); + updatePendingRequests(); void updateFriends(); }, }); diff --git a/frontend/src/ts/pages/profile.ts b/frontend/src/ts/pages/profile.ts index deff44d69..508d3af2c 100644 --- a/frontend/src/ts/pages/profile.ts +++ b/frontend/src/ts/pages/profile.ts @@ -13,7 +13,6 @@ import { TestActivityCalendar } from "../elements/test-activity-calendar"; import { getFirstDayOfTheWeek } from "../utils/date-and-time"; import { addFriend } from "./friends"; import * as AuthEvent from "../observables/auth-event"; -import { get as getServerConfiguration } from "../ape/server-configuration"; const firstDayOfTheWeek = getFirstDayOfTheWeek(); @@ -84,7 +83,7 @@ function reset(): void {