diff --git a/frontend-react/src/assets/cb.png b/frontend-react/src/assets/cb.png new file mode 100644 index 000000000..c51f3d65a Binary files /dev/null and b/frontend-react/src/assets/cb.png differ diff --git a/frontend-react/src/assets/rm.png b/frontend-react/src/assets/rm.png new file mode 100644 index 000000000..8035a41f4 Binary files /dev/null and b/frontend-react/src/assets/rm.png differ diff --git a/frontend-react/src/assets/sz.png b/frontend-react/src/assets/sz.png new file mode 100644 index 000000000..76a9bb741 Binary files /dev/null and b/frontend-react/src/assets/sz.png differ diff --git a/frontend-react/src/assets/tc.png b/frontend-react/src/assets/tc.png new file mode 100644 index 000000000..fb412ac28 Binary files /dev/null and b/frontend-react/src/assets/tc.png differ diff --git a/frontend-react/src/components/Mark b/frontend-react/src/components/Mark new file mode 100644 index 000000000..e69de29bb diff --git a/frontend-react/src/components/elements/Emoji.tsx b/frontend-react/src/components/elements/Emoji.tsx index 428cbb76a..b065c23cd 100644 --- a/frontend-react/src/components/elements/Emoji.tsx +++ b/frontend-react/src/components/elements/Emoji.tsx @@ -3,6 +3,18 @@ import WeaponImage from "../common/WeaponImage" import { weaponCodes, abilityCodes, gearCodes } from "../../utils/lists" import AbilityIcon from "../builds/AbilityIcon" import GearImage from "../builds/GearImage" +import sz from "../../assets/sz.png" +import tc from "../../assets/tc.png" +import rm from "../../assets/rm.png" +import cb from "../../assets/cb.png" +import { Image } from "@chakra-ui/core" + +const modeCodes: Record = { + sz, + tc, + rm, + cb, +} as const interface EmojiProps { value: string @@ -21,6 +33,10 @@ const Emoji: React.FC = (props) => { const gearName = gearCodes[value] if (!!gearName) return + const mode = modeCodes[value] + if (!!mode) + return + return <>{props.value} } diff --git a/frontend-react/src/components/root/Logo.tsx b/frontend-react/src/components/root/Logo.tsx index 7982e559b..1e9b8ec92 100644 --- a/frontend-react/src/components/root/Logo.tsx +++ b/frontend-react/src/components/root/Logo.tsx @@ -14,7 +14,7 @@ const Logo: React.FC = ({ mobile = false }) => { as="span" display="inline-block" transform="translateY(-7px)" - fontSize="30px" + fontSize={mobile ? "25px" : "30px"} fontFamily="'Pacifico', cursive" transition="1.1s" > @@ -25,7 +25,7 @@ const Logo: React.FC = ({ mobile = false }) => { as="span" display="inline-block" transform="translateY(7px)" - fontSize="30px" + fontSize={mobile ? "25px" : "30px"} fontFamily="'Pacifico', cursive" transition="1.1s" > diff --git a/frontend-react/src/components/user/MarkdownInput.tsx b/frontend-react/src/components/user/MarkdownInput.tsx index f4231e95d..f5ada2eab 100644 --- a/frontend-react/src/components/user/MarkdownInput.tsx +++ b/frontend-react/src/components/user/MarkdownInput.tsx @@ -9,12 +9,14 @@ interface MarkdownInputProps { value: string setValue: (value: string) => void label: string + limit?: number } const MarkdownInput: React.FC = ({ value, setValue, label, + limit, }) => { const [preview, setPreview] = useState(false) return ( @@ -30,6 +32,7 @@ const MarkdownInput: React.FC = ({ setValue={setValue} label={label} height="150px" + limit={limit} /> )} diff --git a/frontend-react/src/components/user/ProfileModal.tsx b/frontend-react/src/components/user/ProfileModal.tsx index da7696638..70fa41692 100644 --- a/frontend-react/src/components/user/ProfileModal.tsx +++ b/frontend-react/src/components/user/ProfileModal.tsx @@ -16,7 +16,6 @@ import { useContext } from "react" import MyThemeContext from "../../themeContext" import { useEffect } from "react" import MarkdownInput from "./MarkdownInput" -import SubHeader from "../common/SubHeader" interface ProfileModalProps { closeModal: () => void @@ -51,7 +50,7 @@ const ProfileModal: React.FC = ({ } else if (profile.custom_url && profile.custom_url.length < 2) { setError("Custom URL has to be over 2 characters long") } else if (profile.custom_url && profile.custom_url.length > 32) { - setError("Custom URL has to be under 32 characters long") + setError("Custom URL can be at most 32 characters long") } else if (profile.custom_url && !isNaN(profile.custom_url as any)) { setError("Custom URL has to contain at least one letter") } else if ( diff --git a/frontend-react/src/components/user/UserPage.tsx b/frontend-react/src/components/user/UserPage.tsx index 481dc9eee..e9127eeaa 100644 --- a/frontend-react/src/components/user/UserPage.tsx +++ b/frontend-react/src/components/user/UserPage.tsx @@ -2,13 +2,15 @@ import React, { useContext } from "react" import { RouteComponentProps, Redirect } from "@reach/router" import { useQuery } from "@apollo/react-hooks" -import { SEARCH_FOR_USER } from "../../graphql/queries/searchForUser" +import { + SEARCH_FOR_USER, + SearchForUserData, + SearchForUserVars, +} from "../../graphql/queries/searchForUser" import { USER } from "../../graphql/queries/user" import Loading from "../common/Loading" import Error from "../common/Error" import { - SearchForUserData, - SearchForUserVars, UserData, SearchForBuildsData, SearchForBuildsVars, @@ -27,6 +29,9 @@ import MyThemeContext from "../../themeContext" import { PLAYER_INFO } from "../../graphql/queries/playerInfo" import XRankTab from "./XRankTab" import { weapons } from "../../utils/lists" +import Alert from "../elements/Alert" +import Markdown from "../elements/Markdown" +import SubHeader from "../common/SubHeader" interface Tab { id: number @@ -124,7 +129,11 @@ const UserPage: React.FC = ({ id }) => { title: "X Rank Top 500", content: ( -

to do

+ + If you have reached Top 500 in a finished X Rank season you can have + it displayed here! Just contact Sendou#0043 on Discord with your + in-game nick. +
), }) @@ -146,9 +155,15 @@ const UserPage: React.FC = ({ id }) => {
)} + {user.bio && ( + + Bio + + + )} - {tabs.map(tabObj => ( + {tabs.map((tabObj) => ( = ({ id }) => { ))} - {tabs.map(tabObj => tabObj.content)} + {tabs.map((tabObj) => tabObj.content)} ) diff --git a/frontend-react/src/graphql/mutations/updateUser.ts b/frontend-react/src/graphql/mutations/updateUser.ts index c248ef03b..a2c82a095 100644 --- a/frontend-react/src/graphql/mutations/updateUser.ts +++ b/frontend-react/src/graphql/mutations/updateUser.ts @@ -7,6 +7,7 @@ export const UPDATE_USER: DocumentNode = gql` $stick_sens: Float $weapons: [String!] $custom_url: String + $bio: String ) { updateUser( country: $country @@ -14,6 +15,7 @@ export const UPDATE_USER: DocumentNode = gql` stick_sens: $stick_sens weapons: $weapons custom_url: $custom_url + bio: $bio ) } ` diff --git a/frontend-react/src/graphql/queries/searchForUser.ts b/frontend-react/src/graphql/queries/searchForUser.ts index 4bdbfa1ca..4cf6faae4 100644 --- a/frontend-react/src/graphql/queries/searchForUser.ts +++ b/frontend-react/src/graphql/queries/searchForUser.ts @@ -1,4 +1,14 @@ import { gql, DocumentNode } from "apollo-boost" +import { User } from "../../types" + +export interface SearchForUserData { + searchForUser?: User +} + +export interface SearchForUserVars { + discord_id?: string + custom_url?: string +} export const SEARCH_FOR_USER: DocumentNode = gql` query searchForUser($discord_id: String, $custom_url: String) { @@ -13,6 +23,7 @@ export const SEARCH_FOR_USER: DocumentNode = gql` weapons top500 custom_url + bio sens { stick motion diff --git a/frontend-react/src/types.ts b/frontend-react/src/types.ts index ccaea53d3..d7749fc68 100644 --- a/frontend-react/src/types.ts +++ b/frontend-react/src/types.ts @@ -79,6 +79,7 @@ export interface User { weapons?: Weapon[] top500: boolean custom_url?: string + bio?: string sens?: { stick: number motion?: number @@ -216,15 +217,6 @@ export interface UserData { user?: UserLean } -export interface SearchForUserData { - searchForUser?: User -} - -export interface SearchForUserVars { - discord_id?: string - custom_url?: string -} - export interface SearchForBuildsData { searchForBuilds: Build[] } diff --git a/graphql-schemas/detailedtournament.js b/graphql-schemas/detailedtournament.js index 964d18315..174899117 100644 --- a/graphql-schemas/detailedtournament.js +++ b/graphql-schemas/detailedtournament.js @@ -294,7 +294,6 @@ const resolvers = { return { leaderboards, tournaments } }, searchForDraftCup: async (root, args) => { - console.log("args.name", args.name) const tournament = await DetailedTournament.findOne({ name: { $regex: new RegExp(args.name, "i") }, }).populate("top_3_discord_users") diff --git a/graphql-schemas/user.js b/graphql-schemas/user.js index 52128c399..1c1760565 100644 --- a/graphql-schemas/user.js +++ b/graphql-schemas/user.js @@ -188,6 +188,12 @@ const resolvers = { } } + if (args.bio && args.bio.length > 1000000) { + throw new UserInputError("bio too long", { + invalidArgs: args, + }) + } + const user = ctx.user if (args.custom_url) {