limit to one search context in demo

This commit is contained in:
msukkari 2025-07-27 22:12:02 -07:00
parent f720ec945d
commit 2ab0b988e4
2 changed files with 93 additions and 73 deletions

View file

@ -33,11 +33,11 @@ export const AskSourcebotDemoCards = ({
const getContextIcon = (context: DemoSearchContext, size: number = 20) => { const getContextIcon = (context: DemoSearchContext, size: number = 20) => {
const sizeClass = size === 12 ? "h-3 w-3" : "h-5 w-5"; const sizeClass = size === 12 ? "h-3 w-3" : "h-5 w-5";
if (context.type === "set") { if (context.type === "set") {
return <LibraryBigIcon className={cn(sizeClass, "text-muted-foreground")} />; return <LibraryBigIcon className={cn(sizeClass, "text-muted-foreground")} />;
} }
if (context.codeHostType) { if (context.codeHostType) {
const codeHostIcon = getCodeHostIcon(context.codeHostType); const codeHostIcon = getCodeHostIcon(context.codeHostType);
if (codeHostIcon) { if (codeHostIcon) {
@ -52,7 +52,7 @@ export const AskSourcebotDemoCards = ({
); );
} }
} }
return <Code className={cn(sizeClass, "text-muted-foreground")} />; return <Code className={cn(sizeClass, "text-muted-foreground")} />;
} }
@ -63,40 +63,48 @@ export const AskSourcebotDemoCards = ({
return; return;
} }
if (context.type === "set") { const isDemoMode = process.env.NEXT_PUBLIC_SOURCEBOT_CLOUD_ENVIRONMENT === "demo";
const searchContext = searchContexts.find((item) => item.name === context.value); const isSelected = selectedItems.some((item) => item.value === context.value);
if (!searchContext) { if (isSelected) {
console.error(`Search context ${context.value} not found on handleContextClick`); setSelectedItems(selectedItems.filter((item) => item.value !== context.value));
return; return;
} }
const isSelected = selectedItems.some(
(selected) => selected.type === 'context' && selected.value === context.value
);
const newSelectedItems = isSelected
? selectedItems.filter(
(selected) => !(selected.type === 'context' && selected.value === context.value)
)
: [...selectedItems, { type: 'context', value: context.value, name: context.displayName, repoCount: searchContext.repoNames.length } as SearchContextItem];
setSelectedItems(newSelectedItems); const getNewSelectedItem = (): ContextItem | null => {
if (context.type === "set") {
const searchContext = searchContexts.find((item) => item.name === context.value);
if (!searchContext) {
console.error(`Search context ${context.value} not found on handleContextClick`);
return null;
}
return {
type: 'context',
value: context.value,
name: context.displayName,
repoCount: searchContext.repoNames.length
} as SearchContextItem;
} else {
const repo = repos.find((repo) => repo.repoName === context.value);
if (!repo) {
console.error(`Repo ${context.value} not found on handleContextClick`);
return null;
}
return {
type: 'repo',
value: context.value,
name: context.displayName,
codeHostType: repo.codeHostType
} as RepoContextItem;
}
}
const newSelectedItem = getNewSelectedItem();
if (newSelectedItem) {
setSelectedItems(isDemoMode ? [newSelectedItem] : [...selectedItems, newSelectedItem]);
} else { } else {
const repo = repos.find((repo) => repo.repoName === context.value); console.error(`No new selected item found on handleContextClick`);
if (!repo) {
console.error(`Repo ${context.value} not found on handleContextClick`);
return;
}
const isSelected = selectedItems.some(
(selected) => selected.type === 'repo' && selected.value === context.value
);
const newSelectedItems = isSelected
? selectedItems.filter(
(selected) => !(selected.type === 'repo' && selected.value === context.value)
)
: [...selectedItems, { type: 'repo', value: context.value, name: context.displayName, codeHostType: repo.codeHostType } as RepoContextItem];
setSelectedItems(newSelectedItems);
} }
} }
@ -107,7 +115,7 @@ export const AskSourcebotDemoCards = ({
<div className="text-center mb-8"> <div className="text-center mb-8">
<div className="flex items-center justify-center gap-2 mb-2"> <div className="flex items-center justify-center gap-2 mb-2">
<Layers className="h-5 w-5 text-muted-foreground" /> <Layers className="h-5 w-5 text-muted-foreground" />
<h3 className="text-lg font-semibold">Search Context</h3> <h3 className="text-lg font-semibold">Search Contexts</h3>
</div> </div>
<p className="text-sm text-muted-foreground">Select the context you want to ask questions about</p> <p className="text-sm text-muted-foreground">Select the context you want to ask questions about</p>
</div> </div>
@ -177,33 +185,34 @@ export const AskSourcebotDemoCards = ({
{demoExamples.searchExamples.map((example) => { {demoExamples.searchExamples.map((example) => {
const searchContexts = demoExamples.searchContexts.filter((context) => example.searchContext.includes(context.id)) const searchContexts = demoExamples.searchContexts.filter((context) => example.searchContext.includes(context.id))
return ( return (
<Card <Card
key={example.url} key={example.url}
className="cursor-pointer transition-all duration-200 hover:shadow-md hover:scale-105 hover:border-primary/50 group w-full max-w-[350px]" className="cursor-pointer transition-all duration-200 hover:shadow-md hover:scale-105 hover:border-primary/50 group w-full max-w-[350px]"
onClick={() => handleExampleClick(example)} onClick={() => handleExampleClick(example)}
> >
<CardContent className="p-4"> <CardContent className="p-4">
<div className="space-y-3"> <div className="space-y-3">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
{searchContexts.map((context) => ( {searchContexts.map((context) => (
<Badge key={context.value} variant="secondary" className="text-[10px] px-1.5 py-0.5 h-4 flex items-center gap-1"> <Badge key={context.value} variant="secondary" className="text-[10px] px-1.5 py-0.5 h-4 flex items-center gap-1">
{getContextIcon(context, 12)} {getContextIcon(context, 12)}
{context.displayName} {context.displayName}
</Badge> </Badge>
))} ))}
</div>
<div className="space-y-1">
<h4 className="font-semibold text-sm group-hover:text-primary transition-colors line-clamp-2">
{example.title}
</h4>
<p className="text-xs text-muted-foreground line-clamp-3 leading-relaxed">
{example.description}
</p>
</div>
</div> </div>
<div className="space-y-1"> </CardContent>
<h4 className="font-semibold text-sm group-hover:text-primary transition-colors line-clamp-2"> </Card>
{example.title} )
</h4> })}
<p className="text-xs text-muted-foreground line-clamp-3 leading-relaxed">
{example.description}
</p>
</div>
</div>
</CardContent>
</Card>
)})}
</div> </div>
</div> </div>
</div> </div>

View file

@ -96,12 +96,23 @@ export const ContextSelector = React.forwardRef<
const isSelected = selectedItems.some( const isSelected = selectedItems.some(
(selected) => selected.type === item.type && selected.value === item.value (selected) => selected.type === item.type && selected.value === item.value
); );
const newSelectedItems = isSelected const isDemoMode = process.env.NEXT_PUBLIC_SOURCEBOT_CLOUD_ENVIRONMENT === "demo";
? selectedItems.filter(
let newSelectedItems: ContextItem[];
if (isSelected) {
newSelectedItems = selectedItems.filter(
(selected) => !(selected.type === item.type && selected.value === item.value) (selected) => !(selected.type === item.type && selected.value === item.value)
) );
: [...selectedItems, item]; } else {
// Limit selected context to 1 in demo mode
if (isDemoMode) {
newSelectedItems = [item];
} else {
newSelectedItems = [...selectedItems, item];
}
}
onSelectedItemsChange(newSelectedItems); onSelectedItemsChange(newSelectedItems);
}; };
@ -120,14 +131,14 @@ export const ContextSelector = React.forwardRef<
name: context.name, name: context.name,
repoCount: context.repoNames.length repoCount: context.repoNames.length
})); }));
const repoItems: ContextItem[] = repos.map(repo => ({ const repoItems: ContextItem[] = repos.map(repo => ({
type: 'repo' as const, type: 'repo' as const,
value: repo.repoName, value: repo.repoName,
name: repo.repoDisplayName || repo.repoName.split('/').pop() || repo.repoName, name: repo.repoDisplayName || repo.repoName.split('/').pop() || repo.repoName,
codeHostType: repo.codeHostType, codeHostType: repo.codeHostType,
})); }));
return [...contextItems, ...repoItems]; return [...contextItems, ...repoItems];
}, [repos, searchContexts]); }, [repos, searchContexts]);
@ -225,8 +236,8 @@ export const ContextSelector = React.forwardRef<
(() => { (() => {
const codeHostIcon = item.codeHostType ? getCodeHostIcon(item.codeHostType) : null; const codeHostIcon = item.codeHostType ? getCodeHostIcon(item.codeHostType) : null;
return codeHostIcon ? ( return codeHostIcon ? (
<Image <Image
src={codeHostIcon.src} src={codeHostIcon.src}
alt={`${item.codeHostType} icon`} alt={`${item.codeHostType} icon`}
width={16} width={16}
height={16} height={16}
@ -243,8 +254,8 @@ export const ContextSelector = React.forwardRef<
{item.name} {item.name}
</span> </span>
{item.type === 'context' && ( {item.type === 'context' && (
<Badge <Badge
variant="default" variant="default"
className="text-[10px] px-1.5 py-0 h-4 bg-primary text-primary-foreground" className="text-[10px] px-1.5 py-0 h-4 bg-primary text-primary-foreground"
> >
{item.repoCount} repo{item.repoCount === 1 ? '' : 's'} {item.repoCount} repo{item.repoCount === 1 ? '' : 's'}