fix: return end user top spend

This commit is contained in:
Krrish Dholakia 2024-02-29 19:11:50 -08:00
parent 7f2e12cd10
commit e643eb11fe
2 changed files with 80 additions and 44 deletions

View file

@ -601,7 +601,7 @@ class PrismaClient:
except Exception as e:
sql_query = """
CREATE VIEW "Last30dTopEndUsersSpend" AS
SELECT end_user, SUM(spend) AS total_spend
SELECT end_user, COUNT(*) AS total_events, SUM(spend) AS total_spend
FROM "LiteLLM_SpendLogs"
WHERE end_user <> '' AND end_user <> user
AND "startTime" >= CURRENT_DATE - INTERVAL '30 days'

View file

@ -5,16 +5,19 @@ import {
Subtitle,
Table,
TableHead,
TableHeaderCell,
TableRow,
TableCell,
TableBody,
Tab,
TabGroup,
TabList,
TabPanels,
Metric,
Grid,
TabPanel,
} from "@tremor/react";
import { userInfoCall } from "./networking";
import { userInfoCall, adminTopEndUsersCall } from "./networking";
import { Badge, BadgeDelta, Button } from "@tremor/react";
import RequestAccess from "./request_model_access";
import CreateUser from "./create_user_button";
@ -33,6 +36,7 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
userID,
}) => {
const [userData, setUserData] = useState<null | any[]>(null);
const [endUsers, setEndUsers] = useState<null | any[]>(null);
const [currentPage, setCurrentPage] = useState(1);
const defaultPageSize = 25;
@ -56,9 +60,26 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
}
};
if (accessToken && token && userRole && userID) {
if (accessToken && token && userRole && userID && !userData) {
fetchData();
}
const fetchEndUserSpend = async () => {
try {
const topEndUsers = await adminTopEndUsersCall(accessToken);
console.log("user data response:", topEndUsers);
setEndUsers(topEndUsers);
} catch (error) {
console.error("There was an error fetching the model data", error);
}
};
if (
userRole &&
(userRole == "Admin" || userRole == "Admin Viewer") &&
!endUsers
) {
fetchEndUserSpend();
}
}, [accessToken, token, userRole, userID]);
if (!userData) {
@ -105,31 +126,22 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
<div style={{ width: "100%" }}>
<Grid className="gap-2 p-10 h-[75vh] w-full">
<CreateUser userID={userID} accessToken={accessToken} />
<Card>
<Card className="w-full mx-auto flex-auto overflow-y-auto max-h-[50vh] mb-4">
<TabGroup>
<TabList variant="line" defaultValue="1">
<Tab value="1">Key Owners</Tab>
<Tab value="2">End-Users</Tab>
</TabList>
</TabGroup>
<TabPanels>
<TabPanel>
<Table className="mt-5">
<TableHead>
<TableRow>
<TableCell>
<Title>User ID </Title>
</TableCell>
<TableCell>
<Title>User Role</Title>
</TableCell>
<TableCell>
<Title>User Models</Title>
</TableCell>
<TableCell>
<Title>User Spend ($ USD)</Title>
</TableCell>
<TableCell>
<Title>User Max Budget ($ USD)</Title>
</TableCell>
<TableHeaderCell>User ID</TableHeaderCell>
<TableHeaderCell>User Role</TableHeaderCell>
<TableHeaderCell>User Models</TableHeaderCell>
<TableHeaderCell>User Spend ($ USD)</TableHeaderCell>
<TableHeaderCell>User Max Budget ($ USD)</TableHeaderCell>
</TableRow>
</TableHead>
<TableBody>
@ -152,6 +164,30 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
))}
</TableBody>
</Table>
</TabPanel>
<TabPanel>
<Table>
<TableHead>
<TableRow>
<TableHeaderCell>End User</TableHeaderCell>
<TableHeaderCell>Spend</TableHeaderCell>
<TableHeaderCell>Total Events</TableHeaderCell>
</TableRow>
</TableHead>
<TableBody>
{endUsers?.map((user: any, index: number) => (
<TableRow key={index}>
<TableCell>{user.end_user}</TableCell>
<TableCell>{user.total_spend}</TableCell>
<TableCell>{user.total_events}</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</TabPanel>
</TabPanels>
</TabGroup>
</Card>
{renderPagination()}
</Grid>