39 lines
1.0 KiB
TypeScript
39 lines
1.0 KiB
TypeScript
import { useNostrConnect } from '@/hooks/useNostrConnect'
|
|
import { ConnectedUserMenu } from './ConnectedUserMenu'
|
|
|
|
function ConnectForm({ onConnect, loading, error }: {
|
|
onConnect: () => void
|
|
loading: boolean
|
|
error: string | null
|
|
}) {
|
|
return (
|
|
<div className="flex flex-col gap-2">
|
|
<button
|
|
onClick={onConnect}
|
|
disabled={loading}
|
|
className="px-6 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg font-medium transition-colors disabled:opacity-50"
|
|
>
|
|
{loading ? 'Connecting...' : 'Connect with Nostr'}
|
|
</button>
|
|
{error && <p className="text-sm text-red-600">{error}</p>}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export function ConnectButton() {
|
|
const { connected, pubkey, profile, loading, error, connect, disconnect } = useNostrConnect()
|
|
|
|
if (connected && pubkey) {
|
|
return (
|
|
<ConnectedUserMenu
|
|
pubkey={pubkey}
|
|
profile={profile}
|
|
onDisconnect={disconnect}
|
|
loading={loading}
|
|
/>
|
|
)
|
|
}
|
|
|
|
return <ConnectForm onConnect={connect} loading={loading} error={error} />
|
|
}
|