From 405a4ec9f89dbe0c8d4945e104287572f7ab7009 Mon Sep 17 00:00:00 2001
From: lyzno1 <yuanyouhuilyz@gmail.com>
Date: Tue, 11 Nov 2025 15:26:25 +0800
Subject: [PATCH] feat: add URL parameter support for settings modal using
 action=showSettings

---
 .../header/account-setting/constants.ts       | 21 +++++++++++++++++++
 web/context/modal-context.tsx                 | 18 ++++++++++++++--
 2 files changed, 37 insertions(+), 2 deletions(-)
 create mode 100644 web/app/components/header/account-setting/constants.ts

diff --git a/web/app/components/header/account-setting/constants.ts b/web/app/components/header/account-setting/constants.ts
new file mode 100644
index 0000000000..2bf2f2eff5
--- /dev/null
+++ b/web/app/components/header/account-setting/constants.ts
@@ -0,0 +1,21 @@
+export const ACCOUNT_SETTING_MODAL_ACTION = 'showSettings'
+
+export const ACCOUNT_SETTING_TAB = {
+  PROVIDER: 'provider',
+  MEMBERS: 'members',
+  BILLING: 'billing',
+  DATA_SOURCE: 'data-source',
+  API_BASED_EXTENSION: 'api-based-extension',
+  CUSTOM: 'custom',
+  LANGUAGE: 'language',
+} as const
+
+export type AccountSettingTab = typeof ACCOUNT_SETTING_TAB[keyof typeof ACCOUNT_SETTING_TAB]
+
+export const DEFAULT_ACCOUNT_SETTING_TAB = ACCOUNT_SETTING_TAB.MEMBERS
+
+export const isValidAccountSettingTab = (tab: string | null): tab is AccountSettingTab => {
+  if (!tab)
+    return false
+  return Object.values(ACCOUNT_SETTING_TAB).includes(tab as AccountSettingTab)
+}
diff --git a/web/context/modal-context.tsx b/web/context/modal-context.tsx
index 708a951dde..1bbfb93e6c 100644
--- a/web/context/modal-context.tsx
+++ b/web/context/modal-context.tsx
@@ -15,6 +15,11 @@ import {
   EDUCATION_VERIFYING_LOCALSTORAGE_ITEM,
   SHOW_PRICING_MODAL_ACTION,
 } from '@/app/education-apply/constants'
+import {
+  ACCOUNT_SETTING_MODAL_ACTION,
+  DEFAULT_ACCOUNT_SETTING_TAB,
+  isValidAccountSettingTab,
+} from '@/app/components/header/account-setting/constants'
 import type { ModerationConfig, PromptVariable } from '@/models/debug'
 import type {
   ApiBasedExtension,
@@ -136,7 +141,16 @@ type ModalContextProviderProps = {
 export const ModalContextProvider = ({
   children,
 }: ModalContextProviderProps) => {
-  const [showAccountSettingModal, setShowAccountSettingModal] = useState<ModalState<string> | null>(null)
+  const searchParams = useSearchParams()
+
+  const [showAccountSettingModal, setShowAccountSettingModal] = useState<ModalState<string> | null>(() => {
+    if (searchParams.get('action') === ACCOUNT_SETTING_MODAL_ACTION) {
+      const tabParam = searchParams.get('tab')
+      const tab = isValidAccountSettingTab(tabParam) ? tabParam : DEFAULT_ACCOUNT_SETTING_TAB
+      return { payload: tab }
+    }
+    return null
+  })
   const [showApiBasedExtensionModal, setShowApiBasedExtensionModal] = useState<ModalState<ApiBasedExtension> | null>(null)
   const [showModerationSettingModal, setShowModerationSettingModal] = useState<ModalState<ModerationConfig> | null>(null)
   const [showExternalDataToolModal, setShowExternalDataToolModal] = useState<ModalState<ExternalDataTool> | null>(null)
@@ -151,7 +165,6 @@ export const ModalContextProvider = ({
   const [showUpdatePluginModal, setShowUpdatePluginModal] = useState<ModalState<UpdatePluginPayload> | null>(null)
   const [showEducationExpireNoticeModal, setShowEducationExpireNoticeModal] = useState<ModalState<ExpireNoticeModalPayloadProps> | null>(null)
 
-  const searchParams = useSearchParams()
   const [showPricingModal, setShowPricingModal] = useState(
     searchParams.get('action') === SHOW_PRICING_MODAL_ACTION,
   )
@@ -163,6 +176,7 @@ export const ModalContextProvider = ({
       localStorage.removeItem(EDUCATION_VERIFYING_LOCALSTORAGE_ITEM)
 
     removeSpecificQueryParam('action')
+    removeSpecificQueryParam('tab')
     setShowAccountSettingModal(null)
     if (showAccountSettingModal?.onCancelCallback)
       showAccountSettingModal?.onCancelCallback()