From 3bc577bf12415e36927fee10a7cb94276e0c13be Mon Sep 17 00:00:00 2001 From: Ishaan Jaff Date: Fri, 28 Feb 2025 13:30:01 -0800 Subject: [PATCH] fix session handling ui --- .../src/app/onboarding/page.tsx | 3 +- .../src/components/navbar.tsx | 3 +- .../src/components/networking.tsx | 4 +-- .../src/components/user_dashboard.tsx | 3 +- ui/litellm-dashboard/src/utils/cookies.ts | 28 +++++++++++++++++++ 5 files changed, 36 insertions(+), 5 deletions(-) create mode 100644 ui/litellm-dashboard/src/utils/cookies.ts diff --git a/ui/litellm-dashboard/src/app/onboarding/page.tsx b/ui/litellm-dashboard/src/app/onboarding/page.tsx index ff301d7a474..39893528386 100644 --- a/ui/litellm-dashboard/src/app/onboarding/page.tsx +++ b/ui/litellm-dashboard/src/app/onboarding/page.tsx @@ -18,6 +18,7 @@ import { getOnboardingCredentials, claimOnboardingToken, } from "@/components/networking"; +import { setTokenCookie } from "@/utils/cookies"; import { jwtDecode } from "jwt-decode"; import { Form, Button as Button2, message } from "antd"; @@ -95,7 +96,7 @@ export default function Onboarding() { litellm_dashboard_ui += "?userID=" + user_id; // set cookie "token" to jwtToken - document.cookie = "token=" + jwtToken; + setTokenCookie(jwtToken); console.log("redirecting to:", litellm_dashboard_ui); window.location.href = litellm_dashboard_ui; diff --git a/ui/litellm-dashboard/src/components/navbar.tsx b/ui/litellm-dashboard/src/components/navbar.tsx index 325ad9c3595..8d8b5e5c8fd 100644 --- a/ui/litellm-dashboard/src/components/navbar.tsx +++ b/ui/litellm-dashboard/src/components/navbar.tsx @@ -4,6 +4,7 @@ import type { MenuProps } from "antd"; import { Dropdown } from "antd"; import { Organization } from "@/components/networking"; import { defaultOrg } from "@/components/common_components/default_org"; +import { setTokenCookie } from "@/utils/cookies"; import { UserOutlined, LogoutOutlined @@ -27,7 +28,7 @@ const Navbar: React.FC = ({ let logoutUrl = proxySettings?.PROXY_LOGOUT_URL || ""; const handleLogout = () => { - document.cookie = "token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; + setTokenCookie("") window.location.href = logoutUrl; }; diff --git a/ui/litellm-dashboard/src/components/networking.tsx b/ui/litellm-dashboard/src/components/networking.tsx index 828f92d7636..4796054c188 100644 --- a/ui/litellm-dashboard/src/components/networking.tsx +++ b/ui/litellm-dashboard/src/components/networking.tsx @@ -2,7 +2,7 @@ * Helper file for calls being made to proxy */ import { message } from "antd"; - +import { setTokenCookie } from "@/utils/cookies"; const isLocal = process.env.NODE_ENV === "development"; export const proxyBaseUrl = isLocal ? "http://localhost:4000" : null; if (isLocal != true) { @@ -50,7 +50,7 @@ const handleError = async (errorData: string) => { message.info("UI Session Expired. Logging out."); lastErrorTime = currentTime; await sleep(3000); // 5 second sleep - document.cookie = "token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; + setTokenCookie(""); window.location.href = baseUrl; } lastErrorTime = currentTime; diff --git a/ui/litellm-dashboard/src/components/user_dashboard.tsx b/ui/litellm-dashboard/src/components/user_dashboard.tsx index 8b9f5e328f0..6ba057f1034 100644 --- a/ui/litellm-dashboard/src/components/user_dashboard.tsx +++ b/ui/litellm-dashboard/src/components/user_dashboard.tsx @@ -18,6 +18,7 @@ import ViewUserTeam from "./view_user_team"; import DashboardTeam from "./dashboard_default_team"; import Onboarding from "../app/onboarding/page"; import { useSearchParams, useRouter } from "next/navigation"; +import { setTokenCookie } from "@/utils/cookies"; import { Team } from "./key_team_helpers/key_list"; import { jwtDecode } from "jwt-decode"; import { Typography } from "antd"; @@ -301,7 +302,7 @@ const UserDashboard: React.FC = ({ // clear cookie called "token" since user will be logging in again - document.cookie = "token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; + setTokenCookie(""); console.log("Full URL:", url); window.location.href = url; diff --git a/ui/litellm-dashboard/src/utils/cookies.ts b/ui/litellm-dashboard/src/utils/cookies.ts new file mode 100644 index 00000000000..f0b2bdcc4a6 --- /dev/null +++ b/ui/litellm-dashboard/src/utils/cookies.ts @@ -0,0 +1,28 @@ + /** + * Utility functions for cookie management + */ + +/** + * Get a cookie value by name + * @param name The name of the cookie to retrieve + * @returns The cookie value or null if not found + */ +export function getCookie(name: string): string | null { + const cookieValue = document.cookie + .split('; ') + .find(row => row.startsWith(name + '=')); + return cookieValue ? cookieValue.split('=')[1] : null; + } + + /** + * Set a token cookie, removing any existing ones first + * @param value The value to set for the token + * @param options Additional cookie options + */ + export function setTokenCookie(value: string): void { + // Delete existing token cookie by setting expiration in the past + document.cookie = "token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; + + // Set new token cookie with proper attributes + document.cookie = `token=${value}; path=/; max-age=2592000; SameSite=Strict`; + } \ No newline at end of file