Enhance CommandMenu to prevent duplicate scripts across categories

This commit is contained in:
Bram Suurd
2025-06-27 19:38:06 +00:00
parent 6ba2972558
commit c5866f3617

View File

@ -139,34 +139,54 @@ export default function CommandMenu() {
<CommandInput placeholder="Search for a script..." /> <CommandInput placeholder="Search for a script..." />
<CommandList> <CommandList>
<CommandEmpty>{isLoading ? "Loading..." : "No scripts found."}</CommandEmpty> <CommandEmpty>{isLoading ? "Loading..." : "No scripts found."}</CommandEmpty>
{links.map(category => ( {(() => {
<CommandGroup key={`category:${category.name}`} heading={category.name}> // Track seen scripts globally to avoid duplicates across all categories
{category.scripts.map(script => ( const globalSeenScripts = new Set<string>();
<CommandItem
key={`script:${script.slug}`} return links.map((category) => {
value={`${script.slug}-${script.name}`} const uniqueScripts = category.scripts.filter((script) => {
onSelect={() => { if (globalSeenScripts.has(script.slug)) {
setOpen(false); return false;
router.push(`/scripts?id=${script.slug}`); }
}} globalSeenScripts.add(script.slug);
> return true;
<div className="flex gap-2" onClick={() => setOpen(false)}> });
<Image
src={script.logo || `/${basePath}/logo.png`} // Only render category if it has unique scripts
onError={e => ((e.currentTarget as HTMLImageElement).src = `/${basePath}/logo.png`)} if (uniqueScripts.length === 0) {
unoptimized return null;
width={16} }
height={16}
alt="" return (
className="h-5 w-5" <CommandGroup key={`category:${category.name}`} heading={category.name}>
/> {uniqueScripts.map(script => (
<span>{script.name}</span> <CommandItem
<span>{formattedBadge(script.type)}</span> key={`script:${script.slug}`}
</div> value={`${script.slug}-${script.name}`}
</CommandItem> onSelect={() => {
))} setOpen(false);
</CommandGroup> router.push(`/scripts?id=${script.slug}`);
))} }}
>
<div className="flex gap-2" onClick={() => setOpen(false)}>
<Image
src={script.logo || `/${basePath}/logo.png`}
onError={e => ((e.currentTarget as HTMLImageElement).src = `/${basePath}/logo.png`)}
unoptimized
width={16}
height={16}
alt=""
className="h-5 w-5"
/>
<span>{script.name}</span>
<span>{formattedBadge(script.type)}</span>
</div>
</CommandItem>
))}
</CommandGroup>
);
});
})()}
</CommandList> </CommandList>
</CommandDialog> </CommandDialog>
</> </>