diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/cells/GithubCell.js b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/cells/GithubCell.js
index 922d7b3982..b97bed4822 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/cells/GithubCell.js
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/cells/GithubCell.js
@@ -117,6 +117,33 @@ function GithubCell(props){
             }
         </HorizontalStack>
         </Box>
+        <HorizontalStack gap={"2"}>
+        {
+            headers?.filter((header) => {
+                return header.itemOrder==4
+            }).filter((header) => {
+                return data[header.value]!=undefined && data[header.value]!="";
+            }).map((header) => {
+                return data?.[header?.value]
+                ?.map((item) =>
+                isBadgeClickable ? 
+                    <div onClick={() =>badgeClicked()} style={{cursor: "pointer"}} key={item}>
+                        <Badge status={getStatus(item)}>
+                            <Text {...header.dataProps}>
+                                {item}
+                            </Text>
+                        </Badge>
+                    </div>
+                    
+                : <Badge key={item} status={getStatus(item)}>
+                    <Text {...header.dataProps}>
+                        {item}
+                    </Text>
+                </Badge>
+                
+            )}) 
+        }
+        </HorizontalStack>
     </VerticalStack>
 </HorizontalStack>
 )
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/rows/row.css b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/rows/row.css
index 514d94a883..d481398085 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/rows/row.css
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/components/tables/rows/row.css
@@ -14,9 +14,6 @@
     padding-top: 12px !important;
     padding-bottom: 12px !important;
 }
-.Polaris-IndexTable-Checkbox__TableCellContentContainer {
-    padding-top: 3px !important;
-}
 
 .Polaris-IndexTable {
     border-radius: unset !important;
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/dashboard.css b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/dashboard.css
index 6dd8829405..00ecd78544 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/dashboard.css
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/dashboard.css
@@ -99,4 +99,9 @@
 
 .Polaris-VideoThumbnail__Thumbnail{
     border-radius: 8px !important;
+}
+
+.Polaris-Text--break {
+    white-space: normal !important;
+    word-break: break-all !important;
 }
\ No newline at end of file
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/GetPrettifyEndpoint.jsx b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/GetPrettifyEndpoint.jsx
new file mode 100644
index 0000000000..3df58078bf
--- /dev/null
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/GetPrettifyEndpoint.jsx
@@ -0,0 +1,43 @@
+import { Avatar, Badge, Box, HorizontalStack, Text, Tooltip } from '@shopify/polaris'
+import React, { useRef, useState } from 'react'
+import func from '@/util/func'
+import transform from '../onboarding/transform'
+import observeFunc from "./transform"
+function GetPrettifyEndpoint({method,url, isNew}){
+    const ref = useRef(null)
+    const [copyActive, setCopyActive] = useState(false)
+    return(
+        <div style={{display: 'flex', gap: '4px'}} ref={ref} onMouseEnter={() => setCopyActive(true)} onMouseLeave={() => setCopyActive(false)}>
+            <Box width="54px">
+                <HorizontalStack align="end">
+                    <span style={{color: transform.getTextColor(method), fontSize: "14px", fontWeight: 500, lineHeight: '20px'}}>{method}</span>
+                </HorizontalStack>
+            </Box>
+            <Box width="30vw">
+                <div style={{display: "flex", justifyContent: "space-between", gap:"24px"}}>
+                    <div style={{display: "flex"}}>
+                        <Box>
+                            <Text variant="bodyMd" fontWeight="medium" breakWord>{observeFunc.getTruncatedUrl(url)}</Text>
+                        </Box>
+                        {copyActive ? 
+                            <div onClick={(e) => {e.stopPropagation();func.copyToClipboard(url, ref, "URL copied");}}>
+                                <Tooltip content="Copy endpoint" dismissOnMouseOut>
+                                    <div className="reduce-size">
+                                        <Avatar size="extraSmall" source="/public/copy_icon.svg" />
+                                    </div>
+                                </Tooltip>
+                                <Box ref={ref} />
+                            </div>
+                        :null}
+                    </div>
+                    <Box>
+                        {isNew ? <Badge size="small">New</Badge> : null}
+                    </Box>
+                </div>
+            </Box>
+        </div> 
+    )
+}
+
+
+export default GetPrettifyEndpoint
\ No newline at end of file
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/ApiDetails.jsx b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/ApiDetails.jsx
index fa08cbfe81..955422234f 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/ApiDetails.jsx
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/ApiDetails.jsx
@@ -1,5 +1,5 @@
 import LayoutWithTabs from "../../../components/layouts/LayoutWithTabs"
-import { Box, Button, Modal } from "@shopify/polaris"
+import { Avatar, Box, Button, Icon, Modal, Tooltip } from "@shopify/polaris"
 import FlyLayout from "../../../components/layouts/FlyLayout";
 import GithubCell from "../../../components/tables/cells/GithubCell";
 import SampleDataList from "../../../components/shared/SampleDataList";
@@ -11,6 +11,7 @@ import AktoGptLayout from "../../../components/aktoGpt/AktoGptLayout";
 import func from "@/util/func"
 import transform from "../transform";
 import ApiDependency from "./ApiDependency";
+import { copy_icon } from "../../../components/icons";
 
 function ApiDetails(props) {
 
@@ -24,6 +25,8 @@ function ApiDetails(props) {
     const [loading, setLoading] = useState(false)
     const [badgeActive, setBadgeActive] = useState(false)
 
+    const ref = useRef(null)
+
     const fetchData = async() => {
         if(showDetails){
         setLoading(true)
@@ -128,17 +131,33 @@ function ApiDetails(props) {
             />
         </Box>,
     }
-    const components = [
+
+    const headingComp = (
+        <div style={{display: "flex", justifyContent: "space-between"}}  key="heading">
             <GithubCell
-            key="heading"
-            width="30vw"
-            nameWidth="27vw"
-            data={apiDetail}
-            headers={headers}
-            getStatus={getStatus}
-            isBadgeClickable={true}
-            badgeClicked={badgeClicked}
-        />,
+                width="40vw"
+                data={apiDetail}
+                headers={headers}
+                getStatus={getStatus}
+                isBadgeClickable={true}
+                badgeClicked={badgeClicked}
+            />
+            <Box paddingBlockStart={"05"}>
+                <Button plain onClick={() => func.copyToClipboard(apiDetail['endpoint'], ref, "URL copied")}>
+                    <Tooltip content="Copy endpoint" dismissOnMouseOut>
+                        <div className="reduce-size">
+                            <Avatar size="extraSmall" source="/public/copy_icon.svg" />
+                        </div>
+                    </Tooltip>
+                    <Box ref={ref} />
+                </Button>
+            </Box>
+        </div>
+    )
+
+    const components = [
+        headingComp
+            ,
         <LayoutWithTabs
             key="tabs"
             tabs={[SchemaTab, ValuesTab, DependencyTab]}
@@ -151,7 +170,7 @@ function ApiDetails(props) {
             className={"gpt-button-fixed"}
             key="akto-gpt"
         >
-            <Button onClick={displayGPT}>Ask AktoGPT</Button> 
+            <Button onClick={displayGPT} size="slim">Ask AktoGPT</Button> 
         </div>
     )
 
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/api_inventory.css b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/api_inventory.css
index 836821d534..3cf17ba6cf 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/api_inventory.css
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/api_inventory.css
@@ -6,9 +6,9 @@
 .gpt-button-fixed {
     position: absolute;
     z-index: 400;
-    right: 24px !important;
+    right: 48px !important;
     transition: right 0.3s ease-in-out;
-    top: 60px;
+    top: 15px;
 }
 
 .control-row .Polaris-IndexTable__TableCell {
@@ -19,6 +19,7 @@
 .condensed-row .Polaris-IndexTable__TableCell {
     padding-top: 8px !important;
     padding-bottom: 8px !important;
+    vertical-align: top !important;
 }
 
 .icons-style {
@@ -31,3 +32,8 @@
     border-radius: 32px;
     box-shadow: 0px 2px 16px 0px rgba(33, 43, 54, 0.08), 0px 0px 0px 1px rgba(6, 44, 82, 0.10);
 }
+
+.full-url{
+    overflow-x: hidden;
+    word-break: break-all;
+}
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/component/StyledEndpoint.jsx b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/component/StyledEndpoint.jsx
index 2f028c978a..80d2f54915 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/component/StyledEndpoint.jsx
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/api_collections/component/StyledEndpoint.jsx
@@ -1,11 +1,13 @@
-import { Tooltip, Text, HorizontalStack, Box } from "@shopify/polaris"
+import { Tooltip, Text, Box } from "@shopify/polaris"
 import func from "@/util/func"
 import "../api_inventory.css"
 import { useRef, useEffect, useState } from "react"
+import transform from "../../transform"
 
-const StyledEndpoint = (data, fontSize, variant) => {
+const StyledEndpoint = (data, fontSize, variant, shouldNotTruncate, showWithoutHost) => {
     const { method, url } = func.toMethodUrlObject(data)
-    const arr = url.split("/")
+    let absoluteUrl = showWithoutHost ? transform.getTruncatedUrl(url) : url
+    const arr = absoluteUrl.split("/")
     let colored = []
     arr.forEach((item, index) => {
         if (item.startsWith("{param")) {
@@ -35,28 +37,30 @@ const StyledEndpoint = (data, fontSize, variant) => {
 
     useEffect(() => {
         const element = ref.current;
-        setIsTruncated(element.scrollWidth > element.clientWidth);
+        if(!shouldNotTruncate){
+            setIsTruncated(element.scrollWidth > element.clientWidth);
+        }
     }, []);
 
     const endpoint = (
-        <HorizontalStack gap={"1"} wrap={false}>
+        <div style={{display: 'flex', gap: "8px"}}>
             <div style={{color: getMethodColor(method), fontSize: finalFontSize, fontWeight: 600}}>
-                    {method}
-                </div>
-                <div className="styled-endpoint" ref={ref}>
-                    {
-                        arr?.map((item, index) => {
-                            return (
-                                <Box key={index} as={"span"} color={colored.includes(index) ? "text-critical-active" : ""}>
-                                    <Text as="span" variant={finalVariant}>
-                                    {item + "/"}
-                                </Text>
-                                </Box>
-                            )
-                        })
-                    }
-                </div>
-            </HorizontalStack>
+                {method}
+            </div>
+            <div className={shouldNotTruncate ? "full-url" : "styled-endpoint"} ref={ref}>
+                {
+                    arr?.map((item, index) => {
+                        return (
+                            <Box key={index} as={"span"} color={colored.includes(index) ? "text-critical-active" : ""}>
+                                <Text as="span" variant={finalVariant}>
+                                {item + "/"}
+                            </Text>
+                            </Box>
+                        )
+                    })
+                }
+            </div>
+        </div>
     )
 
     return (
diff --git a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/transform.js b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/transform.js
index a8d926240a..6626d6d062 100644
--- a/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/transform.js
+++ b/apps/dashboard/web/polaris_web/web/src/apps/dashboard/pages/observe/transform.js
@@ -1,11 +1,11 @@
 import func from "@/util/func";
 import { Badge, Box, HorizontalStack, Icon, Text, Tooltip } from "@shopify/polaris";
 import PersistStore from "../../../main/PersistStore";
-import tranform from "../onboarding/transform"
 import TooltipText from "../../components/shared/TooltipText";
 import StyledEndpoint from "./api_collections/component/StyledEndpoint"
 import { SearchMinor, InfoMinor, LockMinor, ClockMinor, PasskeyMinor, LinkMinor, DynamicSourceMinor, GlobeMinor, LocationsMinor, PriceLookupMinor } from "@shopify/polaris-icons"
 import api from "./api";
+import GetPrettifyEndpoint from "./GetPrettifyEndpoint";
 
 const standardHeaders = [
     'accept', 'accept-ch', 'accept-ch-lifetime', 'accept-charset', 'accept-encoding', 'accept-language', 'accept-patch', 'accept-post', 'accept-ranges', 'access-control-allow-credentials', 'access-control-allow-headers', 'access-control-allow-methods', 'access-control-allow-origin', 'access-control-expose-headers', 'access-control-max-age', 'access-control-request-headers', 'access-control-request-method', 'age', 'allow', 'alt-svc', 'alt-used', 'authorization',
@@ -41,7 +41,7 @@ const apiDetailsHeaders = [
         value: "parameterisedEndpoint",
         itemOrder: 1,
         showFilter: true,
-        component: StyledEndpoint
+        component: (data) => StyledEndpoint(data, "14px", "headingSm", true, true)
     },
     {
         text: 'Collection name',
@@ -58,8 +58,14 @@ const apiDetailsHeaders = [
     {
         text: 'Sensitive Params',
         value: 'sensitiveTags',
-        itemOrder: 2,
-        showFilter: true
+        itemOrder: 4,
+        showFilter: true,
+    },
+    {
+        text: 'hostname',
+        itemOrder: 3,
+        value: 'hostName',
+        icon: GlobeMinor,
     },
     {
         text: 'Last Seen',
@@ -248,7 +254,7 @@ const transform = {
     },
     prepareEndpointForTable(x, index) {
         const idToNameMap = PersistStore.getState().collectionsMap;
-        const endpointComp = this.getPrettifyEndpoint(x.method, x.url, false);
+        const endpointComp = <GetPrettifyEndpoint method={x.method} url={x.url} isNew={false} />
         const name = x.param.replaceAll("#", ".").replaceAll(".$", "")
 
         return {
@@ -414,7 +420,8 @@ const transform = {
     getTruncatedUrl(url){
         try {
             const parsedURL = new URL(url)
-            return parsedURL.pathname
+            const pathUrl = parsedURL.pathname.replace(/%7B/g, '{').replace(/%7D/g, '}');
+            return pathUrl
         } catch (error) {
             return url
         }
@@ -428,26 +435,6 @@ const transform = {
             return "No host"
         }
     },
-    
-    getPrettifyEndpoint(method,url, isNew){
-        return(   
-            <div style={{display: 'flex', gap: '4px'}}>
-                <Box width="54px">
-                    <HorizontalStack align="end">
-                        <span style={{color: tranform.getTextColor(method), fontSize: "14px", fontWeight: 500}}>{method}</span>
-                    </HorizontalStack>
-                </Box>
-                <Box width="200px" maxWidth="200px">
-                    <HorizontalStack align="space-between">
-                        <Box maxWidth={isNew ? "140px" : '180px'}>
-                            <TooltipText text={this.getTruncatedUrl(url)} tooltip={this.getTruncatedUrl(url)} textProps={{fontWeight: "medium"}} />
-                        </Box>
-                        {isNew ? <Badge size="small">New</Badge> : null}
-                    </HorizontalStack>
-                </Box>
-            </div> 
-        )
-    },
 
     getRiskScoreValue(severity){
         if(severity >= 100){
@@ -495,7 +482,7 @@ const transform = {
                 hostName: (hostNameMap[url.apiCollectionId] !== null ? hostNameMap[url.apiCollectionId] : this.getHostName(url.endpoint)),
                 access_type: url.access_type,
                 auth_type: url.auth_type,
-                endpointComp: this.getPrettifyEndpoint(url.method, url.endpoint, this.isNewEndpoint(url.lastSeenTs)),
+                endpointComp: <GetPrettifyEndpoint method={url.method} url={url.endpoint} isNew={this.isNewEndpoint(url.lastSeenTs)} />,
                 sensitiveTagsComp: this.prettifySubtypes(url.sensitiveTags),
                 riskScoreComp: <Badge status={this.getStatus(score)} size="small">{score.toString()}</Badge>,
                 riskScore: score,
@@ -583,4 +570,4 @@ const transform = {
       
 }
 
-export default transform
\ No newline at end of file
+export default transform
diff --git a/apps/dashboard/web/public/copy_icon.svg b/apps/dashboard/web/public/copy_icon.svg
new file mode 100644
index 0000000000..3da3dcfb32
--- /dev/null
+++ b/apps/dashboard/web/public/copy_icon.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12.8 12.8V14.76C12.8 15.5441 12.8 15.9361 12.6474 16.2356C12.5132 16.499 12.299 16.7132 12.0356 16.8474C11.7361 17 11.3441 17 10.56 17H5.24C4.45593 17 4.06389 17 3.76441 16.8474C3.50099 16.7132 3.28681 16.499 3.15259 16.2356C3 15.9361 3 15.5441 3 14.76V9.44C3 8.65593 3 8.26389 3.15259 7.96441C3.28681 7.70099 3.50099 7.48681 3.76441 7.35259C4.06389 7.2 4.45593 7.2 5.24 7.2H7.2M9.44 12.8H14.76C15.5441 12.8 15.9361 12.8 16.2356 12.6474C16.499 12.5132 16.7132 12.299 16.8474 12.0356C17 11.7361 17 11.3441 17 10.56V5.24C17 4.45593 17 4.06389 16.8474 3.76441C16.7132 3.50099 16.499 3.28681 16.2356 3.15259C15.9361 3 15.5441 3 14.76 3H9.44C8.65593 3 8.26389 3 7.96441 3.15259C7.70099 3.28681 7.48681 3.50099 7.35259 3.76441C7.2 4.06389 7.2 4.45593 7.2 5.24V10.56C7.2 11.3441 7.2 11.7361 7.35259 12.0356C7.48681 12.299 7.70099 12.5132 7.96441 12.6474C8.26389 12.8 8.65593 12.8 9.44 12.8Z" stroke="#8C9196" stroke-width="1.68" stroke-linecap="round" stroke-linejoin="round"/>
+</svg> 
\ No newline at end of file