ui: lead with built-in wallet on native
This commit is contained in:
parent
a42e85202f
commit
4c603a8126
3 changed files with 46 additions and 8 deletions
|
|
@ -428,7 +428,7 @@ function MobileNav({
|
||||||
)}
|
)}
|
||||||
</span>
|
</span>
|
||||||
<span className={cn(
|
<span className={cn(
|
||||||
'block w-full truncate text-center text-[9px] xs:text-[10px] leading-tight tracking-wide uppercase transition-all',
|
'block w-full truncate text-center text-[10px] xs:text-[11px] leading-tight tracking-wide uppercase transition-all',
|
||||||
active ? 'font-extrabold' : 'font-semibold',
|
active ? 'font-extrabold' : 'font-semibold',
|
||||||
)}>
|
)}>
|
||||||
{tab.labelKey ? t(tab.labelKey) : tab.label}
|
{tab.labelKey ? t(tab.labelKey) : tab.label}
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,7 @@ import { useWallet } from '@/hooks/useWallet';
|
||||||
import { useToast } from '@/hooks/useToast';
|
import { useToast } from '@/hooks/useToast';
|
||||||
import { useIsMobile } from '@/hooks/useIsMobile';
|
import { useIsMobile } from '@/hooks/useIsMobile';
|
||||||
import { useTranslation } from '@/contexts/language';
|
import { useTranslation } from '@/contexts/language';
|
||||||
|
import { isNativePlatform } from '@/lib/platform';
|
||||||
import type { NWCConnection, NWCInfo } from '@/hooks/useNWC';
|
import type { NWCConnection, NWCInfo } from '@/hooks/useNWC';
|
||||||
import type { WebLNProvider } from "@webbtc/webln-types";
|
import type { WebLNProvider } from "@webbtc/webln-types";
|
||||||
|
|
||||||
|
|
@ -80,6 +81,7 @@ const WalletContent = forwardRef<HTMLDivElement, {
|
||||||
handleSetActive: (cs: string) => void;
|
handleSetActive: (cs: string) => void;
|
||||||
handleRemoveConnection: (cs: string) => void;
|
handleRemoveConnection: (cs: string) => void;
|
||||||
setAddDialogOpen: (open: boolean) => void;
|
setAddDialogOpen: (open: boolean) => void;
|
||||||
|
onSelectCashu: () => void;
|
||||||
}>(({
|
}>(({
|
||||||
webln,
|
webln,
|
||||||
connections,
|
connections,
|
||||||
|
|
@ -87,12 +89,33 @@ const WalletContent = forwardRef<HTMLDivElement, {
|
||||||
activeConnection,
|
activeConnection,
|
||||||
handleSetActive,
|
handleSetActive,
|
||||||
handleRemoveConnection,
|
handleRemoveConnection,
|
||||||
setAddDialogOpen
|
setAddDialogOpen,
|
||||||
|
onSelectCashu,
|
||||||
}, ref) => {
|
}, ref) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
return (
|
return (
|
||||||
<div className="space-y-4 sm:space-y-6 px-0 sm:px-4 pb-4" ref={ref}>
|
<div className="space-y-4 sm:space-y-6 px-0 sm:px-4 pb-4" ref={ref}>
|
||||||
{/* NWC First - Primary Option */}
|
{/* Native built-in wallet comes before external connection. */}
|
||||||
|
{isNativePlatform() && (
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={onSelectCashu}
|
||||||
|
className="flex w-full items-center gap-3 rounded-xl border border-orange-500/30 bg-orange-500/[0.06] p-4 text-left transition-colors hover:bg-orange-500/[0.12]"
|
||||||
|
>
|
||||||
|
<span className="flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-orange-500/15">
|
||||||
|
<Wallet className="h-5 w-5 text-orange-400" />
|
||||||
|
</span>
|
||||||
|
<span className="min-w-0 flex-1">
|
||||||
|
<span className="block text-sm font-bold text-white">{t('walletUi.cashu.title')}</span>
|
||||||
|
<span className="mt-0.5 block text-xs leading-relaxed text-muted-foreground">
|
||||||
|
{t('walletUi.cashu.desc')}
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
<span className="text-gray-500">›</span>
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* NWC - connect an existing wallet */}
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<h3 className="font-medium text-sm sm:text-base">{t('walletUi.modal.connectWallet')}</h3>
|
<h3 className="font-medium text-sm sm:text-base">{t('walletUi.modal.connectWallet')}</h3>
|
||||||
|
|
@ -266,6 +289,12 @@ export function WalletModal({ children, className }: WalletModalProps) {
|
||||||
handleSetActive,
|
handleSetActive,
|
||||||
handleRemoveConnection,
|
handleRemoveConnection,
|
||||||
setAddDialogOpen,
|
setAddDialogOpen,
|
||||||
|
onSelectCashu: () => {
|
||||||
|
setOpen(false);
|
||||||
|
window.setTimeout(() => {
|
||||||
|
document.getElementById('cashu-wallet')?.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||||
|
}, 120);
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const addWalletDialog = (
|
const addWalletDialog = (
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,7 @@ import { useWallet } from '@/hooks/useWallet';
|
||||||
import { useNWC } from '@/hooks/useNWCContext';
|
import { useNWC } from '@/hooks/useNWCContext';
|
||||||
import { useCurrentUser } from '@/hooks/useCurrentUser';
|
import { useCurrentUser } from '@/hooks/useCurrentUser';
|
||||||
import { useCashu } from '@/hooks/wallet/useCashu';
|
import { useCashu } from '@/hooks/wallet/useCashu';
|
||||||
|
import { isNativePlatform } from '@/lib/platform';
|
||||||
import { useTranslation } from '@/contexts/language';
|
import { useTranslation } from '@/contexts/language';
|
||||||
import { LoginArea } from '@/components/auth/LoginArea';
|
import { LoginArea } from '@/components/auth/LoginArea';
|
||||||
import { CashuWalletCard } from '@/components/wallet/CashuWalletCard';
|
import { CashuWalletCard } from '@/components/wallet/CashuWalletCard';
|
||||||
|
|
@ -224,11 +225,19 @@ export default function WalletPage() {
|
||||||
{/* Status bar + manage — compact single row */}
|
{/* Status bar + manage — compact single row */}
|
||||||
<WalletStatusBar />
|
<WalletStatusBar />
|
||||||
|
|
||||||
{/* Connected Lightning wallet (NIP-47) — balance / receive / send */}
|
{/* Native app: the built-in wallet is the primary path. Web keeps
|
||||||
<NwcWalletCard />
|
the connected-wallet card first because Cashu is app-only. */}
|
||||||
|
{isNativePlatform() ? (
|
||||||
{/* Cashu wallet — native app, self-custodial ecash */}
|
<>
|
||||||
<CashuWalletCard />
|
<div id="cashu-wallet"><CashuWalletCard /></div>
|
||||||
|
<NwcWalletCard />
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<NwcWalletCard />
|
||||||
|
<div id="cashu-wallet"><CashuWalletCard /></div>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
<EscrowKeyCard />
|
<EscrowKeyCard />
|
||||||
<EscrowSettingsCard />
|
<EscrowSettingsCard />
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue