feat(TALE-36): redesign machines page to account for exit nodes
This commit is contained in:
parent
1490406784
commit
a2e659f36c
4 changed files with 287 additions and 102 deletions
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue