From 88ea4391e0cf1c2d302d38994c8f84ac034cadbb Mon Sep 17 00:00:00 2001
From: Owen <owen@txv.io>
Date: Tue, 2 Jun 2026 15:31:33 -0700
Subject: [PATCH] Show new types of resources right

---
 server/routers/resource/getUserResources.ts |   2 +
 src/components/MemberResourcesPortal.tsx    | 149 ++++++++++++--------
 2 files changed, 94 insertions(+), 57 deletions(-)

diff --git a/server/routers/resource/getUserResources.ts b/server/routers/resource/getUserResources.ts
index 4c7d3e9ad..114432a73 100644
--- a/server/routers/resource/getUserResources.ts
+++ b/server/routers/resource/getUserResources.ts
@@ -438,6 +438,7 @@ export async function getUserResources(
             return {
                 siteResourceId: siteResource.siteResourceId,
                 name: siteResource.name,
+                niceId: siteResource.niceId,
                 destination: siteResource.destination,
                 mode: siteResource.mode,
                 ssl: siteResource.ssl,
@@ -492,6 +493,7 @@ export type GetUserResourcesResponse = {
         siteResources: Array<{
             siteResourceId: number;
             name: string;
+            niceId: string;
             destination: string;
             mode: string;
             tcpPortRangeString: string | null;
diff --git a/src/components/MemberResourcesPortal.tsx b/src/components/MemberResourcesPortal.tsx
index fded7df52..21b7a4cd7 100644
--- a/src/components/MemberResourcesPortal.tsx
+++ b/src/components/MemberResourcesPortal.tsx
@@ -41,6 +41,7 @@ import {
     TooltipTrigger
 } from "@/components/ui/tooltip";
 import CopyToClipboard from "@app/components/CopyToClipboard";
+import { Badge } from "@/components/ui/badge";
 
 // Update Resource type to include site information
 type Resource = {
@@ -49,7 +50,7 @@ type Resource = {
     domain: string;
     enabled: boolean;
     protected: boolean;
-    // mode: string; // "http", "tcp", "udp", "rdp", "vnc", "ssh"
+    mode: string; // "http", "tcp", "udp", "rdp", "vnc", "ssh"
     // Auth method fields
     sso?: boolean;
     password?: boolean;
@@ -62,6 +63,7 @@ type Resource = {
 type SiteResource = {
     siteResourceId: number;
     name: string;
+    niceId: string;
     destination: string;
     mode: string;
     ssl: boolean;
@@ -754,7 +756,13 @@ export default function MemberResourcesPortal({
                                                     </TooltipProvider>
                                                 </div>
 
-                                                <div className="flex-shrink-0">
+                                                <div className="flex-shrink-0 flex items-center gap-2">
+                                                    <Badge
+                                                        variant="secondary"
+                                                        className="text-xs"
+                                                    >
+                                                        {resource.mode.toUpperCase()}
+                                                    </Badge>
                                                     <ResourceInfo
                                                         resource={resource}
                                                     />
@@ -860,7 +868,13 @@ export default function MemberResourcesPortal({
                                                     </TooltipProvider>
                                                 </div>
 
-                                                <div className="flex-shrink-0">
+                                                <div className="flex-shrink-0 flex items-center gap-2">
+                                                    <Badge
+                                                        variant="secondary"
+                                                        className="text-xs"
+                                                    >
+                                                        {siteResource.mode.toUpperCase()}
+                                                    </Badge>
                                                     <InfoPopup>
                                                         <div className="space-y-2 text-sm">
                                                             <div className="text-xs font-medium mb-1.5">
@@ -876,24 +890,24 @@ export default function MemberResourcesPortal({
                                                                     :
                                                                 </span>
                                                                 <span className="ml-2 text-muted-foreground capitalize">
-                                                                    {
-                                                                        siteResource.mode
-                                                                    }
-                                                                </span>
-                                                            </div>
-                                                            <div>
-                                                                <span className="font-medium">
-                                                                    {t(
-                                                                        "memberPortalDestination"
-                                                                    )}
-                                                                    :
-                                                                </span>
-                                                                <span className="ml-2 text-muted-foreground">
-                                                                    {
-                                                                        siteResource.destination
-                                                                    }
+                                                                    {siteResource.mode.toUpperCase()}
                                                                 </span>
                                                             </div>
+                                                            {siteResource.destination && (
+                                                                <div>
+                                                                    <span className="font-medium">
+                                                                        {t(
+                                                                            "memberPortalDestination"
+                                                                        )}
+                                                                        :
+                                                                    </span>
+                                                                    <span className="ml-2 text-muted-foreground">
+                                                                        {
+                                                                            siteResource.destination
+                                                                        }
+                                                                    </span>
+                                                                </div>
+                                                            )}
                                                             {siteResource.alias && (
                                                                 <div>
                                                                     <span className="font-medium">
@@ -942,45 +956,35 @@ export default function MemberResourcesPortal({
                                                         isLink={true}
                                                     />
                                                 ) : siteResource.alias ? (
-                                                    <>
-                                                        {/* Alias as primary */}
-                                                        <div className="flex items-center gap-2 mb-1">
-                                                            <div className="text-base font-semibold text-foreground text-left truncate flex-1">
-                                                                {
-                                                                    siteResource.alias
-                                                                }
-                                                            </div>
-                                                            <Button
-                                                                variant="ghost"
-                                                                size="icon"
-                                                                className="h-8 w-8 text-muted-foreground"
-                                                                onClick={() => {
-                                                                    navigator.clipboard.writeText(
-                                                                        siteResource.alias!
-                                                                    );
-                                                                    toast({
-                                                                        title: t(
-                                                                            "memberPortalCopiedToClipboard"
+                                                    /* Alias as primary */
+                                                    <div className="flex items-center gap-2">
+                                                        <div className="text-sm text-muted-foreground font-medium text-left truncate flex-1">
+                                                            {siteResource.alias}
+                                                        </div>
+                                                        <Button
+                                                            variant="ghost"
+                                                            size="icon"
+                                                            className="h-8 w-8 text-muted-foreground"
+                                                            onClick={() => {
+                                                                navigator.clipboard.writeText(
+                                                                    siteResource.alias!
+                                                                );
+                                                                toast({
+                                                                    title: t(
+                                                                        "memberPortalCopiedToClipboard"
+                                                                    ),
+                                                                    description:
+                                                                        t(
+                                                                            "memberPortalCopiedAliasDescription"
                                                                         ),
-                                                                        description:
-                                                                            t(
-                                                                                "memberPortalCopiedAliasDescription"
-                                                                            ),
-                                                                        duration: 2000
-                                                                    });
-                                                                }}
-                                                            >
-                                                                <Copy className="h-4 w-4" />
-                                                            </Button>
-                                                        </div>
-                                                        {/* Destination as secondary */}
-                                                        <div className="text-xs text-muted-foreground truncate">
-                                                            {
-                                                                siteResource.destination
-                                                            }
-                                                        </div>
-                                                    </>
-                                                ) : (
+                                                                    duration: 2000
+                                                                });
+                                                            }}
+                                                        >
+                                                            <Copy className="h-4 w-4" />
+                                                        </Button>
+                                                    </div>
+                                                ) : siteResource.destination ? (
                                                     /* Destination as primary when no alias */
                                                     <div className="flex items-center gap-2">
                                                         <div className="text-sm text-muted-foreground font-medium text-left truncate flex-1">
@@ -1011,6 +1015,37 @@ export default function MemberResourcesPortal({
                                                             <Copy className="h-4 w-4" />
                                                         </Button>
                                                     </div>
+                                                ) : (
+                                                    /* niceId fallback when no alias and no destination */
+                                                    <div className="flex items-center gap-2">
+                                                        <div className="text-sm text-muted-foreground font-medium text-left truncate flex-1">
+                                                            {
+                                                                siteResource.niceId
+                                                            }
+                                                        </div>
+                                                        <Button
+                                                            variant="ghost"
+                                                            size="icon"
+                                                            className="h-8 w-8 text-muted-foreground"
+                                                            onClick={() => {
+                                                                navigator.clipboard.writeText(
+                                                                    siteResource.niceId
+                                                                );
+                                                                toast({
+                                                                    title: t(
+                                                                        "memberPortalCopiedToClipboard"
+                                                                    ),
+                                                                    description:
+                                                                        t(
+                                                                            "memberPortalCopiedDestinationDescription"
+                                                                        ),
+                                                                    duration: 2000
+                                                                });
+                                                            }}
+                                                        >
+                                                            <Copy className="h-4 w-4" />
+                                                        </Button>
+                                                    </div>
                                                 )}
                                             </div>
                                         </div>