fix: correct 'Manage API Keys' link from /pair success screen

- Profile page now reads ?tab= query param to open Settings tab directly
- Settings container reads ?subtab= query param to open API Keys directly
- /pair success link updated to /profile?tab=settings&subtab=api-keys (was /profile/settings?tab=api-keys which 404'd)
This commit is contained in:
2026-06-28 22:19:51 +08:00
parent 02553445b1
commit 763114df6f
3 changed files with 16 additions and 3 deletions
@@ -1,6 +1,7 @@
"use client"
import { useState, useEffect } from "react"
import { useSearchParams } from "next/navigation"
import { User, Shield, Link as LinkIcon, Key } from "lucide-react"
import { SettingsProfileTab } from "@/components/profile/settings-profile-tab"
import { SettingsSecurityTab } from "@/components/profile/settings-security-tab"
@@ -16,6 +17,8 @@ interface AuthMethods {
type SettingsSubTab = "profile" | "security" | "accounts" | "api-keys"
const VALID_SUBTABS: SettingsSubTab[] = ["profile", "security", "accounts", "api-keys"]
const subTabs: { id: SettingsSubTab; label: string; icon: typeof User }[] = [
{ id: "profile", label: "Profile", icon: User },
{ id: "security", label: "Security", icon: Shield },
@@ -42,7 +45,12 @@ export function SettingsContainer({
userId,
onImageChange,
}: SettingsContainerProps) {
const [activeSubTab, setActiveSubTab] = useState<SettingsSubTab>("profile")
const [activeSubTab, setActiveSubTab] = useState<SettingsSubTab>(() => {
if (typeof window === "undefined") return "profile"
const params = new URLSearchParams(window.location.search)
const sub = params.get("subtab")
return sub && VALID_SUBTABS.includes(sub as SettingsSubTab) ? (sub as SettingsSubTab) : "profile"
})
const [authMethods, setAuthMethods] = useState<AuthMethods | null>(null)
const [isLoadingAuthMethods, setIsLoadingAuthMethods] = useState(true)