From b9ee6f012eed97a594bbb9a8d4bea7f5e2b7fd55 Mon Sep 17 00:00:00 2001
From: BFlat <bombayapirat@gmail.com>
Date: Sat, 23 Dec 2023 09:31:35 +0700
Subject: [PATCH] weight audio card update

---
 .../src/components/common/Card/AudioCard/AudioCard.tsx      | 6 +++++-
 .../src/hooks/useShortenNumber/useShortenNumber.tsx         | 2 ++
 .../src/v2/view/pages/explore/tabs/WeightsTab.tsx           | 6 ++++++
 3 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx b/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx
index f147520fd2..99557742a6 100644
--- a/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx
+++ b/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx
@@ -9,6 +9,7 @@ import FavoriteButton from "components/common/FavoriteButton";
 import CreatorName from "../CreatorName";
 import { faArrowRight } from "@fortawesome/pro-solid-svg-icons";
 import Button from "components/common/Button";
+import useWeightTypeInfo from "hooks/useWeightTypeInfo/useWeightTypeInfo";
 
 interface AudioCardProps {
   data: any;
@@ -50,6 +51,9 @@ export default function AudioCard({
     return true; // temporary, replace with like function
   };
 
+  const { label: weightBadgeLabel, color: weightBadgeColor } =
+    useWeightTypeInfo(data.weights_type);
+
   return (
     <Card padding={true} onClick={handleCardClick}>
       {type === "media" && (
@@ -113,7 +117,7 @@ export default function AudioCard({
             <div className="flex-grow-1">
               <div className="d-flex align-items-center">
                 <div className="d-flex flex-grow-1">
-                  <Badge label="RVC" color="orange" />
+                  <Badge label={weightBadgeLabel} color={weightBadgeColor} />
                 </div>
                 <Button
                   icon={faArrowRight}
diff --git a/packages/fakeyou.com/src/hooks/useShortenNumber/useShortenNumber.tsx b/packages/fakeyou.com/src/hooks/useShortenNumber/useShortenNumber.tsx
index cc24407c9a..9ad3f126e2 100644
--- a/packages/fakeyou.com/src/hooks/useShortenNumber/useShortenNumber.tsx
+++ b/packages/fakeyou.com/src/hooks/useShortenNumber/useShortenNumber.tsx
@@ -1,4 +1,6 @@
 export default function useShortenNumber(num: number): string {
+  if (isNaN(num)) return "0";
+  if (num === 0) return "0";
   if (Math.abs(num) < 1e3) return num.toString();
   if (Math.abs(num) < 1e6) return (num / 1e3).toFixed(1) + "k";
   if (Math.abs(num) < 1e9) return (num / 1e6).toFixed(1) + "M";
diff --git a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx
index 91b3de6daa..3aeda2b82a 100644
--- a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx
+++ b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx
@@ -103,6 +103,7 @@ export default function MediaTab() {
                         data={data}
                         type="weights"
                         showCreator={true}
+                        showCover={true}
                       />
                     );
                     break;
@@ -113,6 +114,7 @@ export default function MediaTab() {
                         data={data}
                         type="weights"
                         showCreator={true}
+                        showCover={true}
                       />
                     );
                     break;
@@ -123,6 +125,7 @@ export default function MediaTab() {
                         data={data}
                         type="weights"
                         showCreator={true}
+                        showCover={true}
                       />
                     );
                     break;
@@ -136,6 +139,9 @@ export default function MediaTab() {
                       />
                     );
                     break;
+                  case WeightCategory.VOCODER:
+                    card = <></>;
+                    break;
                   default:
                     card = <div>Unsupported weight type</div>;
                 }