From e228d999dd3ee62a7c21838dd101a2407f3108fa Mon Sep 17 00:00:00 2001
From: h <h@kotikot.com>
Date: Mon, 19 Oct 2026 05:46:50 +0000
Subject: [PATCH] fix(frontend): account phone stored with a plus is not shown
 with two

---
 frontend/src/lib/components/profile/ProfileInfo.svelte  | 3 ++-
 frontend/src/lib/components/profile/ProfilePanel.svelte | 4 ++--
 frontend/src/lib/components/settings/MyAccount.svelte   | 4 ++--
 frontend/src/lib/format/peer.ts                         | 4 ++++
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lib/components/profile/ProfileInfo.svelte b/frontend/src/lib/components/profile/ProfileInfo.svelte
index 44b2e74..0f7185e 100644
--- a/frontend/src/lib/components/profile/ProfileInfo.svelte
+++ b/frontend/src/lib/components/profile/ProfileInfo.svelte
@@ -18,6 +18,7 @@
   import ProfileSection from "#lib/components/profile/ProfileSection.svelte";
   import Icon from "#lib/components/ui/Icon.svelte";
   import { formatDate, formatFull } from "#lib/format/datetime.js";
+  import { formatPhone } from "#lib/format/peer.js";
   import { t } from "#lib/i18n/locale.svelte.js";
   import { accounts } from "#lib/stores/accounts.svelte.js";
   import { peers } from "#lib/stores/peers.svelte.js";
@@ -56,7 +57,7 @@
       result.push({
         icon: "phone",
         label: t("profile.phone"),
-        value: `+${peer.phone}`,
+        value: formatPhone(peer.phone),
       });
     }
     if (peer?.username) {
diff --git a/frontend/src/lib/components/profile/ProfilePanel.svelte b/frontend/src/lib/components/profile/ProfilePanel.svelte
index f695113..915707f 100644
--- a/frontend/src/lib/components/profile/ProfilePanel.svelte
+++ b/frontend/src/lib/components/profile/ProfilePanel.svelte
@@ -9,7 +9,7 @@
   import Avatar from "#lib/components/ui/Avatar.svelte";
   import EmptyState from "#lib/components/ui/EmptyState.svelte";
   import Icon from "#lib/components/ui/Icon.svelte";
-  import { peerName } from "#lib/format/peer.js";
+  import { formatPhone, peerName } from "#lib/format/peer.js";
   import { t } from "#lib/i18n/locale.svelte.js";
   import type { MessageKey } from "#lib/i18n/messages.js";
   import { accounts } from "#lib/stores/accounts.svelte.js";
@@ -73,7 +73,7 @@
       if (peer?.username) {
         return `@${peer.username}`;
       }
-      return peer?.phone ? `+${peer.phone}` : `ID ${targetId}`;
+      return peer?.phone ? formatPhone(peer.phone) : `ID ${targetId}`;
     }
     const count = chat?.message_count ?? 0;
     return count > 0 ? t("profile.messages", { count }) : t("profile.group");
diff --git a/frontend/src/lib/components/settings/MyAccount.svelte b/frontend/src/lib/components/settings/MyAccount.svelte
index 663004b..e461f70 100644
--- a/frontend/src/lib/components/settings/MyAccount.svelte
+++ b/frontend/src/lib/components/settings/MyAccount.svelte
@@ -7,7 +7,7 @@
   import SettingsItem from "#lib/components/settings/SettingsItem.svelte";
   import Button from "#lib/components/ui/Button.svelte";
   import Icon from "#lib/components/ui/Icon.svelte";
-  import { accountName } from "#lib/format/peer.js";
+  import { accountName, formatPhone } from "#lib/format/peer.js";
   import { t } from "#lib/i18n/locale.svelte.js";
   import { accounts } from "#lib/stores/accounts.svelte.js";
 
@@ -78,7 +78,7 @@
       <AccountAvatar account={current} size={5} />
       <div class="name">{accountName(current)}</div>
       {#if current.phone}
-        <div class="phone">+{current.phone}</div>
+        <div class="phone">{formatPhone(current.phone)}</div>
       {/if}
       {#if !current.is_active}
         <div class="inactive">{t("account.inactive")}</div>
diff --git a/frontend/src/lib/format/peer.ts b/frontend/src/lib/format/peer.ts
index 72df974..364db07 100644
--- a/frontend/src/lib/format/peer.ts
+++ b/frontend/src/lib/format/peer.ts
@@ -47,3 +47,7 @@ export function initials(name: string): string {
   const last = lastWord ? lastWord[0] : "";
   return (first + last).toUpperCase();
 }
+
+export function formatPhone(phone: string): string {
+  return phone.startsWith("+") ? phone : `+${phone}`;
+}