Spaces:
Paused
Paused
File size: 4,423 Bytes
780df80 79ae05b 780df80 79ae05b 780df80 79ae05b 780df80 7d94a77 780df80 645950d 79ae05b 645950d 79ae05b 645950d 780df80 79ae05b |
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 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 |
import { Checkbox } from "@/components/ui/checkbox";
import { Label } from "@/components/ui/label";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Separator } from "@/components/ui/separator";
import { useChatContext } from "@/lib/store/ChatContext";
import { ResearchOptions } from "@/lib/types";
import React from "react";
import { Input } from "@/components/ui/input"; // Make sure you have an Input component
interface ResearchControlsProps {
options: ResearchOptions;
onOptionChange: (options: ResearchOptions) => void;
}
// Traditional prop-based component
const ResearchControls: React.FC<ResearchControlsProps> = ({ options, onOptionChange }) => {
return (
<div className="space-y-6">
<div className="space-y-3">
<Label htmlFor="research-depth">Research Depth</Label>
<Select value={options.depth} onValueChange={(value: ResearchOptions["depth"]) => onOptionChange({ ...options, depth: value })}>
<SelectTrigger id="research-depth" className="w-full">
<SelectValue placeholder="Select depth" />
</SelectTrigger>
<SelectContent>
<SelectItem value="basic">Basic</SelectItem>
<SelectItem value="intermediate">Intermediate</SelectItem>
<SelectItem value="deep">Deep</SelectItem>
</SelectContent>
</Select>
<p className="text-xs text-muted-foreground">Determines how extensively the assistant will research your query.</p>
</div>
<Separator />
<div className="space-y-3">
<Label>Inclusions</Label>
<div className="flex items-center space-x-2">
<Checkbox id="sources" checked={options.sources} onCheckedChange={(checked) => onOptionChange({ ...options, sources: checked as boolean })} />
<Label htmlFor="sources" className="text-sm font-normal">
Include sources
</Label>
</div>
<div className="flex items-center space-x-2">
<Checkbox id="citations" checked={options.citations} onCheckedChange={(checked) => onOptionChange({ ...options, citations: checked as boolean })} />
<Label htmlFor="citations" className="text-sm font-normal">
Include citations
</Label>
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="create_report"
checked={options.create_report}
onCheckedChange={(checked) => onOptionChange({ ...options, create_report: checked as boolean })}
/>
<Label htmlFor="create_report" className="text-sm font-normal">
Generate Report
</Label>
</div>
</div>
<Separator />
<div className="space-y-3">
<Label>Settings</Label>
<div className="space-y-2">
<Label htmlFor="max-depth">Max Depth</Label>
<Input type="number" id="max-depth" value={options.max_depth} onChange={(e) => onOptionChange({ ...options, max_depth: parseInt(e.target.value, 10) })} className="w-full" />
</div>
<div className="space-y-2">
<Label htmlFor="num-sites-per-query">Number of Sites per Query</Label>
<Input type="number" id="num-sites-per-query" value={options.num_sites_per_query} onChange={(e) => onOptionChange({ ...options, num_sites_per_query: parseInt(e.target.value, 10) })} className="w-full" />
</div>
</div>
<Separator />
<div className="space-y-3">
<Label>Coming Soon</Label>
<div className="flex items-center space-x-2">
<Checkbox id="visualize" disabled />
<Label htmlFor="visualize" className="text-sm font-normal text-muted-foreground">
Generate visualizations
</Label>
</div>
<div className="flex items-center space-x-2">
<Checkbox id="video-content" disabled />
<Label htmlFor="video-content" className="text-sm font-normal text-muted-foreground">
Include video content
</Label>
</div>
</div>
</div>
);
};
// Context-based component
export const ResearchControlsWithContext: React.FC = () => {
const { researchOptions, setResearchOptions } = useChatContext();
return <ResearchControls options={researchOptions} onOptionChange={setResearchOptions} />;
};
export default ResearchControls;
|