Working on ui

server/routers/resource/listResources.ts

@@ -434,7 +434,16 @@ export async function listResources(
                 .from(targets)
                 .innerJoin(sites, eq(targets.siteId, sites.siteId))
                 .where(and(eq(sites.orgId, orgId), eq(sites.siteId, siteId)));
-            conditions.push(inArray(resources.resourceId, resourcesWithSite));
+            const resourcesWithBrowserGateway = db
+                .select({ resourceId: browserGatewayTarget.resourceId })
+                .from(browserGatewayTarget)
+                .where(eq(browserGatewayTarget.siteId, siteId));
+            conditions.push(
+                or(
+                    inArray(resources.resourceId, resourcesWithSite),
+                    inArray(resources.resourceId, resourcesWithBrowserGateway)
+                )
+            );
         }
 
         if (isLabelFeatureEnabled && labelFilter && labelFilter.length > 0) {

server/routers/siteResource/updateSiteResource.ts

@@ -144,14 +144,13 @@ const updateSiteResourceSchema = z
                     data.destinationPort <= 65535
                 );
             } else if (data.mode === "ssh") {
-                // just check the destinationPort
+                // destinationPort is optional for native mode; allow null/undefined
                 return (
-                    data.destinationPort === undefined ||
+                    data.destinationPort == null ||
-                    (data.destinationPort !== null &&
+                    (data.destinationPort >= 1 && data.destinationPort <= 65535)
-                        data.destinationPort >= 1 &&
-                        data.destinationPort <= 65535)
                 );
             }
+            return true;
         },
         {
             message:

src/app/[orgId]/settings/resources/client/page.tsx

@@ -1,5 +1,5 @@
 import type { InternalResourceRow } from "@app/components/ClientResourcesTable";
-import ClientResourcesTable from "@app/components/ClientResourcesTable";
+import PrivateResourcesTable from "@app/components/ClientResourcesTable";
 import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
 import PrivateResourcesBanner from "@app/components/PrivateResourcesBanner";
 import { internal } from "@app/lib/api";
@@ -148,7 +148,7 @@ export default async function ClientResourcesPage(
             <PrivateResourcesBanner orgId={params.orgId} />
 
             <OrgProvider org={org}>
-                <ClientResourcesTable
+                <PrivateResourcesTable
                     internalResources={internalResourceRows}
                     orgId={params.orgId}
                     rowCount={pagination.total}

src/components/ContainersSelector.tsx

@@ -130,7 +130,7 @@ const DockerContainersTable: FC<{
         useState(true);
     const [hideStoppedContainers, setHideStoppedContainers] = useState(false);
     const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({
-        labels: false
+        labels: true
     });
 
     const t = useTranslations();

src/components/MachineClientsTable.tsx

@@ -24,17 +24,12 @@ import {
     ArrowUp10Icon,
     ChevronsUpDownIcon,
     CircleSlash,
-    MoreHorizontal,
+    MoreHorizontal
 } from "lucide-react";
 import { useTranslations } from "next-intl";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
-import {
+import { startTransition, useMemo, useState, useTransition } from "react";
-    startTransition,
-    useMemo,
-    useState,
-    useTransition
-} from "react";
 import { useDebouncedCallback } from "use-debounce";
 import z from "zod";
 import { ColumnFilterButton } from "./ColumnFilterButton";
@@ -110,7 +105,7 @@ export default function MachineClientsTable({
         subnet: false,
         userId: false,
         niceId: false,
-        labels: false
+        labels: true
     };
 
     const refreshData = () => {
@@ -614,7 +609,10 @@ function MachineClientLabelCell({
 }: MachineClientLabelCellProps) {
     const t = useTranslations();
     const api = createApiClient(useEnvContext());
-    const [localLabels, setLocalLabels] = useLocalLabels(client.labels, client.id);
+    const [localLabels, setLocalLabels] = useLocalLabels(
+        client.labels,
+        client.id
+    );
 
     function toggleClientLabel(
         label: SelectedLabel,

src/components/PrivateResourceForm.tsx

@@ -1128,9 +1128,7 @@ export function PrivateResourceForm({
                                         />
                                     </div>
                                 )}
-                                {(mode === "host" ||
+                                {(mode === "host" || mode === "ssh") && (
-                                    (mode === "ssh" &&
-                                        sshServerMode !== "native")) && (
                                     <div className="min-w-0">
                                         <FormField
                                             control={form.control}

src/components/PrivateResourcesTable.tsx

@@ -129,7 +129,7 @@ type ClientResourcesTableProps = {
     initialFilterSite?: Selectedsite | null;
 };
 
-export default function ClientResourcesTable({
+export default function PrivateResourcesTable({
     internalResources,
     orgId,
     pagination,
@@ -400,6 +400,7 @@ export default function ClientResourcesTable({
                 cell: ({ row }) => {
                     const resourceRow = row.original;
                     const display = formatDestinationDisplay(resourceRow);
+                    if (resourceRow.destination) {
                         return (
                             <CopyToClipboard
                                 text={display}
@@ -408,6 +409,8 @@ export default function ClientResourcesTable({
                             />
                         );
                     }
+                    return <span>-</span>;
+                }
             },
             {
                 accessorKey: "alias",
@@ -656,7 +659,7 @@ export default function ClientResourcesTable({
                 columnVisibility={{
                     niceId: false,
                     aliasAddress: false,
-                    labels: false
+                    labels: true
                 }}
                 stickyLeftColumn="name"
                 stickyRightColumn="actions"

src/components/ProxyResourcesTable.tsx

@@ -755,7 +755,7 @@ export default function ProxyResourcesTable({
                 columnVisibility={{
                     niceId: false,
                     protocol: false,
-                    labels: false
+                    labels: true
                 }}
                 stickyLeftColumn="name"
                 stickyRightColumn="actions"

src/components/SitesTable.tsx

@@ -36,7 +36,7 @@ import {
     ArrowUpRight,
     ChevronDown,
     ChevronsUpDownIcon,
-    MoreHorizontal,
+    MoreHorizontal
 } from "lucide-react";
 import { useTranslations } from "next-intl";
 import Link from "next/link";
@@ -670,7 +670,7 @@ export default function SitesTable({
                     nice: false,
                     exitNode: false,
                     address: false,
-                    labels: false
+                    labels: true
                 }}
                 enableColumnVisibility
                 stickyLeftColumn="name"