Spaces:
Sleeping
Sleeping
File size: 1,517 Bytes
4d592a4 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
import React from 'react';
import { Globe, FileText, GitMerge, Lock } from 'lucide-react';
import { useApp } from '../../context/AppContext';
import type { QueryMode } from '../../types';
const modes: { id: QueryMode; label: string; icon: React.ReactNode; description: string }[] = [
{
id: 'web',
label: 'Web Search',
icon: <Globe className="w-4 h-4" />,
description: 'Search the web for information',
},
{
id: 'pdf',
label: 'PDF Only',
icon: <FileText className="w-4 h-4" />,
description: 'Query only uploaded documents',
},
{
id: 'hybrid',
label: 'Hybrid',
icon: <GitMerge className="w-4 h-4" />,
description: 'Combine web and document search',
},
{
id: 'restricted',
label: 'Restricted',
icon: <Lock className="w-4 h-4" />,
description: 'Safe mode with content filtering',
},
];
export const ModeSelector: React.FC = () => {
const { state, dispatch } = useApp();
return (
<div className="flex items-center gap-1 bg-gray-100 dark:bg-gray-800 p-1 rounded-lg">
{modes.map(mode => (
<button
key={mode.id}
onClick={() => dispatch({ type: 'SET_QUERY_MODE', payload: mode.id })}
className={`
mode-tab ${state.queryMode === mode.id ? 'mode-tab-active' : 'mode-tab-inactive'}
`}
title={mode.description}
>
{mode.icon}
<span className="hidden sm:inline text-sm">{mode.label}</span>
</button>
))}
</div>
);
};
|