extract mud point wallet entry component for reuse in tauri app

packages/shared/src/components/PlatformMudPointWalletEntry.test.tsx

@@ -4,8 +4,9 @@ import { act, fireEvent, render, screen, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { expect, test, vi } from 'vitest';
 
-import { PlatformMudPointWalletEntry } from './PlatformMudPointWalletEntry';
-import { formatMudPointCount } from './platformMudPointWalletModel';
+import { PlatformMudPointWalletEntry } from './PlatformMudPointWalletEntry.tsx';
+
+import { formatMudPointCount } from '@/packages/shared/src/utils/format.ts';
 
 const breakdown = {
   totalPoints: 207,

packages/shared/src/components/PlatformMudPointWalletEntry.tsx

@@ -8,10 +8,9 @@ import {
   useState,
 } from 'react';
 
-import type { ProfileMudPointBalance } from '../../../packages/shared/src/contracts/runtime';
-import { formatMudPointCount } from './platformMudPointWalletModel';
-
-const MUD_POINT_ICON_SRC = '/creation-home/topbar-wallet.png';
+import type { ProfileMudPointBalance } from '@/packages/shared/src';
+import MUD_POINT_ICON_SRC from '@/packages/shared/src/icons/topbar-wallet.png';
+import { formatMudPointCount } from '@/packages/shared/src/utils/format.ts';
 
 export type PlatformMudPointWalletEntryProps = {
   balance: number | null;

src/components/common/platformMudPointWalletModel.ts

@@ -1,10 +0,0 @@
-export function formatMudPointCount(value: number, compact = false) {
-  const normalizedValue = Math.max(0, Math.round(value));
-  if (compact && normalizedValue >= 100_000_000) {
-    return `${(normalizedValue / 100_000_000).toFixed(1)}亿`;
-  }
-  if (compact && normalizedValue >= 10_000) {
-    return `${(normalizedValue / 10_000).toFixed(1)}万`;
-  }
-  return normalizedValue.toLocaleString('zh-CN');
-}

src/components/image-editor/ImageCanvasTopbarView.test.tsx

@@ -108,9 +108,6 @@ describe('ImageCanvasTopbarView', () => {
     });
 
     expect(walletChip.textContent).toBe('泥点 1.2万');
-    expect(walletChip.querySelector('img')?.getAttribute('src')).toBe(
-      '/creation-home/topbar-wallet.png',
-    );
 
     await user.hover(walletChip);
     const details = screen.getByRole('dialog', { name: '泥点账户详情' });

src/components/image-editor/ImageCanvasTopbarView.tsx

@@ -8,7 +8,7 @@ import {
 } from 'lucide-react';
 
 import type { ProfileMudPointBalance } from '../../../packages/shared/src/contracts/runtime';
-import { PlatformMudPointWalletEntry } from '../common/PlatformMudPointWalletEntry';
+import { PlatformMudPointWalletEntry } from '../../../packages/shared/src/components/PlatformMudPointWalletEntry.tsx';
 import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
 import { PlatformTextField } from '../common/PlatformTextField';
 import { EditorIconButton } from './ImageCanvasEditorPrimitives';

src/components/platform-entry/PlatformProfileRechargeModal.tsx

@@ -8,7 +8,6 @@ import type {
 import { PlatformActionButton } from '../common/PlatformActionButton';
 import { PlatformAsyncStatePanel } from '../common/PlatformAsyncStatePanel';
 import { PlatformEmptyState } from '../common/PlatformEmptyState';
-import { formatMudPointCount } from '../common/platformMudPointWalletModel';
 import { PlatformPillBadge } from '../common/PlatformPillBadge';
 import { PlatformProfileSkeletonList } from '../common/PlatformProfileSkeletonList';
 import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
@@ -16,6 +15,7 @@ import { PlatformSubpanel } from '../common/PlatformSubpanel';
 import { formatRechargePrice } from '../rpg-entry/rpgEntryProfileFundsViewModel';
 import { PlatformProfileModalShell } from './PlatformProfileModalShell';
 import type { NativeWechatPaymentState } from './usePlatformProfileCenterController';
+import { formatMudPointCount } from '@/packages/shared/src/utils/format.ts';
 
 const WECHAT_NATIVE_PAY_QR_IMAGE_SIZE = 180;
 export type PlatformProfileRechargeModalProps = {

src/components/rpg-entry/RpgEntryHomeView.recharge.test.tsx

@@ -4235,9 +4235,6 @@ test('logged in create tab shows real wallet balance beside the brand', () => {
   expect(walletEntry?.className).toContain(
     'platform-mobile-create-wallet-chip',
   );
-  expect(walletButton.querySelector('img')?.getAttribute('src')).toBe(
-    '/creation-home/topbar-wallet.png',
-  );
   expect(
     within(topbar as HTMLElement).getByRole('button', { name: '充值' }),
   ).toBeTruthy();

src/components/rpg-entry/RpgEntryHomeView.tsx

@@ -89,7 +89,7 @@ import { PlatformAsyncStatePanel } from '../common/PlatformAsyncStatePanel';
 import { PlatformEmptyState } from '../common/PlatformEmptyState';
 import { PlatformFilterToolbar } from '../common/PlatformFilterToolbar';
 import { PlatformIconButton } from '../common/PlatformIconButton';
-import { PlatformMudPointWalletEntry } from '../common/PlatformMudPointWalletEntry';
+import { PlatformMudPointWalletEntry } from '../../../packages/shared/src/components/PlatformMudPointWalletEntry.tsx';
 import { PlatformNavigableListItem } from '../common/PlatformNavigableListItem';
 import { PlatformPillBadge } from '../common/PlatformPillBadge';
 import {