fix: dedupe machine tags

This commit is contained in:
Aarnav Tale 2025-01-23 11:16:56 -05:00
parent 8d3f31e7f9
commit ac937f9014
No known key found for this signature in database
2 changed files with 20 additions and 19 deletions

View File

@ -1,10 +1,10 @@
import { ChevronDownIcon, CopyIcon } from '@primer/octicons-react'; import { ChevronDownIcon, CopyIcon } from '@primer/octicons-react';
import { Link } from 'react-router';
import { useMemo } from 'react'; import { useMemo } from 'react';
import { Link } from 'react-router';
import Menu from '~/components/Menu'; import Menu from '~/components/Menu';
import StatusCircle from '~/components/StatusCircle'; import StatusCircle from '~/components/StatusCircle';
import { toast } from '~/components/Toaster'; import { toast } from '~/components/Toaster';
import type { Machine, Route, User, HostInfo } from '~/types'; import type { HostInfo, Machine, Route, User } from '~/types';
import { cn } from '~/utils/cn'; import { cn } from '~/utils/cn';
import * as hinfo from '~/utils/host-info'; import * as hinfo from '~/utils/host-info';
@ -18,7 +18,13 @@ interface Props {
stats?: HostInfo; stats?: HostInfo;
} }
export default function MachineRow({ machine, routes, magic, users, stats }: Props) { export default function MachineRow({
machine,
routes,
magic,
users,
stats,
}: Props) {
const expired = const expired =
machine.expiry === '0001-01-01 00:00:00' || machine.expiry === '0001-01-01 00:00:00' ||
machine.expiry === '0001-01-01T00:00:00Z' || machine.expiry === '0001-01-01T00:00:00Z' ||
@ -26,7 +32,7 @@ export default function MachineRow({ machine, routes, magic, users, stats }: Pro
? false ? false
: new Date(machine.expiry).getTime() < Date.now(); : new Date(machine.expiry).getTime() < Date.now();
const tags = [...machine.forcedTags, ...machine.validTags]; const tags = [...new Set([...machine.forcedTags, ...machine.validTags])];
if (expired) { if (expired) {
tags.unshift('Expired'); tags.unshift('Expired');
@ -111,10 +117,7 @@ export default function MachineRow({ machine, routes, magic, users, stats }: Pro
<div className="flex items-center gap-x-1"> <div className="flex items-center gap-x-1">
{machine.ipAddresses[0]} {machine.ipAddresses[0]}
<Menu> <Menu>
<Menu.IconButton <Menu.IconButton className="bg-transparent" label="IP Addresses">
className="bg-transparent"
label="IP Addresses"
>
<ChevronDownIcon className="w-4 h-4" /> <ChevronDownIcon className="w-4 h-4" />
</Menu.IconButton> </Menu.IconButton>
<Menu.Items> <Menu.Items>

View File

@ -1,20 +1,21 @@
import type { ActionFunctionArgs, LoaderFunctionArgs } from 'react-router';
import { Link as RemixLink, useLoaderData } from 'react-router';
import { import {
InfoIcon,
GearIcon,
CheckCircleIcon, CheckCircleIcon,
SkipIcon, GearIcon,
InfoIcon,
PersonIcon, PersonIcon,
SkipIcon,
} from '@primer/octicons-react'; } from '@primer/octicons-react';
import { useMemo, useState } from 'react'; import { useMemo, useState } from 'react';
import type { ActionFunctionArgs, LoaderFunctionArgs } from 'react-router';
import { Link as RemixLink, useLoaderData } from 'react-router';
import Attribute from '~/components/Attribute'; import Attribute from '~/components/Attribute';
import Button from '~/components/Button'; import Button from '~/components/Button';
import Card from '~/components/Card'; import Card from '~/components/Card';
import Link from '~/components/Link';
import Menu from '~/components/Menu'; import Menu from '~/components/Menu';
import Tooltip from '~/components/Tooltip';
import StatusCircle from '~/components/StatusCircle'; import StatusCircle from '~/components/StatusCircle';
import Tooltip from '~/components/Tooltip';
import type { Machine, Route, User } from '~/types'; import type { Machine, Route, User } from '~/types';
import { cn } from '~/utils/cn'; import { cn } from '~/utils/cn';
import { loadContext } from '~/utils/config/headplane'; import { loadContext } from '~/utils/config/headplane';
@ -22,7 +23,6 @@ import { loadConfig } from '~/utils/config/headscale';
import { pull } from '~/utils/headscale'; import { pull } from '~/utils/headscale';
import { getSession } from '~/utils/sessions.server'; import { getSession } from '~/utils/sessions.server';
import { useLiveData } from '~/utils/useLiveData'; import { useLiveData } from '~/utils/useLiveData';
import Link from '~/components/Link';
import { menuAction } from './action'; import { menuAction } from './action';
import MenuOptions from './components/menu'; import MenuOptions from './components/menu';
@ -74,7 +74,7 @@ export default function Page() {
? false ? false
: new Date(machine.expiry).getTime() < Date.now(); : new Date(machine.expiry).getTime() < Date.now();
const tags = [...machine.forcedTags, ...machine.validTags]; const tags = [...new Set([...machine.forcedTags, ...machine.validTags])];
if (expired) { if (expired) {
tags.unshift('Expired'); tags.unshift('Expired');
@ -216,9 +216,7 @@ export default function Page() {
Learn More Learn More
</Link> </Link>
</p> </p>
<Button onPress={() => setShowRouting(true)}> <Button onPress={() => setShowRouting(true)}>Review</Button>
Review
</Button>
</div> </div>
<Card <Card
variant="flat" variant="flat"