fix: replace Link with anchor tags for Logto auth routes
Next.js <Link> components prefetch routes on render/hover. When used for /api/logto/sign-out, this triggered the sign-out handler during normal navigation, clearing the session cookie and causing auth loops. Also: wrap getAuthenticatedUser with React cache() for deduplication, clean up diagnostic logging. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
9933c3678e
commit
89b3dada4a
4 changed files with 9 additions and 9 deletions
|
|
@ -1,6 +1,5 @@
|
|||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
export default function AuthPage() {
|
||||
|
|
@ -11,12 +10,12 @@ export default function AuthPage() {
|
|||
<div className="text-center space-y-6 p-8">
|
||||
<h1 className="text-3xl font-bold text-[#1A1A1A]">{t("app.name")}</h1>
|
||||
<p className="text-[#6B6B6B]">{t("auth.subtitle")}</p>
|
||||
<Link
|
||||
<a
|
||||
href="/api/logto/sign-in"
|
||||
className="inline-block px-6 py-3 bg-[#4A90A4] text-white rounded-lg font-medium hover:bg-[#3A7389] transition-colors"
|
||||
>
|
||||
{t("auth.signIn")}
|
||||
</Link>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -48,14 +48,14 @@ export function Header({ userName }: HeaderProps) {
|
|||
<div className="px-3 py-2 text-xs text-foreground/50 truncate">
|
||||
{userName}
|
||||
</div>
|
||||
<Link
|
||||
<a
|
||||
href="/api/logto/sign-out"
|
||||
className="flex items-center gap-2 px-3 py-2 text-sm text-rouge hover:bg-rouge/10 transition-colors"
|
||||
onClick={() => setMenuOpen(false)}
|
||||
>
|
||||
<LogOut size={14} />
|
||||
{t("auth.signOut")}
|
||||
</Link>
|
||||
</a>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -137,13 +137,13 @@ export function Sidebar({ lists, tags }: SidebarProps) {
|
|||
|
||||
{/* Sign out */}
|
||||
<div className="p-4 border-t border-border-light dark:border-border-dark">
|
||||
<Link
|
||||
<a
|
||||
href="/api/logto/sign-out"
|
||||
className="flex items-center gap-2 text-sm text-foreground/60 hover:text-rouge transition-colors"
|
||||
>
|
||||
<LogOut size={16} />
|
||||
{t("auth.signOut")}
|
||||
</Link>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import { cache } from 'react';
|
||||
import { getLogtoContext } from '@logto/next/server-actions';
|
||||
import { logtoConfig } from './logto';
|
||||
|
||||
export async function getAuthenticatedUser() {
|
||||
export const getAuthenticatedUser = cache(async () => {
|
||||
try {
|
||||
const context = await getLogtoContext(logtoConfig);
|
||||
|
||||
|
|
@ -18,4 +19,4 @@ export async function getAuthenticatedUser() {
|
|||
console.error('[auth] getLogtoContext error:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue