phoenix/litellm
1
0
Fork 0
forked from phoenix/litellm-mirror
Code Pull requests Activity

(fix) proxy dashboard

Browse source
This commit is contained in:
ishaan-jaff 2024-01-27 19:22:18 -08:00
parent 82091eb03a
commit 8dc78ca2a4
2 changed files with 58 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

92
ui/litellm-dashboard/src/components/enter_proxy_url.tsx
View file

@ -1,44 +1,58 @@
"use client";
import React, { use, useState } from "react";
import React, { useState } from "react";
import { Button, TextInput } from "@tremor/react";
import { Card, Text } from "@tremor/react";
import { Card, Metric, Text } from "@tremor/react";
import { createKeyCall } from "./networking";
// Define the props type
interface EnterProxyUrlProps {
onUrlChange: (url: string) => void;
}
const EnterProxyUrl: React.FC<EnterProxyUrlProps> = ({ onUrlChange }) => {
const [proxyUrl, setProxyUrl] = useState<string>('');
const handleUrlChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setProxyUrl(event.target.value);
};
const handleSaveClick = () => {
// You can perform any additional validation or actions here
// For now, let's just pass the entered URL to the parent component
onUrlChange(proxyUrl);
};
return (
<div>
<Card decoration="top" decorationColor="blue" style={{ width: '100%' }}>
<Text>Admin Configuration</Text>
<label htmlFor="proxyUrl">Enter Proxy URL:</label>
<TextInput
type="text"
id="proxyUrl"
value={proxyUrl}
onChange={handleUrlChange}
placeholder="https://your-proxy-endpoint.com"
/>
<Button onClick={handleSaveClick}>Save</Button>
</Card>
</div>
);
const EnterProxyUrl: React.FC = () => {
const [proxyUrl, setProxyUrl] = useState<string>("");
const [isUrlSaved, setIsUrlSaved] = useState<boolean>(false);
const handleUrlChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setProxyUrl(event.target.value);
// Reset the saved status when the URL changes
setIsUrlSaved(false);
};
export default EnterProxyUrl;
const handleSaveClick = () => {
// You can perform any additional validation or actions here
// For now, let's just display the message
setIsUrlSaved(true);
};
return (
<div>
<Card decoration="top" decorationColor="blue" style={{ width: '1000px' }}>
<Text>Admin Configuration</Text>
<label htmlFor="proxyUrl">Enter Proxy URL:</label>
<TextInput
type="text"
id="proxyUrl"
value={proxyUrl}
onChange={handleUrlChange}
placeholder="https://your-proxy-endpoint.com"
/>
<Button onClick={handleSaveClick}>Save</Button>
{/* Display message if the URL is saved */}
{isUrlSaved && (
<div>
<p>
Save this URL: {window.location.href + "?proxyBaseUrl=" + proxyUrl}
</p>
<p>
Go here 👉
<a href={window.location.href + "?proxyBaseUrl=" + proxyUrl} target="_blank" rel="noopener noreferrer">
{window.location.href + "?proxyBaseUrl=" + proxyUrl}
</a>
</p>
</div>
)}
</Card>
</div>
);
};
export default EnterProxyUrl;

8
ui/litellm-dashboard/src/components/user_dashboard.tsx
View file

@ -44,10 +44,12 @@ const UserDashboard = () => {
}
else if (userID == null || accessToken == null) {
// redirect to page: ProxyBaseUrl/google-login/key/generate
sessionStorage.setItem('returnUrl', window.location.href);
const baseUrl = proxyBaseUrl.endsWith('/') ? proxyBaseUrl : proxyBaseUrl + '/';
// Now you can construct the full URL
const url = `${baseUrl}google-login/key/generate`;
window.location.href = `${proxyBaseUrl}/google-login/key/generate`;
window.location.href = url;
return null;