Hide redeemed reset cards from the account menu
This commit is contained in:
@@ -273,7 +273,8 @@ export function Sidebar({
|
||||
tokenPointBalance && !tokenPointBalance.can_manage_membership,
|
||||
);
|
||||
const nextRefreshLabel = getRefreshTimeLabel(tokenPointBalance?.next_refresh_at);
|
||||
const availableResetCardCount = resetCardState.cards.filter(
|
||||
const visibleResetCards = resetCardState.cards.filter((card) => card.status !== 'redeemed');
|
||||
const availableResetCardCount = visibleResetCards.filter(
|
||||
(card) => getEffectiveResetCardStatus(card) === 'available',
|
||||
).length;
|
||||
const resetCardRedemptionBlocked = tokenPointBalance?.entitlement_source === 'shared_group';
|
||||
@@ -1286,7 +1287,7 @@ export function Sidebar({
|
||||
className="ml-5 rounded-lg bg-surface-subtle/70 p-1 text-xs font-medium text-muted-foreground shadow-soft"
|
||||
innerClassName="grid gap-1"
|
||||
>
|
||||
{resetCardState.status === 'loading' && resetCardState.cards.length === 0 ? (
|
||||
{resetCardState.status === 'loading' && visibleResetCards.length === 0 ? (
|
||||
<p className="px-1.5 py-2 text-pretty text-[11px]">正在加载重置卡…</p>
|
||||
) : null}
|
||||
{resetCardState.status === 'error' ? (
|
||||
@@ -1301,20 +1302,19 @@ export function Sidebar({
|
||||
</button>
|
||||
</div>
|
||||
) : null}
|
||||
{resetCardState.status === 'loaded' && resetCardState.cards.length === 0 ? (
|
||||
<p className="px-1.5 py-2 text-pretty text-[11px]">暂无赠送的重置卡。</p>
|
||||
{resetCardState.status === 'loaded' && visibleResetCards.length === 0 ? (
|
||||
<p className="px-1.5 py-2 text-pretty text-[11px]">暂无未使用的重置卡。</p>
|
||||
) : null}
|
||||
{resetCardRedemptionBlocked && resetCardState.cards.length > 0 ? (
|
||||
{resetCardRedemptionBlocked && visibleResetCards.length > 0 ? (
|
||||
<p className="rounded-md bg-background px-1.5 py-1.5 text-pretty text-[10px] leading-4 shadow-soft">
|
||||
当前使用家庭共享额度,请由家庭管理员使用自己的重置卡。
|
||||
</p>
|
||||
) : null}
|
||||
{resetCardState.cards.length > 0 ? (
|
||||
{visibleResetCards.length > 0 ? (
|
||||
<div className="grid max-h-64 gap-1 overflow-y-auto pr-0.5">
|
||||
{resetCardState.cards.map((card) => {
|
||||
{visibleResetCards.map((card) => {
|
||||
const status = getEffectiveResetCardStatus(card);
|
||||
const expiresAt = formatResetCardTime(card.expires_at) ?? '时间不可用';
|
||||
const redeemedAt = formatResetCardTime(card.redeemed_at);
|
||||
const redeeming = redeemingResetCardId === card.id;
|
||||
return (
|
||||
<article
|
||||
@@ -1328,17 +1328,13 @@ export function Sidebar({
|
||||
'rounded-full px-1.5 py-0.5 text-[10px] font-semibold',
|
||||
status === 'available' && 'bg-accent-soft text-accent-strong',
|
||||
status === 'expired' && 'bg-destructive/10 text-destructive',
|
||||
status === 'redeemed' && 'bg-surface-subtle text-muted-foreground',
|
||||
)}>
|
||||
{status === 'available' ? '可使用' : status === 'expired' ? '已过期' : '已使用'}
|
||||
{status === 'available' ? '可使用' : '已过期'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="mt-1 text-pretty text-[10px] leading-4 tabular-nums">
|
||||
有效期至 {expiresAt}
|
||||
</p>
|
||||
{status === 'redeemed' && redeemedAt ? (
|
||||
<p className="text-pretty text-[10px] leading-4 tabular-nums">使用于 {redeemedAt}</p>
|
||||
) : null}
|
||||
{status === 'available' ? (
|
||||
<button
|
||||
type="button"
|
||||
|
||||
Reference in New Issue
Block a user