Show github user tag also in the deployment details page

Author: myftija

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx

@@ -32,6 +32,7 @@ import { requireUserId } from "~/services/session.server";
 import { cn } from "~/utils/cn";
 import { v3DeploymentParams, v3DeploymentsPath, v3RunsPath } from "~/utils/pathBuilder";
 import { capitalizeWord } from "~/utils/string";
+import { UserTag } from "../_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments/route";
 
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const userId = await requireUserId(request);
@@ -232,17 +233,16 @@ export default function Page() {
               <Property.Item>
                 <Property.Label>Deployed by</Property.Label>
                 <Property.Value>
-                  {deployment.deployedBy ? (
-                    <div className="flex items-center gap-1">
-                      <UserAvatar
-                        avatarUrl={deployment.deployedBy.avatarUrl}
-                        name={deployment.deployedBy.name ?? deployment.deployedBy.displayName}
-                        className="h-4 w-4"
-                      />
-                      <Paragraph variant="small">
-                        {deployment.deployedBy.name ?? deployment.deployedBy.displayName}
-                      </Paragraph>
-                    </div>
+                  {deployment.git?.source === "trigger_github_app" ? (
+                    <UserTag
+                      name={deployment.git.ghUsername ?? "GitHub Integration"}
+                      avatarUrl={deployment.git.ghUserAvatarUrl}
+                    />
+                  ) : deployment.deployedBy ? (
+                    <UserTag
+                      name={deployment.deployedBy.name ?? deployment.deployedBy.displayName ?? ""}
+                      avatarUrl={deployment.deployedBy.avatarUrl ?? undefined}
+                    />
                   ) : (
                     "–"
                   )}

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments/route.tsx

@@ -358,7 +358,7 @@ export default function Page() {
   );
 }
 
-function UserTag({ name, avatarUrl }: { name: string; avatarUrl?: string }) {
+export function UserTag({ name, avatarUrl }: { name: string; avatarUrl?: string }) {
   return (
     <div className="flex items-center gap-1">
       <UserAvatar avatarUrl={avatarUrl} name={name} className="h-4 w-4" />