gmakstutis/ragflow
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor: useSyncThemeFromParams hook manages theme state based on URL parameters, replacing direct usage of useTheme and achieve code reuse.

Browse source
This commit is contained in:
Your Name 2025-11-28 10:57:43 +00:00
parent db8e1b03f3
commit 05c8e1a9e5
3 changed files with 14 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
web/src/components/theme-provider.tsx
View file

@ -71,3 +71,13 @@ export function useSwitchToDarkThemeOnMount() {
setTheme(ThemeEnum.Dark);
}, [setTheme]);
}
export function useSyncThemeFromParams(theme: string | null) {
const { setTheme } = useTheme();
useEffect(() => {
if (theme && (theme === ThemeEnum.Light || theme === ThemeEnum.Dark)) {
setTheme(theme as ThemeEnum);
}
}, [theme, setTheme]);
}

11
web/src/pages/agent/share/index.tsx
View file

@ -4,9 +4,8 @@ import { NextMessageInput } from '@/components/message-input/next';
import MessageItem from '@/components/next-message-item';
import PdfDrawer from '@/components/pdf-drawer';
import { useClickDrawer } from '@/components/pdf-drawer/hooks';
import { useTheme } from '@/components/theme-provider';
import { useSyncThemeFromParams } from '@/components/theme-provider';
import { MessageType } from '@/constants/chat';
import { ThemeEnum } from '@/constants/common';
import { useUploadCanvasFileWithProgress } from '@/hooks/use-agent-request';
import { cn } from '@/lib/utils';
import i18n from '@/locales/config';
@ -30,7 +29,7 @@ const ChatContainer = () => {
theme,
visibleAvatar,
} = useGetSharedChatSearchParams();
const { setTheme } = useTheme();
useSyncThemeFromParams(theme);
const { visible, hideModal, documentId, selectedChunk, clickDocumentButton } =
useClickDrawer();
@ -93,12 +92,6 @@ const ChatContainer = () => {
}
}, [locale, visibleAvatar]);
React.useEffect(() => {
if (theme && (theme === ThemeEnum.Light || theme === ThemeEnum.Dark)) {
setTheme(theme as ThemeEnum);
}
}, [theme, setTheme]);
React.useEffect(() => {
if (!isTaskMode && inputsData.prologue) {
addNewestOneAnswer({

11
web/src/pages/next-chats/share/index.tsx
View file

@ -3,9 +3,8 @@ import { NextMessageInput } from '@/components/message-input/next';
import MessageItem from '@/components/message-item';
import PdfDrawer from '@/components/pdf-drawer';
import { useClickDrawer } from '@/components/pdf-drawer/hooks';
import { useTheme } from '@/components/theme-provider';
import { useSyncThemeFromParams } from '@/components/theme-provider';
import { MessageType, SharedFrom } from '@/constants/chat';
import { ThemeEnum } from '@/constants/common';
import { useFetchNextConversationSSE } from '@/hooks/chat-hooks';
import { useFetchFlowSSE } from '@/hooks/flow-hooks';
import { useFetchExternalChatInfo } from '@/hooks/use-chat-request';
@ -27,7 +26,7 @@ const ChatContainer = () => {
theme,
visibleAvatar,
} = useGetSharedChatSearchParams();
const { setTheme } = useTheme();
useSyncThemeFromParams(theme);
const { visible, hideModal, documentId, selectedChunk, clickDocumentButton } =
useClickDrawer();
@ -57,12 +56,6 @@ const ChatContainer = () => {
}
}, [locale, visibleAvatar]);
React.useEffect(() => {
if (theme && (theme === ThemeEnum.Light || theme === ThemeEnum.Dark)) {
setTheme(theme as ThemeEnum);
}
}, [theme, setTheme]);
const { data: avatarData } = useFetchAvatar();
if (!conversationId) {