fix: menu should work even with ssh target

This commit is contained in:
Aarnav Tale
2025-06-20 19:55:02 -04:00
parent cf55621b57
commit dd287c0444
+18 -22
View File
@@ -1,5 +1,6 @@
import { Cog, Ellipsis, SquareTerminal } from 'lucide-react'; import { Cog, Ellipsis, SquareTerminal } from 'lucide-react';
import { useState } from 'react'; import { useState } from 'react';
import Button from '~/components/Button';
import Menu from '~/components/Menu'; import Menu from '~/components/Menu';
import type { User } from '~/types'; import type { User } from '~/types';
import cn from '~/utils/cn'; import cn from '~/utils/cn';
@@ -32,7 +33,7 @@ export default function MachineMenu({
node.hostInfo?.sshHostKeys && node.hostInfo?.sshHostKeys.length > 0; node.hostInfo?.sshHostKeys && node.hostInfo?.sshHostKeys.length > 0;
return ( return (
<> <div className="flex items-center justify-end px-4 gap-1.5">
{modal === 'remove' && ( {modal === 'remove' && (
<Delete <Delete
machine={node} machine={node}
@@ -90,11 +91,9 @@ export default function MachineMenu({
/> />
)} )}
<Menu isDisabled={isDisabled}>
{isFullButton ? (
<div className="flex items-center justify-end gap-1.5 pr-4">
{supportsTailscaleSSH ? ( {supportsTailscaleSSH ? (
<Menu.Button isFullButton ? (
<Button
className="flex items-center gap-x-2" className="flex items-center gap-x-2"
variant="heavy" variant="heavy"
onPress={() => { onPress={() => {
@@ -102,8 +101,7 @@ export default function MachineMenu({
// in a new WINDOW since href can only // in a new WINDOW since href can only
// do a new TAB. // do a new TAB.
window.open( window.open(
// TODO: Use the actual real username lol `${__PREFIX__}/ssh?hostname=${node.name}`,
`${__PREFIX__}/ssh?hostname=${node.name}&username=tale`,
'_blank', '_blank',
'noopener,noreferrer,width=800,height=600', 'noopener,noreferrer,width=800,height=600',
); );
@@ -111,24 +109,15 @@ export default function MachineMenu({
> >
<SquareTerminal className="h-5" /> <SquareTerminal className="h-5" />
<p>SSH</p> <p>SSH</p>
</Menu.Button> </Button>
) : undefined}
<Menu.Button className="flex items-center gap-x-2">
<Cog className="h-5" />
<p>Machine Settings</p>
</Menu.Button>
</div>
) : ( ) : (
<div className="flex items-center justify-end gap-1.5 pr-4"> <Button
{supportsTailscaleSSH ? (
<Menu.Button
onPress={() => { onPress={() => {
// We need to use JS to open the SSH URL // We need to use JS to open the SSH URL
// in a new WINDOW since href can only // in a new WINDOW since href can only
// do a new TAB. // do a new TAB.
window.open( window.open(
// TODO: Use the actual real username lol `${__PREFIX__}/ssh?hostname=${node.name}`,
`${__PREFIX__}/ssh?hostname=${node.name}&username=tale`,
'_blank', '_blank',
'noopener,noreferrer,width=800,height=600', 'noopener,noreferrer,width=800,height=600',
); );
@@ -142,8 +131,16 @@ export default function MachineMenu({
)} )}
> >
SSH SSH
</Menu.Button> </Button>
)
) : undefined} ) : undefined}
<Menu isDisabled={isDisabled}>
{isFullButton ? (
<Menu.Button className="flex items-center gap-x-2">
<Cog className="h-5" />
<p>Machine Settings</p>
</Menu.Button>
) : (
<Menu.IconButton <Menu.IconButton
label="Machine Options" label="Machine Options"
className={cn( className={cn(
@@ -154,7 +151,6 @@ export default function MachineMenu({
> >
<Ellipsis className="h-5" /> <Ellipsis className="h-5" />
</Menu.IconButton> </Menu.IconButton>
</div>
)} )}
<Menu.Panel <Menu.Panel
onAction={(key) => setModal(key as Modal)} onAction={(key) => setModal(key as Modal)}
@@ -176,6 +172,6 @@ export default function MachineMenu({
</Menu.Section> </Menu.Section>
</Menu.Panel> </Menu.Panel>
</Menu> </Menu>
</> </div>
); );
} }