From b6e202c277d12523bb388cb43d2d8da159ab5afd Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Sat, 5 Sep 2026 07:11:40 +0300
Subject: [PATCH] Add main team quick access

---
 app/components/MobileNav.module.css           | 10 ++++++--
 app/components/MobileNav.tsx                  | 21 ++++++++++++++++
 app/components/layout/index.module.css        |  5 ++++
 app/components/layout/index.tsx               | 22 ++++++++++++++++
 .../team/loaders/t.$customUrl.join.server.ts  |  2 +-
 .../user-page/UserRepository.server.ts        | 19 ++++++++++++++
 app/root.tsx                                  |  1 +
 changelog/2026-09-04-my-team-nav-shortcut.md  |  4 +++
 e2e/navigation.spec.ts                        | 25 ++++++++++++++++++-
 e2e/pages/layout/mobile-nav.ts                |  3 +++
 e2e/pages/layout/side-nav.ts                  |  1 +
 locales/da/common.json                        |  1 +
 locales/de/common.json                        |  1 +
 locales/en/common.json                        |  1 +
 locales/es-ES/common.json                     |  1 +
 locales/es-US/common.json                     |  1 +
 locales/fr-CA/common.json                     |  1 +
 locales/fr-EU/common.json                     |  1 +
 locales/he/common.json                        |  1 +
 locales/it/common.json                        |  1 +
 locales/ja/common.json                        |  1 +
 locales/ko/common.json                        |  1 +
 locales/nl/common.json                        |  1 +
 locales/pl/common.json                        |  1 +
 locales/pt-BR/common.json                     |  1 +
 locales/ru/common.json                        |  1 +
 locales/zh/common.json                        |  1 +
 27 files changed, 125 insertions(+), 4 deletions(-)
 create mode 100644 changelog/2026-09-04-my-team-nav-shortcut.md

diff --git a/app/components/MobileNav.module.css b/app/components/MobileNav.module.css
index cb46fbc49..35c48800c 100644
--- a/app/components/MobileNav.module.css
+++ b/app/components/MobileNav.module.css
@@ -265,14 +265,15 @@
 }
 
 .youPanelUserRow {
-	display: grid;
-	grid-template-columns: 1fr auto;
+	display: flex;
 	align-items: center;
 	padding: var(--s-1) var(--s-2);
 }
 
 .youPanelUser {
 	display: flex;
+	flex: 1;
+	min-width: 0;
 	align-items: center;
 	gap: var(--s-3);
 	padding: var(--s-2);
@@ -311,6 +312,11 @@
 	}
 }
 
+.youPanelTeamAvatar {
+	border-radius: 50%;
+	object-fit: cover;
+}
+
 .panelSectionLink {
 	display: flex;
 	align-items: center;
diff --git a/app/components/MobileNav.tsx b/app/components/MobileNav.tsx
index 3f6280dfd..377a10df8 100644
--- a/app/components/MobileNav.tsx
+++ b/app/components/MobileNav.tsx
@@ -32,6 +32,7 @@ import {
 	SENDOU_INK_BASE_URL,
 	SETTINGS_PAGE,
 	SUPPORT_PAGE,
+	teamPage,
 	userPage,
 } from "~/utils/urls";
 import { Avatar } from "./Avatar";
@@ -580,6 +581,26 @@ function YouPanel({
 					<Avatar user={user} size="sm" />
 					<span className={styles.youPanelUsername}>{user.username}</span>
 				</Link>
+				{user.team ? (
+					<Link
+						to={teamPage(user.team.customUrl)}
+						className={styles.youPanelSettingsButton}
+						onClick={onClose}
+						aria-label={t("common:header.myTeam")}
+					>
+						{user.team.avatarUrl ? (
+							<img
+								src={user.team.avatarUrl}
+								alt=""
+								className={styles.youPanelTeamAvatar}
+								width={22}
+								height={22}
+							/>
+						) : (
+							<Image path={navIconUrl("t")} alt="" width={22} height={22} />
+						)}
+					</Link>
+				) : null}
 				<Link
 					to={SETTINGS_PAGE}
 					className={styles.youPanelSettingsButton}
diff --git a/app/components/layout/index.module.css b/app/components/layout/index.module.css
index ac7530413..9777ef7fe 100644
--- a/app/components/layout/index.module.css
+++ b/app/components/layout/index.module.css
@@ -395,6 +395,11 @@
 	}
 }
 
+.sideNavFooterTeamAvatar {
+	border-radius: 50%;
+	object-fit: cover;
+}
+
 .sideNavFooterNotification {
 	position: relative;
 }
diff --git a/app/components/layout/index.tsx b/app/components/layout/index.tsx
index 1903d9a46..4e18fa953 100644
--- a/app/components/layout/index.tsx
+++ b/app/components/layout/index.tsx
@@ -38,8 +38,10 @@ import type { Breadcrumb, SendouRouteHandle } from "~/utils/remix.server";
 import {
 	EVENTS_PAGE,
 	FRIENDS_PAGE,
+	navIconUrl,
 	PLANNER_URL,
 	SETTINGS_PAGE,
+	teamPage,
 	userPage,
 } from "~/utils/urls";
 import { Avatar, generateIdenticon } from "../Avatar";
@@ -663,6 +665,26 @@ function SideNavUserPanel() {
 					<span className={styles.sideNavFooterUsername}>{user.username}</span>
 				</Link>
 				<div className={styles.sideNavFooterActions}>
+					{user.team ? (
+						<Link
+							to={teamPage(user.team.customUrl)}
+							className={styles.sideNavFooterButton}
+							aria-label={t("header.myTeam")}
+							title={t("header.myTeam")}
+						>
+							{user.team.avatarUrl ? (
+								<img
+									src={user.team.avatarUrl}
+									alt=""
+									className={styles.sideNavFooterTeamAvatar}
+									width={22}
+									height={22}
+								/>
+							) : (
+								<Image path={navIconUrl("t")} alt="" width={22} height={22} />
+							)}
+						</Link>
+					) : null}
 					{notifications ? (
 						<div
 							className={styles.sideNavFooterNotification}
diff --git a/app/features/team/loaders/t.$customUrl.join.server.ts b/app/features/team/loaders/t.$customUrl.join.server.ts
index 7f1e41bba..1ca502200 100644
--- a/app/features/team/loaders/t.$customUrl.join.server.ts
+++ b/app/features/team/loaders/t.$customUrl.join.server.ts
@@ -58,7 +58,7 @@ export function validateInviteCode({
 	inviteCode: string;
 	realInviteCode: string;
 	team: TeamRepository.findByCustomUrl;
-	user?: { id: number; team?: { name: string } };
+	user?: { id: number };
 	reachedTeamCountLimit: boolean;
 }) {
 	if (inviteCode.length !== SHORT_NANOID_LENGTH) {
diff --git a/app/features/user-page/UserRepository.server.ts b/app/features/user-page/UserRepository.server.ts
index ac838afca..6754010d0 100644
--- a/app/features/user-page/UserRepository.server.ts
+++ b/app/features/user-page/UserRepository.server.ts
@@ -29,6 +29,7 @@ import {
 	concatUserSubmittedImagePrefix,
 	customAvatarUrl,
 	jsonArrayFrom,
+	jsonObjectFrom,
 	tournamentLogoOrNull,
 	userByIdentifierQuery,
 	userProfileWeapons,
@@ -438,6 +439,24 @@ export async function findLeanById(id: number) {
 				.orderBy("UserFriendCode.createdAt", "desc")
 				.limit(1)
 				.as("friendCode"),
+			jsonObjectFrom(
+				eb
+					.selectFrom("TeamMember")
+					.innerJoin("Team", "Team.id", "TeamMember.teamId")
+					.leftJoin(
+						"UserSubmittedImage",
+						"UserSubmittedImage.id",
+						"Team.avatarImgId",
+					)
+					.select(({ ref }) => [
+						"Team.name",
+						"Team.customUrl",
+						concatUserSubmittedImagePrefix(ref("UserSubmittedImage.url")).as(
+							"avatarUrl",
+						),
+					])
+					.where("TeamMember.userId", "=", id),
+			).as("team"),
 		])
 		.executeTakeFirst();
 
diff --git a/app/root.tsx b/app/root.tsx
index f9076822a..aef83d9f4 100644
--- a/app/root.tsx
+++ b/app/root.tsx
@@ -170,6 +170,7 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
 						plusTier: user.plusTier,
 						roles: user.roles,
 						createdAt: user.createdAt,
+						team: user.team,
 					}
 				: undefined,
 			customTheme: isSupporter(user) ? user?.customTheme : undefined,
diff --git a/changelog/2026-09-04-my-team-nav-shortcut.md b/changelog/2026-09-04-my-team-nav-shortcut.md
new file mode 100644
index 000000000..a4fd83a1e
--- /dev/null
+++ b/changelog/2026-09-04-my-team-nav-shortcut.md
@@ -0,0 +1,4 @@
+---
+type: feature
+---
+Quick access to your team's page: your main team's avatar is now shown next to the notification bell in the side navigation (and in the "You" panel on mobile)
diff --git a/e2e/navigation.spec.ts b/e2e/navigation.spec.ts
index 0348279ef..364fb1160 100644
--- a/e2e/navigation.spec.ts
+++ b/e2e/navigation.spec.ts
@@ -1,5 +1,5 @@
 import { NZAP_TEST_ID } from "~/db/seed/constants";
-import { SENDOUQ_PAGE } from "~/utils/urls";
+import { SENDOUQ_PAGE, teamPage } from "~/utils/urls";
 import {
 	expect,
 	impersonate,
@@ -9,6 +9,7 @@ import {
 	test,
 } from "./helpers/playwright";
 import { MobileNav } from "./pages/layout/mobile-nav";
+import { SideNav } from "./pages/layout/side-nav";
 import { TopNavMenus } from "./pages/layout/top-nav-menus";
 
 test.describe("Navigation", () => {
@@ -62,6 +63,28 @@ test.describe("Navigation", () => {
 		await expect(mobileNav.menuLink("SendouQ")).not.toBeVisible();
 	});
 
+	test("my team shortcut navigates to the team page on desktop and mobile", async ({
+		page,
+		factories,
+	}) => {
+		const team = await factories.TeamFactory.create({
+			memberUserIds: [NZAP_TEST_ID],
+		});
+
+		await impersonate(page, NZAP_TEST_ID);
+		await navigate({ page, url: "/" });
+
+		await new SideNav(page).locators.footerTeamLink.click();
+		await expect(page).toHaveURL(teamPage(team.customUrl));
+
+		await navigate({ page, url: "/" });
+		await page.setViewportSize(MOBILE_VIEWPORT);
+		const mobileNav = new MobileNav(page);
+		await mobileNav.openPanel("you");
+		await mobileNav.locators.youPanelTeamLink.click();
+		await expect(page).toHaveURL(teamPage(team.customUrl));
+	});
+
 	test("tablet navigation", async ({ page }) => {
 		await page.setViewportSize(TABLET_VIEWPORT);
 		await impersonate(page, NZAP_TEST_ID);
diff --git a/e2e/pages/layout/mobile-nav.ts b/e2e/pages/layout/mobile-nav.ts
index a0d8780fd..9cac29457 100644
--- a/e2e/pages/layout/mobile-nav.ts
+++ b/e2e/pages/layout/mobile-nav.ts
@@ -33,6 +33,9 @@ export class MobileNav {
 			youPanelSettingsLink: this.openPanelDialog.getByRole("link", {
 				name: "Settings",
 			}),
+			youPanelTeamLink: this.openPanelDialog.getByRole("link", {
+				name: "My team",
+			}),
 			friendItems: this.openPanelDialog.locator("button[class*='listButton']"),
 		};
 	}
diff --git a/e2e/pages/layout/side-nav.ts b/e2e/pages/layout/side-nav.ts
index 50e2a898b..70852b801 100644
--- a/e2e/pages/layout/side-nav.ts
+++ b/e2e/pages/layout/side-nav.ts
@@ -21,6 +21,7 @@ export class SideNav {
 				name: "Log in via Discord",
 			}),
 			footerUsername: this.root.locator("[class*='sideNavFooterUsername']"),
+			footerTeamLink: this.root.getByRole("link", { name: "My team" }),
 			collapseButton: page.getByTestId("sidenav-collapse-button"),
 			modalTrigger: page.getByTestId("sidenav-modal-trigger"),
 			siteLogoLink: this.root.locator("a[class*='siteLogo']"),
diff --git a/locales/da/common.json b/locales/da/common.json
index 170e4917e..dccfb24db 100644
--- a/locales/da/common.json
+++ b/locales/da/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/de/common.json b/locales/de/common.json
index 75aeb09cb..c29571940 100644
--- a/locales/de/common.json
+++ b/locales/de/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/en/common.json b/locales/en/common.json
index 27ec78f9f..e94209d00 100644
--- a/locales/en/common.json
+++ b/locales/en/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "Calendar event",
 	"header.adder.build": "Build",
 	"header.adder.team": "Team",
+	"header.myTeam": "My team",
 	"header.adder.scrimPost": "Scrim post",
 	"header.adder.association": "Association",
 	"header.adder.lfgPost": "LFG post",
diff --git a/locales/es-ES/common.json b/locales/es-ES/common.json
index e3be2b89e..31c3fc683 100644
--- a/locales/es-ES/common.json
+++ b/locales/es-ES/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "Evento de calendario",
 	"header.adder.build": "Build",
 	"header.adder.team": "Equipo",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "Publicación de scrim",
 	"header.adder.association": "Asociación",
 	"header.adder.lfgPost": "Publicación de LFG",
diff --git a/locales/es-US/common.json b/locales/es-US/common.json
index f529281e9..21911eef9 100644
--- a/locales/es-US/common.json
+++ b/locales/es-US/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "Evento de calendario",
 	"header.adder.build": "Build",
 	"header.adder.team": "Equipo",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "Publicación de scrim",
 	"header.adder.association": "Asociación",
 	"header.adder.lfgPost": "Publicación de LFG",
diff --git a/locales/fr-CA/common.json b/locales/fr-CA/common.json
index f725c62cf..e0227dd36 100644
--- a/locales/fr-CA/common.json
+++ b/locales/fr-CA/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/fr-EU/common.json b/locales/fr-EU/common.json
index a832c75d7..2e3058164 100644
--- a/locales/fr-EU/common.json
+++ b/locales/fr-EU/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "Calendrier d'évenement",
 	"header.adder.build": "set",
 	"header.adder.team": "Equipe",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "Poste scrim",
 	"header.adder.association": "Association",
 	"header.adder.lfgPost": "Post LFG",
diff --git a/locales/he/common.json b/locales/he/common.json
index a28d18b2f..4e9e16c49 100644
--- a/locales/he/common.json
+++ b/locales/he/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "אירוע בלוח שנה",
 	"header.adder.build": "ערכה",
 	"header.adder.team": "צוות",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/it/common.json b/locales/it/common.json
index 6125a6114..c80878306 100644
--- a/locales/it/common.json
+++ b/locales/it/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "Evento calendario",
 	"header.adder.build": "Build",
 	"header.adder.team": "Team",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "Post LFG",
diff --git a/locales/ja/common.json b/locales/ja/common.json
index 77c7c44c2..b0b8aff6a 100644
--- a/locales/ja/common.json
+++ b/locales/ja/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "イベント",
 	"header.adder.build": "ギア構成",
 	"header.adder.team": "チーム",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "対抗戦募集",
 	"header.adder.association": "コミュニティ",
 	"header.adder.lfgPost": "メンバー探し",
diff --git a/locales/ko/common.json b/locales/ko/common.json
index e7bb1c6bb..703710a5e 100644
--- a/locales/ko/common.json
+++ b/locales/ko/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/nl/common.json b/locales/nl/common.json
index 814697afb..14b547137 100644
--- a/locales/nl/common.json
+++ b/locales/nl/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/pl/common.json b/locales/pl/common.json
index b83b8be41..6f8734cd4 100644
--- a/locales/pl/common.json
+++ b/locales/pl/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/pt-BR/common.json b/locales/pt-BR/common.json
index 961ed2a25..a28b34498 100644
--- a/locales/pt-BR/common.json
+++ b/locales/pt-BR/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "",
 	"header.adder.build": "",
 	"header.adder.team": "",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "",
 	"header.adder.association": "",
 	"header.adder.lfgPost": "",
diff --git a/locales/ru/common.json b/locales/ru/common.json
index 11ae04e12..808962b79 100644
--- a/locales/ru/common.json
+++ b/locales/ru/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "Календарное событие",
 	"header.adder.build": "Сборка",
 	"header.adder.team": "Команда",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "Скрим пост",
 	"header.adder.association": "Ассоциация",
 	"header.adder.lfgPost": "LFG пост",
diff --git a/locales/zh/common.json b/locales/zh/common.json
index 293936c0d..9ba52b889 100644
--- a/locales/zh/common.json
+++ b/locales/zh/common.json
@@ -44,6 +44,7 @@
 	"header.adder.calendarEvent": "赛事日程",
 	"header.adder.build": "配装",
 	"header.adder.team": "队伍",
+	"header.myTeam": "",
 	"header.adder.scrimPost": "对抗战招募帖",
 	"header.adder.association": "群组",
 	"header.adder.lfgPost": "组队招募帖",