From 0a6173481b5bf6d8fd1d780d074324ca896db2cc Mon Sep 17 00:00:00 2001 From: Sendou Date: Sun, 17 Nov 2019 01:03:33 +0200 Subject: [PATCH] different description style for builds --- react-ui/src/components/common/BuildCard.js | 77 +++++++++------------ 1 file changed, 34 insertions(+), 43 deletions(-) diff --git a/react-ui/src/components/common/BuildCard.js b/react-ui/src/components/common/BuildCard.js index e068bd6fe..f5e7bd69d 100644 --- a/react-ui/src/components/common/BuildCard.js +++ b/react-ui/src/components/common/BuildCard.js @@ -1,13 +1,13 @@ -import React, { useState } from "react" -import { Card, Image, Icon, Popup, Button } from "semantic-ui-react" -import { Link } from "react-router-dom" -import english_internal from "../../utils/english_internal.json" -import AbilityIcon from "./AbilityIcon" +import React, { useState } from "react"; +import { Card, Image, Icon, Popup, Button } from "semantic-ui-react"; +import { Link } from "react-router-dom"; +import english_internal from "../../utils/english_internal.json"; +import AbilityIcon from "./AbilityIcon"; -import { wpnMedium } from "../../assets/imageImports" -import top500 from "../../assets/xleaderboardIcons/all.png" -import BuildDeleteModal from "../user/BuildDeleteModal.js" -import AddBuildForm from "../user/AddBuildForm.js" +import { wpnMedium } from "../../assets/imageImports"; +import top500 from "../../assets/xleaderboardIcons/all.png"; +import BuildDeleteModal from "../user/BuildDeleteModal.js"; +import AddBuildForm from "../user/AddBuildForm.js"; const BuildCard = ({ build, @@ -18,18 +18,17 @@ const BuildCard = ({ showWeapon = true, showDescription = true }) => { - const [expanded, setExpanded] = useState(false) - const [showEdit, setShowEdit] = useState(false) + const [showEdit, setShowEdit] = useState(false); function removeAbility(gearIndex, slotIndex) { - let copyOfArray = [...existingAbilities] - copyOfArray[gearIndex][slotIndex] = "" - setAbilities(copyOfArray) + let copyOfArray = [...existingAbilities]; + copyOfArray[gearIndex][slotIndex] = ""; + setAbilities(copyOfArray); } const buildTitle = - !build.title || build.title === "" ? `${build.weapon} Build` : build.title - const buildDescription = !build.description ? "" : build.description + !build.title || build.title === "" ? `${build.weapon} Build` : build.title; + const buildDescription = !build.description ? "" : build.description; if (showEdit) return ( @@ -40,7 +39,7 @@ const BuildCard = ({ editBuildFunction={editBuildFunction} /> - ) + ); const BCard = () => { return ( @@ -65,6 +64,19 @@ const BuildCard = ({ /> )}{" "} {buildTitle} + {build.description && showDescription && ( + + } + /> + )} {build.discord_user && ( @@ -158,32 +170,11 @@ const BuildCard = ({ )} - {build.description && showDescription && ( - - setExpanded(!expanded)} - > - - Click here to see the description - - - )} - ) - } + ); + }; - if (build.description) - return ( - } - /> - ) + return ; +}; - return -} - -export default BuildCard +export default BuildCard;