ui: simplify wallet connection flow

src/components/WalletModal.tsx

@@ -68,13 +68,7 @@ const AddWalletContent = forwardRef<HTMLDivElement, {
 });
 AddWalletContent.displayName = 'AddWalletContent';
 
-// Recommended wallets for NWC
-const RECOMMENDED_WALLETS = [
-  { name: 'Alby', url: 'https://getalby.com', type: 'extension' },
-  { name: 'Minibits', url: 'https://www.minibits.cash', type: 'mobile' },
-  { name: 'Zeus', url: 'https://zeusln.com', type: 'mobile' },
-  { name: 'Coinos', url: 'https://coinos.io', type: 'web' },
-];
+
 
 // Extracted WalletContent to prevent re-renders
 const WalletContent = forwardRef<HTMLDivElement, {
@@ -101,11 +95,13 @@ const WalletContent = forwardRef<HTMLDivElement, {
     {/* NWC First - Primary Option */}
     <div className="space-y-3">
       <div className="flex items-center justify-between">
-        <h3 className="font-medium text-sm sm:text-base">Nostr Wallet Connect</h3>
+        <h3 className="font-medium text-sm sm:text-base">{t('walletUi.modal.connectWallet')}</h3>
+        {connections.length > 0 && (
           <Button size="sm" variant="outline" onClick={() => setAddDialogOpen(true)}>
             <Plus className="h-4 w-4 mr-1" />
             {t('walletUi.modal.addWallet')}
           </Button>
+        )}
       </div>
       
       {/* Connected Wallets List */}
@@ -166,7 +162,8 @@ const WalletContent = forwardRef<HTMLDivElement, {
 
     <Separator />
 
-    {/* WebLN - Secondary Option */}
+    {/* WebLN - show only when a provider is actually detected. */}
+    {webln && (
     <div className="space-y-2">
       <div className="flex items-center justify-between p-2 sm:p-3 border rounded-lg">
         <div className="flex items-center gap-2 sm:gap-3">
@@ -184,35 +181,19 @@ const WalletContent = forwardRef<HTMLDivElement, {
         </div>
       </div>
     </div>
+    )}
 
-    {/* Recommended Wallets - Show when no wallet connected */}
-    {!webln && connections.length === 0 && (
-      <>
-        <Separator />
-        <div className="space-y-3">
-          <h4 className="text-sm font-medium text-muted-foreground">{t('walletUi.modal.getNwcFrom')}</h4>
-          <div className="grid gap-2">
-            {RECOMMENDED_WALLETS.map((wallet) => (
+    <p className="text-[11px] leading-relaxed text-muted-foreground">
+      {t('walletUi.modal.nwcHelp')}{' '}
       <a
-                key={wallet.name}
-                href={wallet.url}
+        href="https://planb.academy/en/tutorials/wallet"
         target="_blank"
         rel="noopener noreferrer"
-                className="flex items-center justify-between p-2 border rounded-lg hover:bg-accent transition-colors"
+        className="text-orange-400 underline underline-offset-2 hover:text-orange-300"
       >
-                <div className="flex items-center gap-2">
-                  <Zap className="h-4 w-4 text-yellow-500" />
-                  <span className="text-sm font-medium">{wallet.name}</span>
-                </div>
-                <Badge variant="outline" className="text-[10px]">
-                  {wallet.type}
-                </Badge>
+        {t('walletUi.page.learnPlanB')}
       </a>
-            ))}
-          </div>
-        </div>
-      </>
-    )}
+    </p>
   </div>
   );
 });

src/i18n/en.ts

@@ -5874,6 +5874,7 @@ walletUi: {
       ready: 'Ready',
       notFound: 'Not Found',
       getNwcFrom: 'Get NWC from:',
+      nwcHelp: 'Open your wallet’s Nostr Wallet Connect settings, create a connection, and paste the link here.',
       connectionRequired: 'Connection URI required',
       connectionRequiredDesc: 'Please enter a valid NWC connection URI.',
       activeChanged: 'Active wallet changed',

src/i18n/es.ts

@@ -5874,6 +5874,7 @@ walletUi: {
       ready: 'Lista',
       notFound: 'No encontrada',
       getNwcFrom: 'Consigue NWC en:',
+      nwcHelp: 'Abre los ajustes de Nostr Wallet Connect de tu cartera, crea una conexión y pega el enlace aquí.',
       connectionRequired: 'URI de conexión obligatoria',
       connectionRequiredDesc: 'Introduce una URI de conexión NWC válida.',
       activeChanged: 'Cartera activa cambiada',

src/pages/WalletPage.tsx

@@ -93,49 +93,17 @@ function StatusPill({
 
 function GetAWallet() {
   const { t } = useTranslation();
-  const [open, setOpen] = useState(false);
-
-  const wallets = [
-    { name: 'Minibits', desc: t('walletUi.page.walletMinibits'), url: 'https://www.minibits.cash', color: 'text-orange-400' },
-    { name: 'Alby', desc: t('walletUi.page.walletAlby'), url: 'https://getalby.com', color: 'text-yellow-400' },
-    { name: 'Zeus', desc: t('walletUi.page.walletZeus'), url: 'https://zeusln.com', color: 'text-blue-400' },
-    { name: 'Coinos', desc: t('walletUi.page.walletCoinos'), url: 'https://coinos.io', color: 'text-green-400' },
-  ];
 
   return (
     <div className="rounded-2xl border border-white/8 overflow-hidden">
-      <button
-        onClick={() => setOpen((v) => !v)}
-        className="w-full flex items-center justify-between px-4 py-3.5 bg-white/3 hover:bg-white/5 transition-all"
-      >
-        <div className="flex items-center gap-2">
+      <div className="flex items-center gap-2 px-4 py-3.5 bg-white/3">
         <Zap className="h-4 w-4 text-yellow-400" />
         <span className="text-sm font-black uppercase tracking-wide text-white">{t('walletUi.page.getAWallet')}</span>
       </div>
-        {open
-          ? <ChevronUp className="h-4 w-4 text-muted-foreground" />
-          : <ChevronDown className="h-4 w-4 text-muted-foreground" />
-        }
-      </button>
-
-      {open && (
-        <div className="divide-y divide-white/5">
-          {wallets.map((w) => (
-            <a
-              key={w.name}
-              href={w.url}
-              target="_blank"
-              rel="noopener noreferrer"
-              className="flex items-center justify-between px-4 py-3 hover:bg-white/5 active:scale-[0.99] transition-all"
-            >
-              <div className="min-w-0">
-                <p className={cn('font-bold text-sm', w.color)}>{w.name}</p>
-                <p className="text-xs text-muted-foreground">{w.desc}</p>
-              </div>
-              <ExternalLink className="h-3.5 w-3.5 text-muted-foreground flex-shrink-0" />
-            </a>
-          ))}
-          <div className="px-4 py-3">
+      <div className="space-y-2 px-4 py-3">
+        <p className="text-xs leading-relaxed text-muted-foreground">
+          {t('walletUi.modal.nwcHelp')}
+        </p>
         <a
           href="https://planb.academy/en/tutorials/wallet"
           target="_blank"
@@ -147,8 +115,6 @@ function GetAWallet() {
         </a>
       </div>
     </div>
-      )}
-    </div>
   );
 }