From d7f7bc7c173817812193aa00b5b2215d2c87159b Mon Sep 17 00:00:00 2001
From: c0mrade <killmy666@gmail.com>
Date: Wed, 10 Jun 2026 16:44:46 +0300
Subject: [PATCH] fix(cabinet): Lava top-up return route + Telegram-unavailable
 card overflow
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Lava returns to a path-based result URL (/balance/top-up/result/:method) because Lava
  Business rejects query strings in success/fail URLs. Add the route and read the method
  from the path param as a fallback (alongside ?method=) so external-browser redirects
  still poll the right payment. Pairs with the backend fix.
- ConnectedAccounts: the "Привязка Telegram временно недоступна" message overflowed the
  card (it sat in the non-shrinking action column and never wrapped). Constrain its width
  and wrap it (max-w + break-words) so it stays inside the card. Verified by rendering.

Both reported in the Bedolaga bug topic.
---
 src/App.tsx                     | 12 ++++++++++++
 src/pages/ConnectedAccounts.tsx |  8 +++++---
 src/pages/TopUpResult.tsx       |  9 ++++++---
 3 files changed, 23 insertions(+), 6 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 6c47968..e4fda6f 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -408,6 +408,18 @@ function App() {
             </ProtectedRoute>
           }
         />
+        {/* Path-based method variant: some providers (Lava) reject return URLs that carry a
+            query string, so the method is encoded in the path instead of ?method=. */}
+        <Route
+          path="/balance/top-up/result/:method"
+          element={
+            <ProtectedRoute withLayout={false}>
+              <LazyPage>
+                <TopUpResult />
+              </LazyPage>
+            </ProtectedRoute>
+          }
+        />
         <Route
           path="/balance/top-up/:methodId"
           element={
diff --git a/src/pages/ConnectedAccounts.tsx b/src/pages/ConnectedAccounts.tsx
index d6131aa..9270f87 100644
--- a/src/pages/ConnectedAccounts.tsx
+++ b/src/pages/ConnectedAccounts.tsx
@@ -240,13 +240,15 @@ function TelegramLinkWidget() {
   // Script failed to load - show unavailable message with bot link
   if (scriptFailed) {
     return (
-      <div className="flex flex-col items-center gap-1.5">
-        <p className="text-xs text-dark-400">{t('profile.accounts.telegramLinkUnavailable')}</p>
+      <div className="flex max-w-[200px] flex-col items-center gap-1.5">
+        <p className="break-words text-center text-xs text-dark-400">
+          {t('profile.accounts.telegramLinkUnavailable')}
+        </p>
         <a
           href={`https://t.me/${botUsername}`}
           target="_blank"
           rel="noopener noreferrer"
-          className="text-sm text-accent-400 transition-colors hover:text-accent-300"
+          className="break-all text-sm text-accent-400 transition-colors hover:text-accent-300"
         >
           @{botUsername}
         </a>
diff --git a/src/pages/TopUpResult.tsx b/src/pages/TopUpResult.tsx
index 63c6c7f..0581c2f 100644
--- a/src/pages/TopUpResult.tsx
+++ b/src/pages/TopUpResult.tsx
@@ -1,5 +1,5 @@
 import { useState, useCallback, useRef, useEffect } from 'react';
-import { useNavigate, useSearchParams } from 'react-router';
+import { useNavigate, useParams, useSearchParams } from 'react-router';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useTranslation } from 'react-i18next';
 import { motion } from 'framer-motion';
@@ -194,8 +194,11 @@ export default function TopUpResult() {
   // Load saved payment info from sessionStorage (once on mount)
   const [pendingInfo] = useState(() => loadTopUpPendingInfo());
 
-  // Fallback: read method from query params (for external browser redirects where sessionStorage is unavailable)
-  const methodFromUrl = searchParams.get('method');
+  // Fallback: read method for external-browser redirects where sessionStorage is unavailable.
+  // Providers that reject query strings (Lava) return to /balance/top-up/result/<method>, so
+  // accept the method from the path param too, not just ?method=.
+  const { method: methodFromPath } = useParams<{ method?: string }>();
+  const methodFromUrl = searchParams.get('method') || methodFromPath || null;
 
   // Detect if user arrived via redirect with success param (no polling needed)
   const redirectStatus = searchParams.get('status') || searchParams.get('payment');