added youtube

frontend-react/src/components/user/AvatarWithInfo.tsx

@@ -1,6 +1,12 @@
 import { Box, Flex, Heading } from "@chakra-ui/core"
 import React, { useContext, useState } from "react"
-import { FaEdit, FaGamepad, FaTwitch, FaTwitter } from "react-icons/fa"
+import {
+  FaEdit,
+  FaGamepad,
+  FaTwitch,
+  FaTwitter,
+  FaYoutube,
+} from "react-icons/fa"
 import MyThemeContext from "../../themeContext"
 import { User } from "../../types"
 import Flag from "../common/Flag"
@@ -80,6 +86,19 @@ const AvatarWithInfo: React.FC<AvatarWithInfoProps> = ({ user, canEdit }) => {
                   </a>
                 </Flex>
               )}
+              {user.youtube_name && (
+                <Flex
+                  alignItems="center"
+                  mx="0.5em"
+                  my="0.1em"
+                  color={grayWithShade}
+                >
+                  <Box as={FaYoutube} mr="0.2em" />
+                  <a href={`https://youtube.com/c/${user.youtube_name}`}>
+                    {user.youtube_name}
+                  </a>
+                </Flex>
+              )}
               {user.sens && (!!user.sens.stick || user.sens.stick === 0) && (
                 <Flex
                   alignItems="center"

frontend-react/src/graphql/queries/searchForUser.ts

@@ -19,6 +19,7 @@ export const SEARCH_FOR_USER: DocumentNode = gql`
       discord_id
       twitch_name
       twitter_name
+      youtube_name
       country
       weapons
       top500

frontend-react/src/types.ts

@@ -109,6 +109,7 @@ export interface User {
   avatar?: string
   twitch_name?: string
   twitter_name?: string
+  youtube_name?: string
   country?: CountryCode
   weapons?: Weapon[]
   top500: boolean