Add files via upload
This commit is contained in:
parent
3660fb8bdd
commit
26952ff6c8
4 changed files with 97 additions and 3 deletions
|
|
@ -334,6 +334,9 @@ const ChatWindow = ({ id }: { id?: string }) => {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 檢查無痕模式
|
||||||
|
const isIncognito = localStorage.getItem('incognitoMode') === 'true';
|
||||||
|
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
setMessageAppeared(false);
|
setMessageAppeared(false);
|
||||||
|
|
||||||
|
|
@ -481,6 +484,7 @@ const ChatWindow = ({ id }: { id?: string }) => {
|
||||||
provider: embeddingModelProvider.provider,
|
provider: embeddingModelProvider.provider,
|
||||||
},
|
},
|
||||||
systemInstructions: localStorage.getItem('systemInstructions'),
|
systemInstructions: localStorage.getItem('systemInstructions'),
|
||||||
|
isIncognito: isIncognito,
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,7 @@ import { File } from './ChatWindow';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
import WeatherWidget from './WeatherWidget';
|
import WeatherWidget from './WeatherWidget';
|
||||||
import NewsArticleWidget from './NewsArticleWidget';
|
import NewsArticleWidget from './NewsArticleWidget';
|
||||||
|
import IncognitoToggle from './IncognitoToggle';
|
||||||
|
|
||||||
const EmptyChat = ({
|
const EmptyChat = ({
|
||||||
sendMessage,
|
sendMessage,
|
||||||
|
|
@ -35,9 +36,12 @@ const EmptyChat = ({
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-col items-center justify-center min-h-screen max-w-screen-sm mx-auto p-2 space-y-4">
|
<div className="flex flex-col items-center justify-center min-h-screen max-w-screen-sm mx-auto p-2 space-y-4">
|
||||||
<div className="flex flex-col items-center justify-center w-full space-y-8">
|
<div className="flex flex-col items-center justify-center w-full space-y-8">
|
||||||
<h2 className="text-black/70 dark:text-white/70 text-3xl font-medium -mt-8">
|
<div className="flex flex-col items-center space-y-4">
|
||||||
Research begins here.
|
<h2 className="text-black/70 dark:text-white/70 text-3xl font-medium -mt-8">
|
||||||
</h2>
|
Research begins here.
|
||||||
|
</h2>
|
||||||
|
<IncognitoToggle />
|
||||||
|
</div>
|
||||||
<EmptyChatMessageInput
|
<EmptyChatMessageInput
|
||||||
sendMessage={sendMessage}
|
sendMessage={sendMessage}
|
||||||
focusMode={focusMode}
|
focusMode={focusMode}
|
||||||
|
|
|
||||||
84
src/components/IncognitoToggle.tsx
Normal file
84
src/components/IncognitoToggle.tsx
Normal file
|
|
@ -0,0 +1,84 @@
|
||||||
|
'use client';
|
||||||
|
|
||||||
|
import { EyeOff, Eye } from 'lucide-react';
|
||||||
|
import { useState, useEffect } from 'react';
|
||||||
|
import { useSearchParams, useRouter, usePathname } from 'next/navigation';
|
||||||
|
|
||||||
|
interface IncognitoToggleProps {
|
||||||
|
className?: string;
|
||||||
|
showLabel?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const IncognitoToggle = ({ className = '', showLabel = true }: IncognitoToggleProps) => {
|
||||||
|
const [isIncognito, setIsIncognito] = useState(false);
|
||||||
|
const searchParams = useSearchParams();
|
||||||
|
const router = useRouter();
|
||||||
|
const pathname = usePathname();
|
||||||
|
|
||||||
|
// 初始化無痕模式狀態
|
||||||
|
useEffect(() => {
|
||||||
|
// 檢查URL參數
|
||||||
|
const incognitoParam = searchParams.get('incognito');
|
||||||
|
if (incognitoParam !== null) {
|
||||||
|
const incognitoValue = incognitoParam === 'true';
|
||||||
|
setIsIncognito(incognitoValue);
|
||||||
|
localStorage.setItem('incognitoMode', incognitoValue.toString());
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 檢查localStorage
|
||||||
|
const savedIncognito = localStorage.getItem('incognitoMode');
|
||||||
|
if (savedIncognito !== null) {
|
||||||
|
setIsIncognito(savedIncognito === 'true');
|
||||||
|
}
|
||||||
|
}, [searchParams]);
|
||||||
|
|
||||||
|
const toggleIncognito = () => {
|
||||||
|
const newIncognitoState = !isIncognito;
|
||||||
|
setIsIncognito(newIncognitoState);
|
||||||
|
|
||||||
|
// 保存到localStorage
|
||||||
|
localStorage.setItem('incognitoMode', newIncognitoState.toString());
|
||||||
|
|
||||||
|
// 更新URL參數
|
||||||
|
const params = new URLSearchParams(searchParams.toString());
|
||||||
|
if (newIncognitoState) {
|
||||||
|
params.set('incognito', 'true');
|
||||||
|
} else {
|
||||||
|
params.delete('incognito');
|
||||||
|
}
|
||||||
|
|
||||||
|
const newUrl = params.toString() ? `${pathname}?${params.toString()}` : pathname;
|
||||||
|
router.replace(newUrl, { scroll: false });
|
||||||
|
|
||||||
|
// 觸發自定義事件,通知其他組件無痕模式狀態變化
|
||||||
|
window.dispatchEvent(new CustomEvent('incognitoModeChanged', {
|
||||||
|
detail: { isIncognito: newIncognitoState }
|
||||||
|
}));
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
onClick={toggleIncognito}
|
||||||
|
className={`flex items-center space-x-2 px-3 py-2 rounded-lg transition-all duration-200 ${
|
||||||
|
isIncognito
|
||||||
|
? 'bg-orange-100 dark:bg-orange-900/30 text-orange-600 dark:text-orange-400 hover:bg-orange-200 dark:hover:bg-orange-900/50'
|
||||||
|
: 'bg-light-secondary dark:bg-dark-secondary text-black/70 dark:text-white/70 hover:bg-light-200 dark:hover:bg-dark-200'
|
||||||
|
} ${className}`}
|
||||||
|
title={isIncognito ? 'Turn off Incognito Mode' : 'Turn on Incognito Mode'}
|
||||||
|
>
|
||||||
|
{isIncognito ? (
|
||||||
|
<EyeOff size={16} />
|
||||||
|
) : (
|
||||||
|
<Eye size={16} />
|
||||||
|
)}
|
||||||
|
{showLabel && (
|
||||||
|
<span className="text-sm font-medium">
|
||||||
|
{isIncognito ? 'Incognito Mode: ON' : 'Incognito Mode: OFF'}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default IncognitoToggle;
|
||||||
|
|
@ -10,6 +10,7 @@ import {
|
||||||
Transition,
|
Transition,
|
||||||
} from '@headlessui/react';
|
} from '@headlessui/react';
|
||||||
import jsPDF from 'jspdf';
|
import jsPDF from 'jspdf';
|
||||||
|
import IncognitoToggle from './IncognitoToggle';
|
||||||
|
|
||||||
const downloadFile = (filename: string, content: string, type: string) => {
|
const downloadFile = (filename: string, content: string, type: string) => {
|
||||||
const blob = new Blob([content], { type });
|
const blob = new Blob([content], { type });
|
||||||
|
|
@ -173,6 +174,7 @@ const Navbar = ({
|
||||||
<p className="hidden lg:flex">{title}</p>
|
<p className="hidden lg:flex">{title}</p>
|
||||||
|
|
||||||
<div className="flex flex-row items-center space-x-4">
|
<div className="flex flex-row items-center space-x-4">
|
||||||
|
<IncognitoToggle showLabel={false} className="hidden lg:flex" />
|
||||||
<Popover className="relative">
|
<Popover className="relative">
|
||||||
<PopoverButton className="active:scale-95 transition duration-100 cursor-pointer p-2 rounded-full hover:bg-light-secondary dark:hover:bg-dark-secondary">
|
<PopoverButton className="active:scale-95 transition duration-100 cursor-pointer p-2 rounded-full hover:bg-light-secondary dark:hover:bg-dark-secondary">
|
||||||
<Share size={17} />
|
<Share size={17} />
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue