Does anyone have a fix for this if-else won't work in run build, but will in run dev. The only way to make this work is to use a react hook but I don't have the slightest idea of which one and where to implement it.
import { useAddress } from "@thirdweb-dev/react";
import Head from 'next/head';
import Link from 'next/link';
import Username from '../components/Username';
import React from "react";
const Home = () => {
let p = new Promise((resolve, reject) => {
let address = useAddress();
if (address) {
resolve(address)
} else {
console.log('no addy')
reject()
}
})
p.then((address) => {
return (
<>
<Head>
<title>DRUMM3R</title>
<link rel="icon" href="/drum.svg" />
</Head>
<Username address={address} />
</>
);
}).catch(() => {
return (
<>
<Head>
<title>DRUMM3R</title>
<link rel="icon" href="/drum.svg" />
</Head>
<Link href="/">
<a className="absolute pt-1 text-xl font-semibold transform -translate-x-1/2 top-1/2 left-1/2">click here to log in</a>
</Link>
</>
);
})
}
export default Home;Why don't you try this solution:
import { useEffect, useState } from "react"
const Home = () => {
const [address, setAddress] = useState(null)
useEffect(() => {
const address = useAddress()
setAddress(address)
}, [])
if (address) {
return (
<>
<Head>
<title>DRUMM3R</title>
<link rel="icon" href="/drum.svg" />
</Head>
<Username address={address} />
</>
)
}
return (
<>
<Head>
<title>DRUMM3R</title>
<link rel="icon" href="/drum.svg" />
</Head>
<Link href="/">
<a
className="absolute pt-1 text-xl font-semibold transform -
translate-x-1/2 top-1/2 left-1/2"
>
click here to log in
</a>
</Link>
</>
)
}
import { useAddress } from "@thirdweb-dev/react";
import Head from "next/head";
import Link from "next/link";
import Username from "../components/Username";
import React from "react";
const Home = () => {
const address = useAddress();
const content = address ? (
<Username address={address} />
) : (
<Link href="/">
<a className="absolute pt-1 text-xl font-semibold transform -translate-x-1/2 top-1/2 left-1/2">
click here to log in
</a>
</Link>
);
return (
<>
<Head>
<title>DRUMM3R</title>
<link rel="icon" href="/drum.svg" />
</Head>
{content}
</>
);
};
export default Home;