diff --git a/src/components/posts/Post.jsx b/src/components/posts/Post.jsx index 1196b7c7eb6afffebcaba79af777ae6a29228786..08ec124d68c31add7ecce47e03de70fe9f9ce33a 100644 --- a/src/components/posts/Post.jsx +++ b/src/components/posts/Post.jsx @@ -240,8 +240,8 @@ const Post = ({ )} <PostScore className="ml-2" - score={ranking.score} - hasDislikes={ranking.dislikes > 0} + postType={type} + ranking={ranking} rankingReadonly={!thumbsVisible} supportThreshold={supportThreshold} /> diff --git a/src/components/posts/PostScore.jsx b/src/components/posts/PostScore.jsx index b5bf19cb4939ff7634b9758fa30d17b7026cdc35..b24917346497c1f642cdbb42480a09bf2103a4ab 100644 --- a/src/components/posts/PostScore.jsx +++ b/src/components/posts/PostScore.jsx @@ -2,27 +2,31 @@ import React from "react"; import classNames from "classnames"; const PostScore = ({ - score, - hasDislikes, + postType, + ranking, supportThreshold, rankingReadonly, className, }) => { - const coloring = rankingReadonly - ? "bg-grey-125 text-grey-200" - : { + const { score, dislikes } = ranking; + const highlight = postType === "procedure-proposal" && !rankingReadonly; + const coloring = highlight + ? { "bg-red-600 text-white": score < 0, "bg-grey-125 text-grey-200": score === 0 && score < supportThreshold, "bg-yellow-400 text-grey-300": - score > 0 && hasDislikes && score < supportThreshold, + score > 0 && dislikes > 0 && score < supportThreshold, "bg-green-400 text-white": - score >= supportThreshold || (score > 0 && !hasDislikes), - }; + score >= supportThreshold || (score > 0 && dislikes <= 0), + } + : "bg-grey-125 text-grey-200"; let title; - if (!rankingReadonly) { - if (hasDislikes) { + if (postType === "procedure-proposal") { + if (rankingReadonly) { + title = `Návrh postupu zĂskal podporu ${score} hlasĹŻ.`; + } else if (dislikes > 0) { if (score < supportThreshold) { title = `AktuálnĂ podpora je ${score} hlasĹŻ, pro zĂskánĂ podpory skupiny ÄŤlenĹŻ chybĂ ještÄ› ${ supportThreshold - score @@ -48,14 +52,7 @@ const PostScore = ({ title={title} > <i className="ico--power" /> - <span className="font-bold"> - {!rankingReadonly && hasDislikes && ( - <span> - {score} z {supportThreshold} - </span> - )} - {!(!rankingReadonly && hasDislikes) && score.toString()} - </span> + <span className="font-bold">{score}</span> </span> ); };