feat(TALE-36): redesign machines page to account for exit nodes

This commit is contained in:
Aarnav Tale 2024-11-07 13:04:53 -05:00
parent 1490406784
commit a2e659f36c
No known key found for this signature in database
4 changed files with 287 additions and 102 deletions

View file

@ -1,5 +1,5 @@
import { KebabHorizontalIcon } from '@primer/octicons-react'
import { useState } from 'react'
import { ReactNode, useState } from 'react'
import MenuComponent from '~/components/Menu'
import { Machine, Route, User } from '~/types'
@ -17,9 +17,10 @@ interface MenuProps {
routes: Route[]
users: User[]
magic?: string
buttonChild?: ReactNode
}
export default function Menu({ machine, routes, magic, users }: MenuProps) {
export default function Menu({ machine, routes, magic, users, buttonChild }: MenuProps) {
const renameState = useState(false)
const expireState = useState(false)
const removeState = useState(false)
@ -69,15 +70,17 @@ export default function Menu({ machine, routes, magic, users }: MenuProps) {
/>
<MenuComponent>
<MenuComponent.Button
className={cn(
'flex items-center justify-center',
'border border-transparent rounded-lg py-0.5 w-10',
'group-hover:border-gray-200 dark:group-hover:border-zinc-700',
)}
>
<KebabHorizontalIcon className="w-5" />
</MenuComponent.Button>
{buttonChild ?? (
<MenuComponent.Button
className={cn(
'flex items-center justify-center',
'border border-transparent rounded-lg py-0.5 w-10',
'group-hover:border-gray-200 dark:group-hover:border-zinc-700',
)}
>
<KebabHorizontalIcon className="w-5" />
</MenuComponent.Button>
)}
<MenuComponent.Items>
<MenuComponent.ItemButton control={renameState}>
Edit machine name