diff --git a/ui/litellm-dashboard/src/components/navbar.tsx b/ui/litellm-dashboard/src/components/navbar.tsx
index ebba1e20989..ba251786287 100644
--- a/ui/litellm-dashboard/src/components/navbar.tsx
+++ b/ui/litellm-dashboard/src/components/navbar.tsx
@@ -1,7 +1,17 @@
+"use client";
+
 import Link from 'next/link';
 import Image from 'next/image'
 import React, { useState } from 'react';
+import { useSearchParams } from "next/navigation";
+import { Button, Text, Metric,Title, TextInput, Grid, Col } from "@tremor/react";
 function Navbar() {
+    const searchParams = useSearchParams();
+
+    const userID = searchParams.get("userID");
+
+    console.log("User ID:", userID);
+
     return (
         <nav className="left-0 right-0 top-0 flex justify-between items-center h-12">
             <div className="text-left mx-4 my-2 absolute top-0 left-0">
@@ -12,13 +22,11 @@ function Navbar() {
             </div>
             </div>
             <div className="text-right mx-4 my-2 absolute top-0 right-0">
-            <a href="https://docs.litellm.ai/docs/" target="_blank" rel="noopener noreferrer">
-                <button className="border border-gray-800 rounded-lg text-gray-800 text-xl px-4 py-1 rounded p-1 mr-2 text-center">Docs</button>
-            </a>
-            <a href="https://calendly.com/d/4mp-gd3-k5k/berriai-1-1-onboarding-litellm-hosted-version" target="_blank" rel="noopener noreferrer">
-                <button className="border border-gray-800 rounded-lg text-gray-800 text-xl px-4 py-1 rounded p-1 text-center">Schedule Demo</button>
-            </a>
+                <Button color='transparent'>
+                <Title>{userID}</Title>
+                </Button>
             </div>
+            
         </nav>
     )
 }