From 5cee0ded9c56420043a2b1ce5efdf7e96451c2d1 Mon Sep 17 00:00:00 2001 From: "Kalle (Sendou)" <38327916+Sendouc@users.noreply.github.com> Date: Sun, 27 Sep 2020 02:42:16 +0300 Subject: [PATCH] fixes #107 --- .../public/locales/en/translation.json | 3 +- .../src/components/analyzer/LdeSlider.tsx | 59 +++++++++++-------- .../components/markdown/MarkdownHelpPage.tsx | 12 ++-- .../plans/DraggableWeaponSelector.tsx | 14 ++--- frontend-react/src/components/root/Links.tsx | 22 +++---- .../src/components/user/UserPage.tsx | 8 +-- 6 files changed, 64 insertions(+), 54 deletions(-) diff --git a/frontend-react/public/locales/en/translation.json b/frontend-react/public/locales/en/translation.json index d412ce32d..8229f8019 100644 --- a/frontend-react/public/locales/en/translation.json +++ b/frontend-react/public/locales/en/translation.json @@ -1384,7 +1384,8 @@ "Slosher has weird physics so we haven't fully deciphered this parameter.": "Slosher has weird physics so we haven't fully deciphered this parameter.", "damage": "damage", "pointShort": "p", - "Damage taken in enemy ink": "Damage taken in enemy ink" + "Damage taken in enemy ink": "Damage taken in enemy ink", + "Intensity": "Intensity" }, "users": { "Filter by username, Twitter name or Discord ID": "Filter by username, Twitter name or Discord ID", diff --git a/frontend-react/src/components/analyzer/LdeSlider.tsx b/frontend-react/src/components/analyzer/LdeSlider.tsx index 5c61ca4ba..75ae5311d 100644 --- a/frontend-react/src/components/analyzer/LdeSlider.tsx +++ b/frontend-react/src/components/analyzer/LdeSlider.tsx @@ -1,15 +1,17 @@ -import React, { useContext } from "react" -import MyThemeContext from "../../themeContext" import { - Flex, Box, - Slider, - SliderTrack, - SliderFilledTrack, - SliderThumb, + Flex, + NumberDecrementStepper, + NumberIncrementStepper, + NumberInput, + NumberInputField, + NumberInputStepper, + Text, } from "@chakra-ui/core" +import React, { useContext } from "react" +import { Trans, useTranslation } from "react-i18next" +import MyThemeContext from "../../themeContext" import AbilityIcon from "../builds/AbilityIcon" -import { useTranslation, Trans } from "react-i18next" interface LdeSliderProps { value: number @@ -17,9 +19,7 @@ interface LdeSliderProps { } const LdeSlider: React.FC = ({ value, setValue }) => { - const { themeColor, themeColorWithShade, grayWithShade } = useContext( - MyThemeContext - ) + const { themeColorWithShade, grayWithShade } = useContext(MyThemeContext) const { t } = useTranslation() const bonusAp = Math.floor((24 / 21) * value) @@ -42,20 +42,31 @@ const LdeSlider: React.FC = ({ value, setValue }) => { flexDirection="column" mb="1em" > - setValue(value)} - max={21} + - - - - - - - - - + {t("analyzer;Intensity")} + + setValue(value)} + > + + + + + + {value > 0 && ( +{bonusAp} diff --git a/frontend-react/src/components/markdown/MarkdownHelpPage.tsx b/frontend-react/src/components/markdown/MarkdownHelpPage.tsx index 35ebc7c1a..61d2827a7 100644 --- a/frontend-react/src/components/markdown/MarkdownHelpPage.tsx +++ b/frontend-react/src/components/markdown/MarkdownHelpPage.tsx @@ -1,14 +1,12 @@ -import React, { useContext, useState } from "react" +import { Box, Collapse, Flex, Link } from "@chakra-ui/core" import { RouteComponentProps } from "@reach/router" -import PageHeader from "../common/PageHeader" -import { Box, Link, Flex, Collapse } from "@chakra-ui/core" +import React, { useContext, useState } from "react" import MyThemeContext from "../../themeContext" +import { abilitiesGameOrder, gearCodes, weaponCodes } from "../../utils/lists" +import PageHeader from "../common/PageHeader" import WeaponImage from "../common/WeaponImage" -import Emoji from "../elements/Emoji" import Button from "../elements/Button" -import { weaponCodes, abilitiesGameOrder, gearCodes } from "../../utils/lists" - -interface MarkdownHelpPageProps {} +import Emoji from "../elements/Emoji" const MarkdownHelpPage: React.FC = () => { const { themeColorWithShade } = useContext(MyThemeContext) diff --git a/frontend-react/src/components/plans/DraggableWeaponSelector.tsx b/frontend-react/src/components/plans/DraggableWeaponSelector.tsx index a908fb818..69ead13f9 100644 --- a/frontend-react/src/components/plans/DraggableWeaponSelector.tsx +++ b/frontend-react/src/components/plans/DraggableWeaponSelector.tsx @@ -1,17 +1,17 @@ -import React, { useState, useContext } from "react" +import { Box, Flex } from "@chakra-ui/core" +import React, { useContext, useState } from "react" import Draggable from "react-draggable" +import { useTranslation } from "react-i18next" +import MyThemeContext from "../../themeContext" +import { Weapon } from "../../types" import { weapons } from "../../utils/lists" import WeaponImage from "../common/WeaponImage" -import { Box, Flex } from "@chakra-ui/core" -import { Weapon } from "../../types" -import MyThemeContext from "../../themeContext" -import { useTranslation } from "react-i18next" -interface DraggableWeaponSelector { +interface DraggableWeaponSelectorProps { addWeaponImage: (weapon: Weapon) => void } -const DraggableWeaponSelector: React.FC = ({ +const DraggableWeaponSelector: React.FC = ({ addWeaponImage, }) => { const { darkerBgColor } = useContext(MyThemeContext) diff --git a/frontend-react/src/components/root/Links.tsx b/frontend-react/src/components/root/Links.tsx index a374ece73..f2f805d21 100644 --- a/frontend-react/src/components/root/Links.tsx +++ b/frontend-react/src/components/root/Links.tsx @@ -1,17 +1,17 @@ -import React, { useContext } from "react" import { useQuery } from "@apollo/react-hooks" -import { LINKS } from "../../graphql/queries/links" -import Loading from "../common/Loading" -import Error from "../common/Error" -import { Helmet } from "react-helmet-async" -import PageHeader from "../common/PageHeader" +import { Box, Flex, Heading, Link } from "@chakra-ui/core" import { RouteComponentProps } from "@reach/router" -import { Heading, Link, Flex, Box } from "@chakra-ui/core" -import MyThemeContext from "../../themeContext" +import React, { useContext } from "react" +import { Helmet } from "react-helmet-async" import { useTranslation } from "react-i18next" +import { LINKS } from "../../graphql/queries/links" +import MyThemeContext from "../../themeContext" +import Error from "../common/Error" +import Loading from "../common/Loading" +import PageHeader from "../common/PageHeader" import Alert from "../elements/Alert" -interface Link { +interface LinkI { title: string url: string description: string @@ -19,7 +19,7 @@ interface Link { } interface LinksData { - links: Link[] + links: LinkI[] } const Links: React.FC = () => { @@ -31,7 +31,7 @@ const Links: React.FC = () => { if (error) return const links = data.links - const linkMap = (link: Link) => ( + const linkMap = (link: LinkI) => ( {link.title} diff --git a/frontend-react/src/components/user/UserPage.tsx b/frontend-react/src/components/user/UserPage.tsx index 9e504d9ce..6e8dec576 100644 --- a/frontend-react/src/components/user/UserPage.tsx +++ b/frontend-react/src/components/user/UserPage.tsx @@ -11,6 +11,7 @@ import { import { Redirect, RouteComponentProps } from "@reach/router" import React, { useContext } from "react" import { Helmet } from "react-helmet-async" +import { Trans, useTranslation } from "react-i18next" import { FaTrophy, FaTshirt } from "react-icons/fa" import { IconType } from "react-icons/lib/cjs" import { PLAYER_INFO } from "../../graphql/queries/playerInfo" @@ -29,16 +30,15 @@ import { SearchForBuildsVars, UserData, } from "../../types" -import { weapons, canAddJpnBuildsIds } from "../../utils/lists" +import { canAddJpnBuildsIds, weapons } from "../../utils/lists" import Error from "../common/Error" import Loading from "../common/Loading" import Markdown from "../elements/Markdown" import AvatarWithInfo from "./AvatarWithInfo" import BuildTab from "./BuildTab" import XRankTab from "./XRankTab" -import { useTranslation, Trans } from "react-i18next" -interface Tab { +interface TabI { id: number icon: IconType title: JSX.Element @@ -100,7 +100,7 @@ const UserPage: React.FC = ({ id }) => { const user = data.searchForUser const builds = buildsData.searchForBuilds - const tabs: Tab[] = [] + const tabs: TabI[] = [] if (builds.length > 0 || userLean?.discord_id === user.discord_id) { tabs.push({