From f4517f03fc81f229fc80f54965432f61e9ad69c0 Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Mon, 23 Mar 2026 21:06:52 +0700
Subject: [PATCH] =?UTF-8?q?feat(balance):=20=D0=BF=D0=BE=D0=B4=D0=BF=D0=B8?=
 =?UTF-8?q?=D1=81=D1=8C=20=D0=B0=D0=BA=D0=BA=D0=B0=D1=83=D0=BD=D1=82=D0=B0?=
 =?UTF-8?q?=20=C2=AB=D1=85=D0=BE=D1=81=D1=82=D0=B5=D1=80=20/=20=D0=B8?=
 =?UTF-8?q?=D0=BC=D1=8F=C2=BB=20=D0=BA=D0=B0=D0=BA=20=D0=B2=20=D1=84=D0=B8?=
 =?UTF-8?q?=D0=BB=D1=8C=D1=82=D1=80=D0=B0=D1=85=20VPS?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Вынесен accountSelectLabel в src/lib/account-select-label.js
- Модалка списания, таблица баланса и журнал на BalancePage
- VpsPage переведён на общий модуль

Made-with: Cursor
---
 src/lib/account-select-label.js | 13 +++++++++++++
 src/pages/BalancePage.jsx       | 16 +++++++++++++---
 src/pages/VpsPage.jsx           |  9 +--------
 3 files changed, 27 insertions(+), 11 deletions(-)
 create mode 100644 src/lib/account-select-label.js

diff --git a/src/lib/account-select-label.js b/src/lib/account-select-label.js
new file mode 100644
index 0000000..545dc2e
--- /dev/null
+++ b/src/lib/account-select-label.js
@@ -0,0 +1,13 @@
+/**
+ * Подпись аккаунта в select и списках: при выборе одного хостера (scopedProviderId) — только имя аккаунта,
+ * иначе «хостер / аккаунт» (как в фильтрах VPS).
+ * @param {{ name?: string, providerId?: string }} account
+ * @param {Map<string, { name?: string }>} providerById
+ * @param {string} [scopedProviderId]
+ */
+export function accountSelectLabel(account, providerById, scopedProviderId) {
+  const name = account.name?.trim() || '—'
+  if (scopedProviderId) return name
+  const providerName = providerById.get(account.providerId)?.name ?? '—'
+  return `${providerName} / ${name}`
+}
diff --git a/src/pages/BalancePage.jsx b/src/pages/BalancePage.jsx
index 9e7b993..2c03978 100644
--- a/src/pages/BalancePage.jsx
+++ b/src/pages/BalancePage.jsx
@@ -8,6 +8,7 @@ import { EmptyState } from '../components/EmptyState'
 import { PageHeader } from '../components/PageHeader'
 import { ConvertedAmount } from '../components/ConvertedAmount'
 import { noBrowserSuggestProps } from '../lib/noBrowserSuggestProps'
+import { accountSelectLabel } from '../lib/account-select-label'
 
 const emptyForm = {
   type: 'daily_debit',
@@ -24,6 +25,11 @@ export function BalancePage({ db, actions, settings, ratesData }) {
   const [error, setError] = useState('')
   const [isModalOpen, setIsModalOpen] = useState(false)
 
+  const providerById = useMemo(
+    () => new Map(db.providers.map((p) => [p.id, p])),
+    [db.providers],
+  )
+
   const vpsOptions = useMemo(
     () => db.vps.filter((vps) => !form.providerAccountId || vps.providerAccountId === form.providerAccountId),
     [db.vps, form.providerAccountId],
@@ -94,7 +100,7 @@ export function BalancePage({ db, actions, settings, ratesData }) {
               <tbody>
                 {accountBalances.map((account) => (
                   <tr key={account.id}>
-                    <td>{account.name}</td>
+                    <td>{accountSelectLabel(account, providerById, '')}</td>
                     <td>{billingModeLabel(account.billingMode)}</td>
                     <td>
                       <ConvertedAmount
@@ -146,7 +152,11 @@ export function BalancePage({ db, actions, settings, ratesData }) {
                         </span>
                       </td>
                       <td>
-                        <div>{account?.name || '-'}</div>
+                        <div>
+                          {account
+                            ? accountSelectLabel(account, providerById, '')
+                            : '-'}
+                        </div>
                         <div className="text-secondary">{vps?.dns || vps?.ip || '-'}</div>
                       </td>
                       <td>
@@ -216,7 +226,7 @@ export function BalancePage({ db, actions, settings, ratesData }) {
               <option value="">Выберите аккаунт</option>
               {db.providerAccounts.map((account) => (
                 <option key={account.id} value={account.id}>
-                  {account.name}
+                  {accountSelectLabel(account, providerById, '')}
                 </option>
               ))}
             </select>
diff --git a/src/pages/VpsPage.jsx b/src/pages/VpsPage.jsx
index b346fb7..99a82e0 100644
--- a/src/pages/VpsPage.jsx
+++ b/src/pages/VpsPage.jsx
@@ -29,6 +29,7 @@ import { ProjectSuggestInput } from '../components/ProjectSuggestInput'
 import { noBrowserSuggestProps } from '../lib/noBrowserSuggestProps'
 import { getPaidUntilDate as computePaidUntilForHealth } from '../lib/paid-until'
 import { billmanagerSyncableAccounts } from '../lib/billmanager-ui'
+import { accountSelectLabel } from '../lib/account-select-label'
 
 const emptyForm = {
   ip: '',
@@ -78,14 +79,6 @@ function loadFilterPresets() {
   }
 }
 
-/** Подпись аккаунта в select: при фильтре по одному хостеру — только имя, иначе «хостер / аккаунт». */
-function accountSelectLabel(account, providerById, scopedProviderId) {
-  const name = account.name?.trim() || '—'
-  if (scopedProviderId) return name
-  const providerName = providerById.get(account.providerId)?.name ?? '—'
-  return `${providerName} / ${name}`
-}
-
 function vpsMonthlyEstimateInBase(item, baseCurrency, ratesData, providerById) {
   if (item.status !== 'active') return 0
   const tariffType = item.tariffType || (Number(item.dailyRate || 0) > 0 ? 'daily' : 'monthly')