Add plus tier to user profile

app/features/user-page/UserRepository.server.ts

@@ -32,6 +32,7 @@ export function identifierToUserId(identifier: string) {
 
 export function findByIdentifier(identifier: string) {
   return identifierToUserIdQuery(identifier)
+    .leftJoin("PlusTier", "PlusTier.userId", "User.id")
     .select(({ eb }) => [
       "User.discordAvatar",
       "User.discordDiscriminator",
@@ -55,6 +56,7 @@ export function findByIdentifier(identifier: string) {
       "User.commissionText",
       "User.commissionsOpen",
       "User.patronTier",
+      "PlusTier.tier as plusTier",
       jsonArrayFrom(
         eb
           .selectFrom("UserWeapon")

app/features/user-page/routes/u.$identifier.index.tsx

@@ -17,6 +17,7 @@ import type { Unpacked } from "~/utils/types";
 import { assertUnreachable } from "~/utils/types";
 import {
   modeImageUrl,
+  navIconUrl,
   teamPage,
   topSearchPlayerPage,
   userSubmittedImage,
@@ -193,6 +194,12 @@ function ExtraInfos() {
           {motionSensText}
         </div>
       )}
+      {data.plusTier && (
+        <div className="u__extra-info">
+          <Image path={navIconUrl("plus")} width={20} height={20} alt="" />{" "}
+          {data.plusTier}
+        </div>
+      )}
     </div>
   );
 }

app/styles/u.css

@@ -100,7 +100,7 @@
 }
 
 .u__extra-info {
-  padding: var(--s-1) var(--s-1);
+  padding: var(--s-1) var(--s-1-5);
   border-radius: var(--rounded);
   background-color: var(--bg-darker);
   font-size: var(--fonts-xxs);