mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-17 00:40:14 +01:00
♻️ refactor: Logout UX, Improved State Teardown, & Remove Unused Code (#5292)
* refactor: SearchBar and Nav components to streamline search functionality and improve state management * refactor: remove refresh conversations * chore: update useNewConvo calls to remove hardcoded default index * refactor: null check for submission in useSSE hook * refactor: remove useConversation hook and update useSearch to utilize useNewConvo * refactor: remove conversation and banner store files; consolidate state management into misc; improve typing of families and add messagesSiblingIdxFamily * refactor: more effectively clear all user/convo state without side effects on logout/delete user * refactor: replace useParams with useLocation in SearchBar to correctly load conversation * refactor: update SearchButtons to use button element and improve conversation ID handling * refactor: use named function for `newConversation` for better call stack tracing * refactor: enhance TermsAndConditionsModal to support array content and improve type definitions for terms of service * refactor: add SetConvoProvider and message invalidation when navigating from search results to prevent initial route rendering edge cases * refactor: rename getLocalStorageItems to localStorage and update imports for consistency * refactor: move clearLocalStorage function to utils and simplify localStorage clearing logic * refactor: migrate authentication mutations to a dedicated Auth data provider and update related tests
This commit is contained in:
parent
24beda3d69
commit
aa80e4594e
45 changed files with 378 additions and 434 deletions
|
|
@ -1,30 +1,35 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import { Outlet, useNavigate } from 'react-router-dom';
|
||||
import { useGetStartupConfig } from 'librechat-data-provider/react-query';
|
||||
import { useUserTermsQuery } from '~/data-provider';
|
||||
|
||||
import type { ContextType } from '~/common';
|
||||
import { AgentsMapContext, AssistantsMapContext, FileMapContext, SearchContext } from '~/Providers';
|
||||
import {
|
||||
AgentsMapContext,
|
||||
AssistantsMapContext,
|
||||
FileMapContext,
|
||||
SearchContext,
|
||||
SetConvoProvider,
|
||||
} from '~/Providers';
|
||||
import { useAuthContext, useAssistantsMap, useAgentsMap, useFileMap, useSearch } from '~/hooks';
|
||||
import { Nav, MobileNav } from '~/components/Nav';
|
||||
import TermsAndConditionsModal from '~/components/ui/TermsAndConditionsModal';
|
||||
import { useUserTermsQuery } from '~/data-provider';
|
||||
import { Nav, MobileNav } from '~/components/Nav';
|
||||
import { Banner } from '~/components/Banners';
|
||||
|
||||
export default function Root() {
|
||||
const { isAuthenticated, logout } = useAuthContext();
|
||||
const navigate = useNavigate();
|
||||
const [showTerms, setShowTerms] = useState(false);
|
||||
const [bannerHeight, setBannerHeight] = useState(0);
|
||||
const [navVisible, setNavVisible] = useState(() => {
|
||||
const savedNavVisible = localStorage.getItem('navVisible');
|
||||
return savedNavVisible !== null ? JSON.parse(savedNavVisible) : true;
|
||||
});
|
||||
const [bannerHeight, setBannerHeight] = useState(0);
|
||||
|
||||
const search = useSearch({ isAuthenticated });
|
||||
const fileMap = useFileMap({ isAuthenticated });
|
||||
const { isAuthenticated, logout } = useAuthContext();
|
||||
const assistantsMap = useAssistantsMap({ isAuthenticated });
|
||||
const agentsMap = useAgentsMap({ isAuthenticated });
|
||||
const fileMap = useFileMap({ isAuthenticated });
|
||||
const search = useSearch({ isAuthenticated });
|
||||
|
||||
const [showTerms, setShowTerms] = useState(false);
|
||||
const { data: config } = useGetStartupConfig();
|
||||
const { data: termsData } = useUserTermsQuery({
|
||||
enabled: isAuthenticated && config?.interface?.termsOfService?.modalAcceptance === true,
|
||||
|
|
@ -51,33 +56,35 @@ export default function Root() {
|
|||
}
|
||||
|
||||
return (
|
||||
<SearchContext.Provider value={search}>
|
||||
<FileMapContext.Provider value={fileMap}>
|
||||
<AssistantsMapContext.Provider value={assistantsMap}>
|
||||
<AgentsMapContext.Provider value={agentsMap}>
|
||||
<Banner onHeightChange={setBannerHeight} />
|
||||
<div className="flex" style={{ height: `calc(100dvh - ${bannerHeight}px)` }}>
|
||||
<div className="relative z-0 flex h-full w-full overflow-hidden">
|
||||
<Nav navVisible={navVisible} setNavVisible={setNavVisible} />
|
||||
<div className="relative flex h-full max-w-full flex-1 flex-col overflow-hidden">
|
||||
<MobileNav setNavVisible={setNavVisible} />
|
||||
<Outlet context={{ navVisible, setNavVisible } satisfies ContextType} />
|
||||
<SetConvoProvider>
|
||||
<SearchContext.Provider value={search}>
|
||||
<FileMapContext.Provider value={fileMap}>
|
||||
<AssistantsMapContext.Provider value={assistantsMap}>
|
||||
<AgentsMapContext.Provider value={agentsMap}>
|
||||
<Banner onHeightChange={setBannerHeight} />
|
||||
<div className="flex" style={{ height: `calc(100dvh - ${bannerHeight}px)` }}>
|
||||
<div className="relative z-0 flex h-full w-full overflow-hidden">
|
||||
<Nav navVisible={navVisible} setNavVisible={setNavVisible} />
|
||||
<div className="relative flex h-full max-w-full flex-1 flex-col overflow-hidden">
|
||||
<MobileNav setNavVisible={setNavVisible} />
|
||||
<Outlet context={{ navVisible, setNavVisible } satisfies ContextType} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AgentsMapContext.Provider>
|
||||
{config?.interface?.termsOfService?.modalAcceptance === true && (
|
||||
<TermsAndConditionsModal
|
||||
open={showTerms}
|
||||
onOpenChange={setShowTerms}
|
||||
onAccept={handleAcceptTerms}
|
||||
onDecline={handleDeclineTerms}
|
||||
title={config.interface.termsOfService.modalTitle}
|
||||
modalContent={config.interface.termsOfService.modalContent}
|
||||
/>
|
||||
)}
|
||||
</AssistantsMapContext.Provider>
|
||||
</FileMapContext.Provider>
|
||||
</SearchContext.Provider>
|
||||
</AgentsMapContext.Provider>
|
||||
{config?.interface?.termsOfService?.modalAcceptance === true && (
|
||||
<TermsAndConditionsModal
|
||||
open={showTerms}
|
||||
onOpenChange={setShowTerms}
|
||||
onAccept={handleAcceptTerms}
|
||||
onDecline={handleDeclineTerms}
|
||||
title={config.interface.termsOfService.modalTitle}
|
||||
modalContent={config.interface.termsOfService.modalContent}
|
||||
/>
|
||||
)}
|
||||
</AssistantsMapContext.Provider>
|
||||
</FileMapContext.Provider>
|
||||
</SearchContext.Provider>
|
||||
</SetConvoProvider>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue