From 11bc4cb22aa514e67d6bb3b90a1959319d0a0b1e Mon Sep 17 00:00:00 2001
From: Augustin Hiebel <augustin.hiebel@gmail.com>
Date: Wed, 6 Dec 2023 09:24:19 +0100
Subject: [PATCH] Prototype: profile updates

---
 mock-data/data-games.js                       | 20 ++++++++++++++++
 mock-data/data-users.js                       |  2 +-
 .../components/FeedItemMatchTabSummary.js     |  8 +++----
 pages/stryda/profile/[user_id]/tab-feed.js    | 10 ++++----
 .../profile/[user_id]/tab-highlights.js       |  4 ++--
 pages/stryda/profile/[user_id]/tab-stats.js   | 24 ++++++++++---------
 6 files changed, 45 insertions(+), 23 deletions(-)

diff --git a/mock-data/data-games.js b/mock-data/data-games.js
index bdfa4a02..ccc10ca7 100644
--- a/mock-data/data-games.js
+++ b/mock-data/data-games.js
@@ -6924,6 +6924,26 @@ export const dataGames = [
         },
       },
     ],
+    demo: {
+      mainStats: [
+        {
+          label: "Win ratio %",
+          value: "57.2",
+        },
+        {
+          label: "KDA",
+          value: "7.3 / 6.4 / 8.2",
+        },
+        {
+          label: "CS/min",
+          value: "104",
+        },
+        {
+          label: "Vision score",
+          value: "71%",
+        },
+      ],
+    },
   },
   {
     id: 3,
diff --git a/mock-data/data-users.js b/mock-data/data-users.js
index 9d726633..b8bfd163 100644
--- a/mock-data/data-users.js
+++ b/mock-data/data-users.js
@@ -65,7 +65,7 @@ export const dataUsers = [
       powertokens: 105,
       tickets: 3,
     },
-    games: [1, 6, 4],
+    games: [1, 6, 4, 2],
     ladders: [
       {
         gameSlug: "valorant",
diff --git a/pages/stryda/components/FeedItemMatchTabSummary.js b/pages/stryda/components/FeedItemMatchTabSummary.js
index bc7a6c6c..af43eefd 100644
--- a/pages/stryda/components/FeedItemMatchTabSummary.js
+++ b/pages/stryda/components/FeedItemMatchTabSummary.js
@@ -61,7 +61,7 @@ export default function FeedItemMatchTabSummary(props) {
             onClick={() => !detailedView && openFeedItemDetailsMatch("summary")}
           >
             <div
-              className={`relative z-40
+              className={`relative z-20
                 ${match.stats.result === "victory" && "text-success-300"}
                 ${match.stats.result === "defeat" && "text-error-300"}
                 ${match.stats.result === "draw" && "text-ui-200"}
@@ -76,7 +76,7 @@ export default function FeedItemMatchTabSummary(props) {
                 {match.stats.score.team1} - {match.stats.score.team2}
               </div>
             </div>
-            <div className="relative z-40 text-base sm:text-xl md:text-2xl uppercase text-ui-100">
+            <div className="relative z-20 text-base sm:text-xl md:text-2xl uppercase text-ui-100">
               <div className="flex gap-1.5 items-center">
                 <img
                   src={getGamemodeImage(match.meta.mode)}
@@ -87,7 +87,7 @@ export default function FeedItemMatchTabSummary(props) {
               </div>
               <div>{getMapByID(match.meta.map).name}</div>
             </div>
-            <ul className="relative z-40 text-xl uppercase flex items-center justify-end text-left space-x-4 sm:space-x-6 md:space-x-8">
+            <ul className="relative z-20 text-xl uppercase flex items-center justify-end text-left space-x-4 sm:space-x-6 md:space-x-8">
               {match.stats.mainStats
                 .slice(0, 3)
                 .map((mainStat, mainStatIndex) => (
@@ -105,7 +105,7 @@ export default function FeedItemMatchTabSummary(props) {
               <Link href={`/stryda/valorant/stats${prototype.getURLparams()}`}>
                 <button
                   type="button"
-                  className="relative z-40 button button-primary"
+                  className="relative z-20 button button-primary"
                   onClick={uiContext.closeModal()}
                 >
                   <span>View match stats</span>
diff --git a/pages/stryda/profile/[user_id]/tab-feed.js b/pages/stryda/profile/[user_id]/tab-feed.js
index 6d990f76..803c9295 100644
--- a/pages/stryda/profile/[user_id]/tab-feed.js
+++ b/pages/stryda/profile/[user_id]/tab-feed.js
@@ -42,14 +42,14 @@ export default function TabProfileFeed() {
               {prototype.getUserFeedItems(selectedUser.id).length === 0 ||
               isEmpty ? (
                 <>
-                  <div className="p-4 text-center">
+                  <div className="px-4 py-24 text-center">
                     <div className="max-w-xs mx-auto">
                       <span className="icon icon-sword text-6xl text-ui-500" />
                       {selectedUser.isYou ? (
                         <>
                           <div className="mt-2 mb-6">
                             <p className="text-sm text-ui-400">
-                              You have no recorded matches
+                              You have no recorded matches.
                             </p>
                             <p className="text-lg text-ui-300">
                               Make sure Stryda is up and running when you play
@@ -67,7 +67,7 @@ export default function TabProfileFeed() {
                         <div className="mt-2 mb-6">
                           <p className="text-lg text-ui-300">
                             {selectedUser.nickname} hasn&#39;t played any
-                            matches
+                            matches.
                           </p>
                         </div>
                       )}
@@ -98,7 +98,7 @@ export default function TabProfileFeed() {
                     </h2>
                   </Link>
                 </div>
-                {selectedUser.ladders.length === 0 || isEmpty ? (
+                {!selectedUser.ladders || selectedUser.ladders?.length === 0 || isEmpty ? (
                   <>
                     {selectedUser.isYou ? (
                       <div className="bg-ui-850 p-4">
@@ -140,7 +140,7 @@ export default function TabProfileFeed() {
                       <div className="text-center p-4">
                         <span className="icon icon-ladder text-6xl text-ui-500" />
                         <p className="mt-2 text-ui-300">
-                          {selectedClan.nickname} has not entered any Ladders
+                          {selectedUser.nickname} has not entered any Ladders.
                         </p>
                       </div>
                     )}
diff --git a/pages/stryda/profile/[user_id]/tab-highlights.js b/pages/stryda/profile/[user_id]/tab-highlights.js
index 59ff882a..5f736350 100644
--- a/pages/stryda/profile/[user_id]/tab-highlights.js
+++ b/pages/stryda/profile/[user_id]/tab-highlights.js
@@ -62,10 +62,10 @@ export default function TabProfileHighlights() {
                     <div className="mt-2">
                       <p className="text-ui-300">
                         {selectedUser.isYou ? (
-                          <>You haven&#39;t created any Recaps yet</>
+                          <>You haven&#39;t created any Recaps yet.</>
                         ) : (
                           <>
-                            {selectedUser.nickname} hasn&#39;t created any Recaps yet
+                            {selectedUser.nickname} hasn&#39;t created any Recaps yet.
                             yet
                           </>
                         )}
diff --git a/pages/stryda/profile/[user_id]/tab-stats.js b/pages/stryda/profile/[user_id]/tab-stats.js
index 7cefee2d..ebe31936 100644
--- a/pages/stryda/profile/[user_id]/tab-stats.js
+++ b/pages/stryda/profile/[user_id]/tab-stats.js
@@ -106,18 +106,20 @@ export default function TabProfileStats() {
                 <div className="relative z-10 flex items-center gap-2 mb-2">
                   <GameIcon game={item} />
                   <h6 className="flex-1">{prototype.getGameByID(item).name}</h6>
-                  <Link
-                    href={`/stryda/${
-                      prototype.getGameByID(item).slug
-                    }/stats${prototype.getURLparams()}`}
-                  >
-                    <button
-                      type="button"
-                      className="button button-sm button-secondary"
+                  {item !== 2 && (
+                    <Link
+                      href={`/stryda/${
+                        prototype.getGameByID(item).slug
+                      }/stats${prototype.getURLparams()}`}
                     >
-                      <span>See all stats & Matches</span>
-                    </button>
-                  </Link>
+                      <button
+                        type="button"
+                        className="button button-sm button-secondary"
+                      >
+                        <span>See all stats & Matches</span>
+                      </button>
+                    </Link>
+                  )}
                 </div>
                 <ul className="relative z-10 p-4 flex flex-wrap justify-evenly items-center bg-gradient-to-b from-ui-900/40 to-ui-900/20 text-center gap-4 rounded">
                   {prototype