Displaying users's rank in leaderboard is null if user hasn't popped balloons

[SimonStnn]

pop-a-loon/src/popup/components/Leaderboard.tsx

Lines 63 to 81 in 1062848

	const Caption = () => {
	if (isLoading) {
	return <TextSkeleton className="w-16" />;
	}
	if (data.rank === null && data.user.username === undefined) {
	return (
	<p className="text-balance">
	Set your username in{' '}
	<Button variant={'link'} className="h-fit p-0 font-normal" asChild>
	<Link to="/settings">settings</Link>
	</Button>{' '}
	to view your position on the leaderboard.
	</p>
	);
	}
	return <p>You are #{data.rank}!</p>;
	};

In this caption component there should be another check that checks if the user's count is 0 or if the rank is null. It it is it should return "Start popping to view your position on the leaderboard.".