wallet-using pages: show connect popup, render page content regardless

This commit is contained in:
dr-frmr 2024-08-13 20:05:31 +03:00
parent ba76e1fb40
commit 36a33f5108
No known key found for this signature in database
4 changed files with 31 additions and 13 deletions

View File

@ -53,6 +53,12 @@ function CommitDotOsName({
const enterOsNameProps = { name, setName, nameValidities, setNameValidities, triggerNameCheck }
useEffect(() => {
if (!address) {
openConnectModal?.();
}
}, [address, openConnectModal]);
let handleCommit = useCallback(async (e: FormEvent) => {
e.preventDefault()
e.stopPropagation()
@ -88,7 +94,7 @@ function CommitDotOsName({
return (
<div className="container fade-in">
<div className="section">
{Boolean(address) && (
{
<form className="form" onSubmit={handleCommit}>
{isPending || isConfirming ? (
<Loader msg={isConfirming ? 'Pre-committing to chosen ID...' : 'Please confirm the transaction in your wallet'} />
@ -121,7 +127,7 @@ function CommitDotOsName({
</p>
)}
</form>
)}
}
</div>
</div>
);

View File

@ -48,6 +48,12 @@ function MintCustom({
useEffect(() => setTriggerNameCheck(!triggerNameCheck), [address])
useEffect(() => {
if (!address) {
openConnectModal?.();
}
}, [address, openConnectModal]);
let handleMint = useCallback(async (e: FormEvent) => {
e.preventDefault()
e.stopPropagation()
@ -113,7 +119,7 @@ function MintCustom({
return (
<div className="container fade-in">
<div className="section">
{Boolean(address) && (
{
<form className="form" onSubmit={handleMint}>
{isPending || isConfirming ? (
<Loader msg={isConfirming ? 'Minting name...' : 'Please confirm the transaction in your wallet'} />
@ -136,7 +142,7 @@ function MintCustom({
</p>
)}
</form>
)}
}
</div>
</div>
);

View File

@ -44,6 +44,12 @@ function MintDotOsName({
useEffect(() => setTriggerNameCheck(!triggerNameCheck), [address])
useEffect(() => {
if (!address) {
openConnectModal?.();
}
}, [address, openConnectModal]);
let handleMint = useCallback(async (e: FormEvent) => {
e.preventDefault()
e.stopPropagation()
@ -107,7 +113,7 @@ function MintDotOsName({
return (
<div className="container fade-in">
<div className="section">
{Boolean(address) && (
{
<form className="form" onSubmit={handleMint}>
{isPending || isConfirming ? (
<Loader msg={isConfirming ? 'Minting .os name...' : 'Please confirm the transaction in your wallet'} />
@ -126,7 +132,7 @@ function MintDotOsName({
</p>
)}
</form>
)}
}
</div>
</div>
);

View File

@ -67,9 +67,11 @@ function ResetKnsName({
// so inputs will validate once wallet is connected
useEffect(() => setTriggerNameCheck(!triggerNameCheck), [address]); // eslint-disable-line react-hooks/exhaustive-deps
// TODO: separate this whole namechecking thing into helper function
// boolean to branch whether to check for occupied or to match against our_address.
useEffect(() => {
if (!address) {
openConnectModal?.();
}
}, [address, openConnectModal]);
const nameDebouncer = useRef<NodeJS.Timeout | null>(null);
useEffect(() => {
@ -152,8 +154,6 @@ function ResetKnsName({
return;
}
try {
const data = await generateNetworkingKeys({
direct,
@ -202,7 +202,7 @@ function ResetKnsName({
return (
<div className="container fade-in">
<div className="section">
{Boolean(address) && (
{
<form className="form" onSubmit={handleResetRecords}>
{isPending || isConfirming ? (
<Loader msg={isConfirming ? "Resetting Networking Information..." : "Please confirm the transaction in your wallet"} />
@ -230,7 +230,7 @@ function ResetKnsName({
</p>
)}
</form>
)}
}
</div>
</div>
);