Coditionally render download button in react

I have a download button from which the user can download the assets. but I want only authenticated users can download. If the user is not authenticated and click on the download button I want to show them a modal with a login button on it. I have a modal component. I am using React.
Please help me.

Getting current authenticated user from the firebase.

const {currentUser} = useAuth();

This is my code for the download button.

<a className="bg-secondary text-white font-bold py-3 px-5 rounded text-2xl focus:outline-none mt-3 block w-48" href="YOUR_URL"><i className="animate-bounce fas fa-arrow-down mr-2"></i>Download</a>

Source: React Router Questions