From 1a8bfbca6ae7930cc8aa4c284e623e107e890030 Mon Sep 17 00:00:00 2001
From: ishaan-jaff <ishaanjaffer0324@gmail.com>
Date: Sat, 3 Feb 2024 12:09:10 -0800
Subject: [PATCH] (feat) display userID on navbar

---
 ui/litellm-dashboard/src/components/navbar.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/navbar.tsx b/ui/litellm-dashboard/src/components/navbar.tsx
index ba251786287..75b5ada9be4 100644
--- a/ui/litellm-dashboard/src/components/navbar.tsx
+++ b/ui/litellm-dashboard/src/components/navbar.tsx
@@ -5,11 +5,14 @@ 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() {
+
+// Define the props type
+interface NavbarProps {
+    userID: string | null;
+}
+const Navbar: React.FC<NavbarProps> = ({ userID }) => {
     const searchParams = useSearchParams();
-
-    const userID = searchParams.get("userID");
-
+    const token = searchParams.get("token");
     console.log("User ID:", userID);
 
     return (
@@ -22,7 +25,7 @@ function Navbar() {
             </div>
             </div>
             <div className="text-right mx-4 my-2 absolute top-0 right-0">
-                <Button color='transparent'>
+                <Button color="white">
                 <Title>{userID}</Title>
                 </Button>
             </div>