Add bracket count

Sammers21 · Oct 24, 2023 · 4dc7299 · 4dc7299
1 parent 9f47182
commit 4dc7299
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 10 deletions.
diff --git a/frontend/src/containers/Profile/History/BracketTabs.tsx b/frontend/src/containers/Profile/History/BracketTabs.tsx
@@ -51,25 +51,35 @@ const BracketTabs = ({
 
       {arenaAndRbg.map(({ title, name }) => {
         const bracket = player?.brackets?.find(({ bracket_type }) => bracket_type === name);
-        if (!bracket?.gaming_history?.history?.length) return null;
+        if (!bracket) return null;
 
-        return <Tab key={name} label={title} value={name} />;
+        return (
+          <Tab
+            key={name}
+            label={`${title} (${bracket?.gaming_history?.history?.length ?? 0})`}
+            value={name}
+          />
+        );
       })}
       {shuffleBrackets.map(({ bracket, spec }) => {
         const specIcon = getSpecIcon(`${spec} ${player.class}` || '');
-
-        if (!bracket?.gaming_history?.history?.length) return null;
+        if (!bracket) return null;
 
         return (
           <Tab
             key={spec}
             value={spec}
             icon={
-              <img
-                className="h-7 w-7 rounded border border-solid border-[#37415180]"
-                src={specIcon}
-                alt={spec}
-              />
+              <div className="flex items-center">
+                <img
+                  className="h-7 w-7 rounded border border-solid border-[#37415180]"
+                  src={specIcon}
+                  alt={spec}
+                />
+                <span className="text-base ml-1">
+                  ({bracket?.gaming_history?.history?.length ?? 0})
+                </span>
+              </div>
             }
           />
         );

diff --git a/frontend/src/containers/Profile/History/index.tsx b/frontend/src/containers/Profile/History/index.tsx
@@ -14,7 +14,6 @@ const GamingHistory = ({ player }: { player: IPlayer }) => {
   const breakpoints = useBreakpoint();
 
   const initialBracket = !!player.brackets.find(({ bracket_type }) => bracket_type === 'ARENA_3v3')
-    ?.gaming_history?.history?.length
     ? 'ARENA_3v3'
     : 'all';