feat(layout): add everything inside chat provider

This commit is contained in:
ItzCrazyKns
2025-10-24 22:57:56 +05:30
parent d0719429b4
commit 097a5c55c6
5 changed files with 24 additions and 25 deletions

View File

@@ -1,16 +1,11 @@
'use client'; 'use client';
import ChatWindow from '@/components/ChatWindow'; import ChatWindow from '@/components/ChatWindow';
import { useParams } from 'next/navigation';
import React from 'react'; import React from 'react';
import { ChatProvider } from '@/lib/hooks/useChat';
const Page = () => { const Page = () => {
const { chatId }: { chatId: string } = useParams();
return ( return (
<ChatProvider id={chatId}> <ChatWindow />
<ChatWindow />
</ChatProvider>
); );
}; };

View File

@@ -9,6 +9,7 @@ import { Toaster } from 'sonner';
import ThemeProvider from '@/components/theme/Provider'; import ThemeProvider from '@/components/theme/Provider';
import configManager from '@/lib/config'; import configManager from '@/lib/config';
import SetupWizard from '@/components/Setup/SetupWizard'; import SetupWizard from '@/components/Setup/SetupWizard';
import { ChatProvider } from '@/lib/hooks/useChat';
const montserrat = Montserrat({ const montserrat = Montserrat({
weight: ['300', '400', '500', '700'], weight: ['300', '400', '500', '700'],
@@ -36,7 +37,7 @@ export default function RootLayout({
<body className={cn('h-full', montserrat.className)}> <body className={cn('h-full', montserrat.className)}>
<ThemeProvider> <ThemeProvider>
{setupComplete ? ( {setupComplete ? (
<> <ChatProvider>
<Sidebar>{children}</Sidebar> <Sidebar>{children}</Sidebar>
<Toaster <Toaster
toastOptions={{ toastOptions={{
@@ -47,7 +48,7 @@ export default function RootLayout({
}, },
}} }}
/> />
</> </ChatProvider>
) : ( ) : (
<SetupWizard configSections={configSections} /> <SetupWizard configSections={configSections} />
)} )}

View File

@@ -1,7 +1,5 @@
import ChatWindow from '@/components/ChatWindow'; import ChatWindow from '@/components/ChatWindow';
import { ChatProvider } from '@/lib/hooks/useChat';
import { Metadata } from 'next'; import { Metadata } from 'next';
import { Suspense } from 'react';
export const metadata: Metadata = { export const metadata: Metadata = {
title: 'Chat - Perplexica', title: 'Chat - Perplexica',
@@ -10,13 +8,7 @@ export const metadata: Metadata = {
const Home = () => { const Home = () => {
return ( return (
<div> <ChatWindow />
<Suspense>
<ChatProvider>
<ChatWindow />
</ChatProvider>
</Suspense>
</div>
); );
}; };

View File

@@ -9,6 +9,7 @@ import Link from 'next/link';
import NextError from 'next/error'; import NextError from 'next/error';
import { useChat } from '@/lib/hooks/useChat'; import { useChat } from '@/lib/hooks/useChat';
import Loader from './ui/Loader'; import Loader from './ui/Loader';
import SettingsButtonMobile from './Settings/SettingsButtonMobile';
export interface BaseMessage { export interface BaseMessage {
chatId: string; chatId: string;
@@ -56,9 +57,7 @@ const ChatWindow = () => {
return ( return (
<div className="relative"> <div className="relative">
<div className="absolute w-full flex flex-row items-center justify-end mr-5 mt-5"> <div className="absolute w-full flex flex-row items-center justify-end mr-5 mt-5">
<Link href="/settings"> <SettingsButtonMobile />
<Settings className="cursor-pointer lg:hidden" />
</Link>
</div> </div>
<div className="flex flex-col items-center justify-center min-h-screen"> <div className="flex flex-col items-center justify-center min-h-screen">
<p className="dark:text-white/70 text-black/70 text-sm"> <p className="dark:text-white/70 text-black/70 text-sm">

View File

@@ -17,7 +17,7 @@ import {
useState, useState,
} from 'react'; } from 'react';
import crypto from 'crypto'; import crypto from 'crypto';
import { useSearchParams } from 'next/navigation'; import { useParams, useSearchParams } from 'next/navigation';
import { toast } from 'sonner'; import { toast } from 'sonner';
import { getSuggestions } from '../actions'; import { getSuggestions } from '../actions';
import { MinimalProvider } from '../models/types'; import { MinimalProvider } from '../models/types';
@@ -274,15 +274,14 @@ export const chatContext = createContext<ChatContext>({
export const ChatProvider = ({ export const ChatProvider = ({
children, children,
id,
}: { }: {
children: React.ReactNode; children: React.ReactNode;
id?: string;
}) => { }) => {
const params: { chatId: string } = useParams()
const searchParams = useSearchParams(); const searchParams = useSearchParams();
const initialMessage = searchParams.get('q'); const initialMessage = searchParams.get('q');
const [chatId, setChatId] = useState<string | undefined>(id); const [chatId, setChatId] = useState<string | undefined>(params.chatId);
const [newChatCreated, setNewChatCreated] = useState(false); const [newChatCreated, setNewChatCreated] = useState(false);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
@@ -451,6 +450,19 @@ export const ChatProvider = ({
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, []); }, []);
useEffect(() => {
if (params.chatId && params.chatId !== chatId) {
setChatId(params.chatId);
setMessages([]);
setChatHistory([]);
setFiles([]);
setFileIds([]);
setIsMessagesLoaded(false);
setNotFound(false);
setNewChatCreated(false);
}
}, [params.chatId, chatId]);
useEffect(() => { useEffect(() => {
if ( if (
chatId && chatId &&
@@ -474,7 +486,7 @@ export const ChatProvider = ({
setChatId(crypto.randomBytes(20).toString('hex')); setChatId(crypto.randomBytes(20).toString('hex'));
} }
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, []); }, [chatId, isMessagesLoaded, newChatCreated, messages.length]);
useEffect(() => { useEffect(() => {
messagesRef.current = messages; messagesRef.current = messages;