From e3ec313d96286074bf662f267d34b31ed2c68feb Mon Sep 17 00:00:00 2001 From: Brandon Thomas Date: Mon, 9 Sep 2024 03:47:57 -0400 Subject: [PATCH] add stats to search --- .../components/src/api/weights/GetWeight.ts | 1 + .../common/Card/AudioCard/AudioCard.tsx | 7 ++++ .../components/common/Searcher/Searcher.tsx | 1 + .../src/components/common/Stat/Stat.tsx | 38 +++++++++++++++++++ .../entities/WeightCard/WeightCard.tsx | 6 +++ .../v2/view/pages/lipsync/LipsyncTokens.ts | 1 + 6 files changed, 54 insertions(+) create mode 100644 src/website/packages/fakeyou.com/src/components/common/Stat/Stat.tsx diff --git a/src/website/packages/components/src/api/weights/GetWeight.ts b/src/website/packages/components/src/api/weights/GetWeight.ts index 5215432783..fa44297aa0 100644 --- a/src/website/packages/components/src/api/weights/GetWeight.ts +++ b/src/website/packages/components/src/api/weights/GetWeight.ts @@ -31,6 +31,7 @@ export interface Weight { bookmark_count: number; positive_rating_count: number; }; + usage_count: number; } export interface GetWeightRequest {} diff --git a/src/website/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx b/src/website/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx index 58403b8ba5..d805f21ea2 100644 --- a/src/website/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx +++ b/src/website/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx @@ -11,6 +11,8 @@ import WeightCoverImage from "components/common/WeightCoverImage"; import { BucketConfig } from "@storyteller/components/src/api/BucketConfig"; import getCardUrl from "../getCardUrl"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import Stat from "components/common/Stat/Stat"; +import { faVolumeHigh } from "@fortawesome/pro-duotone-svg-icons"; // import getCardUrl from "../getCardUrl"; interface AudioCardProps { @@ -177,6 +179,11 @@ export default function AudioCard({ label={weightBadgeLabel} color={weightBadgeColor} /> + + + {data?.stats?.positive_rating_count} diff --git a/src/website/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx b/src/website/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx index d3e3298b5b..5f3995e4e5 100644 --- a/src/website/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx +++ b/src/website/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx @@ -14,6 +14,7 @@ import useSearcherStore from "hooks/useSearcherStore"; import prepFilter from "resources/prepFilter"; import { ListWeights } from "@storyteller/components/src/api/weights/ListWeights"; import InfiniteScroll from "react-infinite-scroll-component"; + interface SearcherProps { type?: "page" | "modal"; dataType?: "media" | "weights"; diff --git a/src/website/packages/fakeyou.com/src/components/common/Stat/Stat.tsx b/src/website/packages/fakeyou.com/src/components/common/Stat/Stat.tsx new file mode 100644 index 0000000000..b054e2c3c8 --- /dev/null +++ b/src/website/packages/fakeyou.com/src/components/common/Stat/Stat.tsx @@ -0,0 +1,38 @@ +import { IconProp } from "@fortawesome/fontawesome-svg-core"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import React from "react"; + +const MILLION : number = 1000000; +const THOUSAND : number = 1000; + +interface Props { + count: number, + icon?: IconProp, +} + +export default function Stat(props: Props) { + let friendlyCount = toHumanNumber(props.count); + + let icon = <>; + if (props.icon !== undefined) { + icon = ; + } + + return ( + + {friendlyCount} {icon} + + ) +} + +function toHumanNumber(count: number) : string { + if (count > MILLION) { + let digits = (count / MILLION).toFixed(2); + return `${digits}m`; + } else if (count > THOUSAND) { + let digits = (count / THOUSAND).toFixed(2); + return `${digits}k`; + } else { + return count.toString(); + } +} diff --git a/src/website/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx b/src/website/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx index eb56364079..3715b3d358 100644 --- a/src/website/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx +++ b/src/website/packages/fakeyou.com/src/components/entities/WeightCard/WeightCard.tsx @@ -9,6 +9,7 @@ import useWeightTypeInfo from "hooks/useWeightTypeInfo"; import { WeightType } from "@storyteller/components/src/api/_common/enums"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faThumbsUp } from "@fortawesome/pro-solid-svg-icons"; +import Stat from "components/common/Stat/Stat"; interface Props { data: any; @@ -95,6 +96,11 @@ export default function WeightCard({ small={true} color={weightTagColor || ""} /> + + + {data?.stats?.positive_rating_count} diff --git a/src/website/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncTokens.ts b/src/website/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncTokens.ts index 02c644da4e..c86af548de 100644 --- a/src/website/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncTokens.ts +++ b/src/website/packages/fakeyou.com/src/v2/view/pages/lipsync/LipsyncTokens.ts @@ -30,6 +30,7 @@ export const LipsyncTokenMap: { [key: string]: string } = { // Rick Sanchez (live portrait video is poor quality) weight_0f762jdzgsy1dhpb86qxy4ssm: "m_3b2yhzq4na7yg724k9tm4dn0513c36", // Rick Sanchez weight_qfz806d82b0qmxfn3vzgmtyme: "m_3b2yhzq4na7yg724k9tm4dn0513c36", // Rick Sanchez + weight_n99qccqtbb4fe3yj16dsfgfv4: "m_3b2yhzq4na7yg724k9tm4dn0513c36", // Rick Sanchez // Walter White (live portrait video looks funny) weight_0bsxzrwp6p77t67s8dcn607wf: "m_ft3y3vjyg2shssrqq0p51qh143pm0n", // Walter White (most popular) weight_x6vgpe83p2g9pxehhaq4e8823: "m_ft3y3vjyg2shssrqq0p51qh143pm0n", // Walter White