From 1bd87c7fb1d591c05657c6232c3c8f9b38aa5117 Mon Sep 17 00:00:00 2001
From: Chris Parsons <438676+chrisparsons83@users.noreply.github.com>
Date: Wed, 6 May 2026 16:00:15 -0700
Subject: [PATCH] Show owner avatar in team settings preview (#386)

---
 app/routes/teams/$teamId.settings.tsx | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/app/routes/teams/$teamId.settings.tsx b/app/routes/teams/$teamId.settings.tsx
index 8f37fef..f2e3e5f 100644
--- a/app/routes/teams/$teamId.settings.tsx
+++ b/app/routes/teams/$teamId.settings.tsx
@@ -11,6 +11,7 @@ import { findSeasonById } from "~/models/season";
 import { findUserById } from "~/models/user";
 import { resolveUserAvatarData } from "~/lib/avatar-data";
 import { Button } from "~/components/ui/button";
+import { TeamAvatar } from "~/components/TeamAvatar";
 import {
   Card,
   CardContent,
@@ -204,10 +205,23 @@ export default function TeamSettings({ loaderData, actionData }: Route.Component
 
           <Card>
             <CardHeader>
-              <CardTitle>Team Avatar</CardTitle>
-              <CardDescription>
-                Update the flag or submit a photo for review
-              </CardDescription>
+              <div className="flex items-center gap-3">
+                <TeamAvatar
+                  teamId={team.id}
+                  teamName={team.name}
+                  logoUrl={team.logoUrl}
+                  flagConfig={team.flagConfig}
+                  avatarType={team.avatarType}
+                  ownerAvatarData={loaderData.ownerAvatarData}
+                  size="lg"
+                />
+                <div>
+                  <CardTitle>Team Avatar</CardTitle>
+                  <CardDescription>
+                    Update the flag or submit a photo for review
+                  </CardDescription>
+                </div>
+              </div>
             </CardHeader>
             <CardContent>
               <AvatarEditor