Skip to content

Add Ona banner notification #20908

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jun 17, 2025
Merged

Add Ona banner notification #20908

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
98f5b7b
Add Ona banner notification with gradient background
Siddhant-K-code Jun 17, 2025
d1f6fac
nit fix
Siddhant-K-code Jun 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 13 additions & 13 deletions components/dashboard/src/AppNotifications.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import { useOrgBillingMode } from "./data/billing-mode/org-billing-mode-query";
import { Organization } from "@gitpod/public-api/lib/gitpod/v1/organization_pb";
import { MaintenanceModeBanner } from "./org-admin/MaintenanceModeBanner";
import { MaintenanceNotificationBanner } from "./org-admin/MaintenanceNotificationBanner";
import onaWordmark from "./images/ona-wordmark.svg";

const KEY_APP_DISMISSED_NOTIFICATIONS = "gitpod-app-notifications-dismissed";
const PRIVACY_POLICY_LAST_UPDATED = "2025-05-16";
Expand Down Expand Up @@ -97,12 +98,7 @@ const GITPOD_FLEX_INTRODUCTION = (updateUser: (user: Partial<UserProtocol>) => P
message: (
<span className="text-md">
<b>Introducing Gitpod Flex:</b> self-host for free in 3 min or run locally using Gitpod Desktop |{" "}
<a
className="text-kumquat-ripe font-bold"
href="https://app.gitpod.io"
target="_blank"
rel="noreferrer"
>
<a className="text-kumquat-ripe" href="https://app.gitpod.io" target="_blank" rel="noreferrer">
Try now
</a>
</span>
Expand Down Expand Up @@ -138,12 +134,12 @@ const GITPOD_CLASSIC_SUNSET = {
type: "info" as AlertType,
preventDismiss: true, // This makes it so users can't dismiss the notification
message: (
<span className="text-md">
<b>Gitpod Classic is sunsetting fall 2025.</b>{" "}
<a className="text-kumquat-base font-bold" href="https://app.gitpod.io" target="_blank" rel="noreferrer">
Try the new Gitpod
</a>{" "}
now (hosted compute coming soon)
<span className="text-md text-white font-semibold items-center justify-center">
Meet <img src={onaWordmark} alt="Ona" className="inline align-middle w-12 mb-0.5" draggable="false" /> | the
privacy-first software engineering agent |{" "}
<a href="https://ona.com/" target="_blank" rel="noreferrer" className="underline hover:no-underline">
Get early access
</a>
</span>
),
} as Notification;
Expand Down Expand Up @@ -228,7 +224,11 @@ export function AppNotifications() {
}
}}
showIcon={true}
className="flex rounded mb-2 w-full"
className={`flex rounded mb-2 w-full ${
topNotification.id === "gitpod-classic-sunset"
? "bg-[linear-gradient(to_left,#1F1329_0%,#333A75_20%,#556CA8_40%,#90A898_60%,#E2B15C_80%,#E2B15C_97%,#BEA462_100%)]"
: ""
}`}
>
<span>{topNotification.message}</span>
</Alert>
Expand Down
Loading