From d778cdaa4ebe01adff8b3e91e784b783c78f2e45 Mon Sep 17 00:00:00 2001
From: Will Holcomb <dys@dhappy.org>
Date: Tue, 3 Aug 2021 18:22:12 -0400
Subject: [PATCH] MyMeta Fix: Nested Link Error (#737)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* reposition LinkOverlay link (fixes #732) 🎳

* remove now unused MetaLink reference 🍳
---
 packages/web/components/Player/PlayerTile.tsx | 89 +++++++++----------
 1 file changed, 40 insertions(+), 49 deletions(-)

diff --git a/packages/web/components/Player/PlayerTile.tsx b/packages/web/components/Player/PlayerTile.tsx
index a862a089..f3f2f1f9 100644
--- a/packages/web/components/Player/PlayerTile.tsx
+++ b/packages/web/components/Player/PlayerTile.tsx
@@ -13,7 +13,6 @@ import {
   Wrap,
   WrapItem,
 } from '@metafam/ds';
-import { MetaLink } from 'components/Link';
 import { PlayerAvatar } from 'components/Player/PlayerAvatar';
 import { PlayerContacts } from 'components/Player/PlayerContacts';
 import { PlayerTileMemberships } from 'components/Player/PlayerTileMemberships';
@@ -48,31 +47,25 @@ export const PlayerTile: React.FC<Props> = ({ player }) => {
       : description;
   return (
     <LinkBox>
-      <LinkOverlay href={`/player/${player.username}`}>
-        <MetaTile>
-          <Box
-            bgImage={`url(${getPlayerCoverImage(player)})`}
-            bgSize="cover"
-            bgPosition="center"
-            position="absolute"
-            top="0"
-            left="0"
-            w="100%"
-            h="4.5rem"
-          />
+      <MetaTile>
+        <Box
+          bgImage={`url(${getPlayerCoverImage(player)})`}
+          bgSize="cover"
+          bgPosition="center"
+          position="absolute"
+          top={0}
+          left={0}
+          w="100%"
+          h="4.5rem"
+        />
+        <LinkOverlay href={`/player/${player.username}`}>
           <MetaTileHeader>
-            <MetaLink
-              as={`/player/${player.username}`}
-              href="/player/[username]"
-              key={player.id}
-            >
-              <VStack>
-                <PlayerAvatar player={player} size="xl" />
-                <Heading size="xs" color="white">
-                  {getPlayerName(player)}
-                </Heading>
-              </VStack>
-            </MetaLink>
+            <VStack>
+              <PlayerAvatar player={player} size="xl" />
+              <Heading size="xs" color="white">
+                {getPlayerName(player)}
+              </Heading>
+            </VStack>
             <Wrap w="100%" justify="center">
               {player.playerType?.title ? (
                 <WrapItem>
@@ -93,9 +86,7 @@ export const PlayerTile: React.FC<Props> = ({ player }) => {
                 </WrapItem>
               )}
               <WrapItem>
-                <MetaTag size="md">{`XP: ${Math.floor(
-                  player.total_xp,
-                )}`}</MetaTag>
+                <MetaTag size="md">XP: {Math.floor(player.total_xp)}</MetaTag>
               </WrapItem>
             </Wrap>
             {tzDisplay?.timeZone ? (
@@ -116,29 +107,29 @@ export const PlayerTile: React.FC<Props> = ({ player }) => {
               </VStack>
             ) : null}
           </MetaTileHeader>
-          <MetaTileBody>
-            {player.Player_Skills.length ? (
-              <VStack spacing={2} align="stretch">
-                <Text textStyle="caption">SKILLS</Text>
-                <SkillsTags
-                  skills={player.Player_Skills.map((s) => s.Skill) as Skill[]}
-                />
-              </VStack>
-            ) : null}
+        </LinkOverlay>
+        <MetaTileBody>
+          {player.Player_Skills.length ? (
+            <VStack spacing={2} align="stretch">
+              <Text textStyle="caption">SKILLS</Text>
+              <SkillsTags
+                skills={player.Player_Skills.map((s) => s.Skill) as Skill[]}
+              />
+            </VStack>
+          ) : null}
 
-            <PlayerTileMemberships player={player} />
+          <PlayerTileMemberships player={player} />
 
-            {player.Accounts.length ? (
-              <VStack spacing={2} align="stretch">
-                <Text textStyle="caption">CONTACT</Text>
-                <HStack mt="2">
-                  <PlayerContacts player={player} disableBrightId />
-                </HStack>
-              </VStack>
-            ) : null}
-          </MetaTileBody>
-        </MetaTile>
-      </LinkOverlay>
+          {player.Accounts.length ? (
+            <VStack spacing={2} align="stretch">
+              <Text textStyle="caption">CONTACT</Text>
+              <HStack mt={2}>
+                <PlayerContacts player={player} disableBrightId />
+              </HStack>
+            </VStack>
+          ) : null}
+        </MetaTileBody>
+      </MetaTile>
     </LinkBox>
   );
 };