diff --git a/src/components/dashboard/SubscriptionCardExpired.tsx b/src/components/dashboard/SubscriptionCardExpired.tsx index 361e727..4709ded 100644 --- a/src/components/dashboard/SubscriptionCardExpired.tsx +++ b/src/components/dashboard/SubscriptionCardExpired.tsx @@ -228,7 +228,11 @@ export default function SubscriptionCardExpired({ >
- {user?.first_name || user?.username || `#${user?.telegram_id}`} -
+{displayName(user)}
@{user?.username || `ID: ${user?.telegram_id}`}
diff --git a/src/locales/ru.json b/src/locales/ru.json index 22b67af..be768f7 100644 --- a/src/locales/ru.json +++ b/src/locales/ru.json @@ -285,6 +285,7 @@ "traffic": "Трафик", "devices": "Устройства", "expiredDate": "Истекла", + "expiredDate_trial": "Истёк", "activeUntil": "Активна до" }, "suspended": { diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx index b04cde4..66ae194 100644 --- a/src/pages/Dashboard.tsx +++ b/src/pages/Dashboard.tsx @@ -3,6 +3,7 @@ import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'; import { Link, useNavigate } from 'react-router'; import { useTranslation } from 'react-i18next'; import { useAuthStore } from '../store/auth'; +import { displayName } from '../utils/displayName'; import { useBlockingStore } from '../store/blocking'; import { subscriptionApi } from '../api/subscription'; import { referralApi } from '../api/referral'; @@ -254,7 +255,7 @@ export default function Dashboard() { {/* Header */}{t('dashboard.yourSubscription')}
diff --git a/src/utils/displayName.ts b/src/utils/displayName.ts new file mode 100644 index 0000000..d79412f --- /dev/null +++ b/src/utils/displayName.ts @@ -0,0 +1,23 @@ +/** + * Composes a user-facing display name from first_name + last_name with sensible fallbacks. + * + * Why: single-letter first_name (e.g., "О") looked confusing alone ("Добро пожаловать, О!"). + * Combining with last_name makes truncated/short first names readable. + */ +export interface NameSource { + first_name?: string | null; + last_name?: string | null; + username?: string | null; + telegram_id?: number | null; +} + +export function displayName(user?: NameSource | null): string { + if (!user) return ''; + const fullName = [user.first_name, user.last_name] + .filter((part): part is string => Boolean(part && part.trim())) + .join(' '); + if (fullName) return fullName; + if (user.username) return user.username; + if (user.telegram_id) return `#${user.telegram_id}`; + return ''; +}