feat(subscription): split vip and topup flows

2026-06-29 14:45:01 +08:00
parent 72ac923a44
commit 096978e703
17 changed files with 106 additions and 432 deletions
@@ -6,6 +6,7 @@ import styles from "./sidebar-wallet-card.module.css";

 export interface SidebarWalletCardProps {
  creditBalance: number;
+  onActivateVip?: () => void;
  onTopUp: () => void;
  onRulesClick: () => void;
 }
@@ -15,6 +16,7 @@ const formatCoins = (value: number): string =>

 export function SidebarWalletCard({
  creditBalance,
+  onActivateVip,
  onTopUp,
  onRulesClick,
 }: SidebarWalletCardProps) {
@@ -42,9 +44,20 @@ export function SidebarWalletCard({
        </button>
      </div>

-      <button type="button" className={styles.topUpButton} onClick={onTopUp}>
-        Top Up
-      </button>
+      <div className={styles.actionColumn}>
+        {onActivateVip ? (
+          <button
+            type="button"
+            className={styles.activateButton}
+            onClick={onActivateVip}
+          >
+            Activate VIP
+          </button>
+        ) : null}
+        <button type="button" className={styles.topUpButton} onClick={onTopUp}>
+          Top Up
+        </button>
+      </div>
    </section>
  );
 }