From cc0f5c0a2e75f50ac74a71e8866532b3708e5f22 Mon Sep 17 00:00:00 2001
From: hamster1963 <1410514192@qq.com>
Date: Fri, 2 Jan 2026 23:20:52 +0800
Subject: [PATCH] fix: ensure billing information displays correctly based on
 available dates

---
 src/components/billingInfo.tsx | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/components/billingInfo.tsx b/src/components/billingInfo.tsx
index 9db3488..31e3619 100644
--- a/src/components/billingInfo.tsx
+++ b/src/components/billingInfo.tsx
@@ -23,6 +23,9 @@ export default function BillingInfo({
 		cycleLabel: "",
 		remainingPercentage: 0,
 	};
+	const hasBillingDates =
+		Boolean(parsedData.billingDataMod.startDate) ||
+		Boolean(parsedData.billingDataMod.endDate);
 
 	if (parsedData?.billingDataMod?.endDate) {
 		if (parsedData.billingDataMod.endDate.startsWith("0000-00-00")) {
@@ -61,13 +64,15 @@ export default function BillingInfo({
 					{t("billingInfo.usage-baseed")}
 				</p>
 			) : null}
-			<div className={cn("text-[10px] text-muted-foreground")}>
-				{t("billingInfo.remaining")}:{" "}
-				{isNeverExpire
-					? t("billingInfo.indefinite")
-					: `${daysLeftObject.days} ${t("billingInfo.days")}`}
-			</div>
-			{!isNeverExpire && (
+			{hasBillingDates && (
+				<div className={cn("text-[10px] text-muted-foreground")}>
+					{t("billingInfo.remaining")}:{" "}
+					{isNeverExpire
+						? t("billingInfo.indefinite")
+						: `${daysLeftObject.days} ${t("billingInfo.days")}`}
+				</div>
+			)}
+			{hasBillingDates && !isNeverExpire && (
 				<RemainPercentBar
 					className="mt-0.5"
 					value={daysLeftObject.remainingPercentage * 100}