From f049bafcc346a014a13bdc3ee4c17114119b6ad7 Mon Sep 17 00:00:00 2001 From: yyh Date: Thu, 5 Mar 2026 20:25:29 +0800 Subject: [PATCH] refactor: simplify Jotai atoms by removing redundant write-only atoms Replace 2 write-only derived atoms with primitive atom's built-in updater functions. The selectAtom on the read side already prevents unnecessary re-renders, making the manual guard logic redundant. --- .../model-provider-page/atoms.ts | 65 +++++-------------- 1 file changed, 18 insertions(+), 47 deletions(-) diff --git a/web/app/components/header/account-setting/model-provider-page/atoms.ts b/web/app/components/header/account-setting/model-provider-page/atoms.ts index d0f5a3b3e3..66737c5eb2 100644 --- a/web/app/components/header/account-setting/model-provider-page/atoms.ts +++ b/web/app/components/header/account-setting/model-provider-page/atoms.ts @@ -2,63 +2,34 @@ import { atom, useAtomValue, useSetAtom } from 'jotai' import { selectAtom } from 'jotai/utils' import { useCallback, useMemo } from 'react' -const modelProviderListExpandedAtom = atom>({}) - -const setModelProviderListExpandedAtom = atom( - null, - (get, set, params: { providerName: string, expanded: boolean }) => { - const { providerName, expanded } = params - const current = get(modelProviderListExpandedAtom) - - if (expanded) { - if (current[providerName]) - return - - set(modelProviderListExpandedAtom, { - ...current, - [providerName]: true, - }) - return - } - - if (!current[providerName]) - return - - const next = { ...current } - delete next[providerName] - set(modelProviderListExpandedAtom, next) - }, -) - -const resetModelProviderListExpandedAtom = atom( - null, - (_get, set) => { - set(modelProviderListExpandedAtom, {}) - }, -) +const expandedAtom = atom>({}) export function useModelProviderListExpanded(providerName: string) { - const selectedAtom = useMemo( - () => selectAtom(modelProviderListExpandedAtom, state => state[providerName] ?? false), - [providerName], + return useAtomValue( + useMemo( + () => selectAtom(expandedAtom, s => !!s[providerName]), + [providerName], + ), ) - return useAtomValue(selectedAtom) } export function useSetModelProviderListExpanded(providerName: string) { - const setExpanded = useSetAtom(setModelProviderListExpandedAtom) - return useCallback((expanded: boolean) => { - setExpanded({ providerName, expanded }) - }, [providerName, setExpanded]) + const set = useSetAtom(expandedAtom) + return useCallback( + (expanded: boolean) => set(prev => ({ ...prev, [providerName]: expanded })), + [providerName, set], + ) } export function useExpandModelProviderList() { - const setExpanded = useSetAtom(setModelProviderListExpandedAtom) - return useCallback((providerName: string) => { - setExpanded({ providerName, expanded: true }) - }, [setExpanded]) + const set = useSetAtom(expandedAtom) + return useCallback( + (providerName: string) => set(prev => ({ ...prev, [providerName]: true })), + [set], + ) } export function useResetModelProviderListExpanded() { - return useSetAtom(resetModelProviderListExpandedAtom) + const set = useSetAtom(expandedAtom) + return useCallback(() => set({}), [set]) }