Next.js <Redirect />

import { useRouter } from 'next/router'
 
interface RedirectProps {
  to: string
  replace?: boolean
}
 
const Redirect: React.FC<RedirectProps> = ({ to, replace }) => {
  const router = useRouter()
 
  useEffect(() => {
    router[replace ? 'replace' : 'push'](to)
  }, [to, replace])
 
  return null
}

import { useRouter } from 'next/router'
 
const Redirect = ({ to, replace }) => {
  const router = useRouter()
 
  useEffect(() => {
    router[replace ? 'replace' : 'push'](to)
  }, [to, replace])
 
  return null
}

const Example = () => {
  // Get authentication state from somewhere
  const { loggedIn } = useAuth()
 
  if (!loggedIn) return <Redirect to="/login" />
 
  return <ProtectedContent />
}

const Example = () => {
  // Get authentication state from somewhere
  const { loggedIn } = useAuth()
 
  if (!loggedIn) return <Redirect to="/login" />
 
  return <ProtectedContent />
}