external dropdown links

This commit is contained in:
Nate Kelley 2025-04-21 14:42:48 -06:00
parent f53bc01955
commit 49d9153f72
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 13 additions and 3 deletions

View File

@ -77,6 +77,7 @@ const SidebarUserDropdown: React.FC<{
label: 'Docs', label: 'Docs',
value: 'docs', value: 'docs',
link: BUSTER_DOCS_URL, link: BUSTER_DOCS_URL,
linkIcon: 'arrow-external',
icon: <Book2 /> icon: <Book2 />
}, },
{ {

View File

@ -41,6 +41,7 @@ export interface DropdownItem<T = string> {
selected?: boolean; selected?: boolean;
items?: DropdownItems<T>; items?: DropdownItems<T>;
link?: string; link?: string;
linkTarget?: '_blank' | '_self';
linkIcon?: 'arrow-right' | 'arrow-external' | 'caret-right'; linkIcon?: 'arrow-right' | 'arrow-external' | 'caret-right';
} }
@ -408,8 +409,13 @@ const DropdownItem = <T,>({
// Wrap with Link if needed // Wrap with Link if needed
if (!isSelectable && link) { if (!isSelectable && link) {
const isExternal = link.startsWith('http');
return ( return (
<Link className="flex w-full items-center gap-x-2" href={link}> <Link
className="flex w-full items-center gap-x-2"
href={link}
target={isExternal ? '_blank' : '_self'}>
{content} {content}
</Link> </Link>
); );

View File

@ -237,7 +237,8 @@ const DropdownMenuLink: React.FC<{
className?: string; className?: string;
link: string | null; link: string | null;
linkIcon?: 'arrow-right' | 'arrow-external' | 'caret-right'; linkIcon?: 'arrow-right' | 'arrow-external' | 'caret-right';
}> = ({ className, link, linkIcon = 'arrow-external', ...props }) => { linkTarget?: '_blank' | '_self';
}> = ({ className, link, linkTarget, linkIcon = 'arrow-right', ...props }) => {
const icon = React.useMemo(() => { const icon = React.useMemo(() => {
if (linkIcon === 'arrow-right') return <ArrowRight />; if (linkIcon === 'arrow-right') return <ArrowRight />;
if (linkIcon === 'arrow-external') return <ArrowUpRight />; if (linkIcon === 'arrow-external') return <ArrowUpRight />;
@ -263,9 +264,11 @@ const DropdownMenuLink: React.FC<{
</div> </div>
); );
console.log(link, isExternal, linkTarget);
return ( return (
<span className={className} onClick={(e) => e.stopPropagation()}> <span className={className} onClick={(e) => e.stopPropagation()}>
<Link href={link} target={isExternal ? '_blank' : '_self'} className=""> <Link href={link} target={linkTarget || isExternal ? '_blank' : '_self'} className="">
{content} {content}
</Link> </Link>
</span> </span>