diff --git a/components/dashboard/src/AppNotifications.tsx b/components/dashboard/src/AppNotifications.tsx
index 74aaa09df06a46..c6961a1352de62 100644
--- a/components/dashboard/src/AppNotifications.tsx
+++ b/components/dashboard/src/AppNotifications.tsx
@@ -6,7 +6,7 @@
import { useEffect, useState } from "react";
import Alert from "./components/Alert";
-import { getGitpodService } from "./service/service";
+import { getGitpodService, gitpodHostUrl } from "./service/service";
const KEY_APP_NOTIFICATIONS = "gitpod-app-notifications";
@@ -36,6 +36,7 @@ export function AppNotifications() {
};
const topNotification = notifications[0];
+
if (topNotification === undefined) {
return null;
}
@@ -45,6 +46,25 @@ export function AppNotifications() {
setNotifications([]);
};
+ const getManageBilling = () => {
+ let href;
+ if (notifications.length === 1) {
+ href = `${gitpodHostUrl}billing`;
+ } else if (notifications.length === 2) {
+ href = `${gitpodHostUrl}t/${notifications[notifications.length - 1]}/billing`;
+ }
+ return (
+
+ {" "}
+ Manage
+
+ {" "}
+ billing.
+
+
+ );
+ };
+
return (
{topNotification}
+ {getManageBilling()}
);
diff --git a/components/server/ee/src/workspace/gitpod-server-impl.ts b/components/server/ee/src/workspace/gitpod-server-impl.ts
index 877fef632525c5..8e4749e18addcb 100644
--- a/components/server/ee/src/workspace/gitpod-server-impl.ts
+++ b/components/server/ee/src/workspace/gitpod-server-impl.ts
@@ -2256,10 +2256,31 @@ export class GitpodServerEEImpl extends GitpodServerImpl {
const billingMode = await this.billingModes.getBillingModeForUser(user, new Date());
if (billingMode.mode === "usage-based") {
const limit = await this.billingService.checkUsageLimitReached(user);
- if (limit.reached) {
- result.unshift("The usage limit is reached.");
- } else if (limit.almostReached) {
- result.unshift("The usage limit is almost reached.");
+ let teamOrUser;
+ switch (limit.attributionId.kind) {
+ case "user": {
+ if (limit.reached) {
+ result.unshift(`You have reached your usage limit.`);
+ } else if (limit.almostReached) {
+ result.unshift(`You have reached 80% or more of your usage limit.`);
+ }
+ break;
+ }
+ case "team": {
+ teamOrUser = await this.teamDB.findTeamById(limit.attributionId.teamId);
+ if (teamOrUser) {
+ if (limit.reached) {
+ result.push(teamOrUser?.slug);
+ result.unshift(`Your team '${teamOrUser?.name}' has reached its usage limit.`);
+ } else if (limit.almostReached) {
+ result.push(teamOrUser?.slug);
+ result.unshift(
+ `Your team '${teamOrUser?.name}' has reached 80% or more of its usage limit.`,
+ );
+ }
+ }
+ break;
+ }
}
}
} catch (error) {