rsp2k/headplane
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: show node acl tags on the main screen

Browse Source
This commit is contained in:
Aarnav Tale 2024-03-26 16:55:29 -04:00
parent 5bb2f7dfa3
commit cce30bd29c
No known key found for this signature in database
1 changed files with 61 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
app/routes/_data.machines._index.tsx
View File

@ -25,24 +25,36 @@ export default function Page() {
return ( return (
<table className='table-auto w-full rounded-lg'> <table className='table-auto w-full rounded-lg'>
<thead> <thead className='text-gray-500 dark:text-gray-400'>
<tr className='text-left'> <tr className='text-left uppercase text-sm font-bold'>
<th className='pl-4'>Name</th> <th className='pl-4'>Name</th>
<th>IP Addresses</th> <th>IP Addresses</th>
<th>Last Seen</th> <th>Last Seen</th>
</tr> </tr>
</thead> </thead>
<tbody className='divide-y divide-zinc-200 dark:divide-zinc-700'> <tbody className={clsx(
{data.map(machine => ( 'divide-y divide-zinc-200 dark:divide-zinc-700 align-top',
'border-t border-zinc-200 dark:border-zinc-700'
)}
>
{data.map(machine => {
const tags = [...machine.forcedTags, ...machine.validTags]
return (
<tr key={machine.id} className='hover:bg-zinc-100 dark:hover:bg-zinc-800'> <tr key={machine.id} className='hover:bg-zinc-100 dark:hover:bg-zinc-800'>
<td className='pt-2 pb-4 pl-4'> <td className='py-2 pl-4'>
<Link to={`/machines/${machine.id}`}> <Link to={`/machines/${machine.id}`}>
<h1>{machine.givenName}</h1> <h1>{machine.givenName}</h1>
<span <span className='text-sm font-mono text-gray-500 dark:text-gray-400'>
className='text-sm font-mono text-gray-500 dark:text-gray-400' {machine.name}
>{machine.name} </span>
</span <div className='flex gap-1 mt-1'>
> {tags.map(tag => (
<span key={tag} className='text-xs bg-gray-200 text-gray-600 rounded-sm px-1 py-0.5'>
{tag}
</span>
))}
</div>
</Link> </Link>
</td> </td>
<td className='pt-2 pb-4 font-mono text-gray-600 dark:text-gray-300'> <td className='pt-2 pb-4 font-mono text-gray-600 dark:text-gray-300'>
@ -63,7 +75,7 @@ export default function Page() {
</button> </button>
))} ))}
</td> </td>
<td> <td className='py-2'>
<span <span
className='flex items-center gap-x-1 text-sm text-gray-500 dark:text-gray-400' className='flex items-center gap-x-1 text-sm text-gray-500 dark:text-gray-400'
> >
@ -78,7 +90,8 @@ export default function Page() {
</span> </span>
</td> </td>
</tr> </tr>
))} )
})}
</tbody> </tbody>
</table> </table>
) )