mirror of https://github.com/buster-so/buster.git
external dropdown links
This commit is contained in:
parent
f53bc01955
commit
49d9153f72
|
@ -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 />
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
|
@ -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>
|
||||||
);
|
);
|
||||||
|
|
|
@ -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>
|
||||||
|
|
Loading…
Reference in New Issue