diff --git a/src/api/routes.py b/src/api/routes.py
index 4ed4ac9..646cb09 100644
--- a/src/api/routes.py
+++ b/src/api/routes.py
@@ -18,13 +18,15 @@
 from opentelemetry.trace.propagation.tracecontext import TraceContextTextMapPropagator
 from azure.ai.projects.models import AgentVersionObject, AgentReference
 from openai.types.conversations.message import Message
-from openai.types.responses import Response, ResponseOutputText, ResponseOutputMessage, ResponseInputText, ResponseInputMessageItem
+from openai.types.responses import ResponseOutputMessage
 from openai.types.conversations import Conversation
-from openai.types.responses.response_output_text import AnnotationFileCitation
 
 from azure.ai.projects.aio import AIProjectClient
 
-from openai.types.responses import ResponseTextDeltaEvent, ResponseCompletedEvent, ResponseTextDoneEvent, ResponseCreatedEvent, ResponseOutputItemDoneEvent
+from util import encode_project_resource_id
+
+from urllib.parse import quote
+
 
 from openai import AsyncOpenAI
 
@@ -289,7 +291,13 @@ async def history(
 async def get_chat_agent(
     agent: AgentVersionObject = Depends(get_agent_version_obj),
 ):
-    return JSONResponse(content={"name": agent.name, "metadata": agent.metadata})
+    wsid = os.environ.get("AZURE_EXISTING_AIPROJECT_RESOURCE_ID")
+    agent_id = os.environ.get("AZURE_EXISTING_AGENT_ID")
+    agent_name = agent_id.split(":")[0]
+    agent_version = agent_id.split(":")[1]
+    agent_playground_url = f"https://ai.azure.com/nextgen/r/{encode_project_resource_id(wsid)}/build/agents/{quote(agent_name)}/build?version={agent_version}"
+    return JSONResponse(content={"name": agent.name, "metadata": agent.metadata, "agentPlaygroundUrl": agent_playground_url})
+
 
 @router.post("/chat")
 async def chat(
@@ -338,40 +346,3 @@ async def chat(
     response.set_cookie("conversation_id", conversation_id)
     response.set_cookie("agent_id", agent_id)
     return response
-
-def read_file(path: str) -> str:
-    with open(path, 'r') as file:
-        return file.read()
-
-@router.get("/config/azure")
-async def get_azure_config(_ = auth_dependency):
-    """Get Azure configuration for frontend use"""
-    try:
-        subscription_id = os.environ.get("AZURE_SUBSCRIPTION_ID", "")
-        tenant_id = os.environ.get("AZURE_TENANT_ID", "")
-        resource_group = os.environ.get("AZURE_RESOURCE_GROUP", "")
-        ai_project_resource_id = os.environ.get("AZURE_EXISTING_AIPROJECT_RESOURCE_ID", "")
-        
-        # Extract resource name and project name from the resource ID
-        # Format: /subscriptions/{sub}/resourceGroups/{rg}/providers/Microsoft.CognitiveServices/accounts/{resource}/projects/{project}
-        resource_name = ""
-        project_name = ""
-        
-        if ai_project_resource_id:
-            parts = ai_project_resource_id.split("/")
-            if len(parts) >= 8:
-                resource_name = parts[8]  # accounts/{resource_name}
-            if len(parts) >= 10:
-                project_name = parts[10]  # projects/{project_name}
-        
-        return JSONResponse({
-            "subscriptionId": subscription_id,
-            "tenantId": tenant_id,
-            "resourceGroup": resource_group,
-            "resourceName": resource_name,
-            "projectName": project_name,
-            "wsid": ai_project_resource_id
-        })
-    except Exception as e:
-        logger.error(f"Error getting Azure config: {e}")
-        raise HTTPException(status_code=500, detail="Failed to get Azure configuration")
\ No newline at end of file
diff --git a/src/frontend/src/components/App.tsx b/src/frontend/src/components/App.tsx
index 38ba98c..796cb84 100644
--- a/src/frontend/src/components/App.tsx
+++ b/src/frontend/src/components/App.tsx
@@ -14,6 +14,7 @@ const App: React.FC = () => {
     metadata: {
       logo: "robot",
     },
+    agentPlaygroundUrl: "",
   });
 
   // Fetch agent details when component mounts
@@ -52,6 +53,7 @@ const App: React.FC = () => {
             metadata: {
               logo: "robot",
             },
+            agentPlaygroundUrl: "",
           });
         }
       } catch (error) {
@@ -67,6 +69,7 @@ const App: React.FC = () => {
           metadata: {
             logo: "robot",
           },
+          agentPlaygroundUrl: "",
         });
       }
     };
diff --git a/src/frontend/src/components/agents/AgentPreview.tsx b/src/frontend/src/components/agents/AgentPreview.tsx
index 07ea759..10e17f9 100644
--- a/src/frontend/src/components/agents/AgentPreview.tsx
+++ b/src/frontend/src/components/agents/AgentPreview.tsx
@@ -15,8 +15,7 @@ import { AgentPreviewChatBot } from "./AgentPreviewChatBot";
 import { MenuButton } from "../core/MenuButton/MenuButton";
 import { IChatItem } from "./chatbot/types";
 import { Waves } from "./Waves";
-/* temporarily disable BuiltWithBadge */
-// import { BuiltWithBadge } from "./BuiltWithBadge";
+import { BuiltWithBadge } from "./BuiltWithBadge";
 
 import styles from "./AgentPreview.module.css";
 
@@ -39,6 +38,7 @@ interface IAgent {
   };
   metadata?: Record<string, any>;
   response_format?: "auto" | string;
+  agentPlaygroundUrl: string;
 }
 
 interface IAgentPreviewProps {
@@ -601,8 +601,11 @@ export function AgentPreview({ agentDetails }: IAgentPreviewProps): ReactNode {
           )}
         </div>
 
-        {/* temporarily disable BuiltWithBadge */}
-        {/* <BuiltWithBadge className={styles.builtWithBadge} /> */}
+        {agentDetails.agentPlaygroundUrl && agentDetails.agentPlaygroundUrl.length > 0 ? (
+          <BuiltWithBadge className={styles.builtWithBadge} agentPlaygroundUrl={agentDetails.agentPlaygroundUrl} />
+        ) : (
+          <></>
+        )}
       </div>
 
       {/* Settings Panel */}
diff --git a/src/frontend/src/components/agents/BuiltWithBadge.tsx b/src/frontend/src/components/agents/BuiltWithBadge.tsx
index 0f478b1..b709e1a 100644
--- a/src/frontend/src/components/agents/BuiltWithBadge.tsx
+++ b/src/frontend/src/components/agents/BuiltWithBadge.tsx
@@ -1,4 +1,4 @@
-import { ReactNode, useEffect, useState } from "react";
+import { ReactNode } from "react";
 import { Caption1Strong } from "@fluentui/react-components";
 import { ArrowRight16Filled } from "@fluentui/react-icons";
 import clsx from "clsx";
@@ -6,50 +6,16 @@ import clsx from "clsx";
 import { AIFoundryLogo } from "../icons/AIFoundryLogo";
 import styles from "./BuiltWithBadge.module.css";
 
-interface AzureConfig {
-  subscriptionId: string;
-  tenantId: string;
-  resourceGroup: string;
-  resourceName: string;
-  projectName: string;
-  wsid: string;
-}
-
 export function BuiltWithBadge({
   className,
+  agentPlaygroundUrl
 }: {
   className?: string;
+  agentPlaygroundUrl?: string;
 }): ReactNode {
-  const [azureConfig, setAzureConfig] = useState<AzureConfig | null>(null);
-
-  useEffect(() => {
-    const fetchAzureConfig = async () => {
-      try {
-        const response = await fetch("/config/azure");
-        if (response.ok) {
-          const config = await response.json();
-          setAzureConfig(config);
-        } else {
-          console.error("Failed to fetch Azure configuration");
-        }
-      } catch (error) {
-        console.error("Error fetching Azure configuration:", error);
-      }
-    };
-
-    fetchAzureConfig();
-  }, []);
 
   const handleClick = () => {
-    if (azureConfig) {
-      const { wsid, tenantId } = azureConfig;
-      const azureAiUrl = `https://ai.azure.com/resource/agentsList?wsid=${encodeURIComponent(
-        wsid
-      )}&tid=${tenantId}`;
-      window.open(azureAiUrl, "_blank");
-    } else {
-      console.log("Azure configuration not available");
-    }
+    window.open(agentPlaygroundUrl, "_blank");
   };
   return (
     <button
diff --git a/src/util.py b/src/util.py
index 57fdf73..8fb936a 100644
--- a/src/util.py
+++ b/src/util.py
@@ -1,8 +1,12 @@
 # Copyright (c) Microsoft. All rights reserved.
 # Licensed under the MIT license. See LICENSE.md file in the project root for full license information.
 
-import os
-import json
+import os, json, base64
+from enum import IntEnum
+from typing import Dict
+from dataclasses import dataclass, field
+from urllib.parse import quote
+
 
 def get_env_file_path():
     """
@@ -47,4 +51,209 @@ def get_env_file_path():
         
     except Exception as e:
         # On any error, return None to use default
-        return None
\ No newline at end of file
+        return None
+    
+
+# Constants
+DEFAULT_NS_TYPE = "Microsoft.CognitiveServices"
+DELIM = ","
+
+
+class _ProjectResourceIdKind(IntEnum):
+    """Enum for resource ID kinds"""
+    Invalid = 0
+    Subscription = 1
+    ResourceGroup = 2
+    Provider = 3
+    Resource = 4
+
+
+class _ResourceIdOrders(IntEnum):
+    """Enum for resource ID ordering"""
+    Subscription = 1
+    ResourceGroup = 3
+    Provider = 5
+    ResourceSegments = 7
+
+
+class ResourceSegmentMap(Dict[str, str]):
+    """Map for resource segments"""
+    pass
+
+
+@dataclass
+class _ProjectResourceId:
+    """Project Resource ID interface"""
+    subscription: str = ""
+    resource_group: str = ""
+    provider: str = ""
+    kind: _ProjectResourceIdKind = _ProjectResourceIdKind.Invalid
+    is_valid: bool = False
+    resource_segments: ResourceSegmentMap = field(default_factory=ResourceSegmentMap)
+
+
+def get_default_resource_id() -> _ProjectResourceId:
+    """Returns a default resource ID object"""
+    return _ProjectResourceId()
+
+
+def compare(str1: str, str2: str, ignore_case: bool = False) -> int:
+    """
+    Compare two strings
+    Returns 0 if equal, -1 if str1 < str2, 1 if str1 > str2
+    """
+    if ignore_case:
+        str1 = str1.lower()
+        str2 = str2.lower()
+    
+    if str1 == str2:
+        return 0
+    elif str1 < str2:
+        return -1
+    else:
+        return 1
+
+
+def _parse_project_resource_id(resource_id: str) -> _ProjectResourceId:
+    """
+    Parses the specified project resource ID and returns an object which has subscription/resourceGroup/provider fields
+    populated. If there are any resource segments exist in the id, resourceSegments field is also populated.
+
+    Args:
+        resource_id: Resource ID of the resource to parse.
+    
+    Returns:
+        ResourceId object with parsed components
+    """
+    id_parts = (resource_id or '').split('/')
+    first_part = id_parts[0] if id_parts else ''
+    
+
+    parsed_resource_id = get_default_resource_id()
+    part_count = len(id_parts)
+    
+    for index in range(1, part_count, 2):
+        token_name = id_parts[index]
+        token_value = id_parts[index + 1] if index + 1 < len(id_parts) else ''
+        
+        if (
+            compare(token_name, 'subscriptions', ignore_case=True) == 0 and
+            index == _ResourceIdOrders.Subscription
+        ):
+            parsed_resource_id.subscription = token_value
+            parsed_resource_id.kind = _ProjectResourceIdKind.Subscription
+        elif (
+            compare(token_name, 'resourceGroups', ignore_case=True) == 0 and
+            index == _ResourceIdOrders.ResourceGroup
+        ):
+            parsed_resource_id.resource_group = token_value
+            parsed_resource_id.kind = _ProjectResourceIdKind.ResourceGroup
+        elif (
+            compare(token_name, 'providers', ignore_case=True) == 0 and
+            index == _ResourceIdOrders.Provider
+        ):
+            parsed_resource_id.provider = token_value
+            parsed_resource_id.kind = _ProjectResourceIdKind.Provider
+        elif (
+            compare(token_name, 'providers', ignore_case=True) != 0 and
+            index >= _ResourceIdOrders.Provider
+        ):
+            parsed_resource_id.kind = _ProjectResourceIdKind.Resource
+            parsed_resource_id.resource_segments[token_name] = token_value
+
+    # All kinds require a subscription
+    if not parsed_resource_id.subscription:
+        parsed_resource_id.kind = _ProjectResourceIdKind.Invalid
+
+    # Enforce kinds that require a valid resource group
+    if (
+        parsed_resource_id.kind in [_ProjectResourceIdKind.ResourceGroup, _ProjectResourceIdKind.Provider, _ProjectResourceIdKind.Resource] and
+        not parsed_resource_id.resource_group
+    ):
+        parsed_resource_id.kind = _ProjectResourceIdKind.Invalid
+
+    # Enforce kinds that require a provider
+    if (
+        parsed_resource_id.kind in [_ProjectResourceIdKind.Provider, _ProjectResourceIdKind.Resource] and
+        not parsed_resource_id.provider
+    ):
+        parsed_resource_id.kind = _ProjectResourceIdKind.Invalid
+
+    parsed_resource_id.is_valid = parsed_resource_id.kind != _ProjectResourceIdKind.Invalid
+    
+    return parsed_resource_id
+
+
+def _compress_guid(guid: str) -> str:
+    """
+    Compress a GUID by converting to base64url encoding.
+    
+    Args:
+        guid: GUID string to compress (e.g., "12345678-1234-1234-1234-123456789abc")
+    
+    Returns:
+        Base64url-encoded GUID string without padding
+    
+    Example:
+        Input: "12345678-1234-5678-1234-567812345678"
+        Output: "{base64url-encoded-string}"
+    """
+    # Remove hyphens from GUID
+    hex_str = guid.replace('-', '')
+    
+    # Convert hex string to bytes
+    binary_str = bytes.fromhex(hex_str)
+    
+    # Base64 encode
+    base64_str = base64.b64encode(binary_str).decode('utf-8')
+    
+    # Convert to base64url format (replace +/= with -_)
+    return base64_str.replace('+', '-').replace('/', '_').rstrip('=')
+
+
+def encode_project_resource_id(project_resource_id: str) -> str:
+    """
+    Encode a project resource ID into a compressed format.
+    
+    This function parses a project resource ID and encodes it into a compact string format:
+    - Compresses the subscription GUID to base64url encoding
+    - URL-encodes the resource group name
+    - Optionally includes the provider (if not the default)
+    - URL-encodes the account name
+    - Optionally includes the project name if present
+    
+    Args:
+        project_resource_id: Project resource ID to encode
+    
+    Returns:
+        Encoded resource ID string with segments separated by commas
+    
+    Raises:
+        ValueError: If the project resource ID format is invalid or not an account resource
+    
+    Example:
+        Input: /subscriptions/{subscription-id}/resourceGroups/{resource-group-name}/
+               providers/Microsoft.CognitiveServices/accounts/{account-name}/projects/{project-name}
+        Output: {compressed-subscription-id},{resource-group-name},,{account-name},{project-name}
+    """
+    parsed = _parse_project_resource_id(project_resource_id)
+    
+    if (
+        not parsed.is_valid or
+        parsed.kind != _ProjectResourceIdKind.Resource or
+        'accounts' not in parsed.resource_segments
+    ):
+        raise ValueError('Invalid project resource ID format.')
+    
+    encoded_resource_id_segments = [
+        _compress_guid(parsed.subscription),
+        quote(parsed.resource_group),
+        '' if parsed.provider == DEFAULT_NS_TYPE else quote(parsed.provider),
+        quote(parsed.resource_segments.get('accounts', '')),
+    ]
+    
+    project_name = parsed.resource_segments.get('projects', '')
+    if project_name:
+        encoded_resource_id_segments.append(quote(project_name))
+    
+    return DELIM.join(encoded_resource_id_segments)