diff --git a/ui/src/app/Onboarding.tsx b/ui/src/app/Onboarding.tsx
index ad6ab763ee..a0527a500f 100644
--- a/ui/src/app/Onboarding.tsx
+++ b/ui/src/app/Onboarding.tsx
@@ -3,7 +3,6 @@ import {
AcademicCapIcon,
BookOpenIcon,
ChatBubbleLeftIcon,
- CloudIcon,
CodeBracketIcon,
CommandLineIcon,
PuzzlePieceIcon,
@@ -24,14 +23,6 @@ const gettingStartedTiles = [
description: 'Learn how to create your first feature flag',
href: 'https://docs.flipt.io/introduction'
},
- {
- icon: CloudIcon,
- name: 'Introducing Flipt Cloud',
- className: 'sm:col-span-2',
- description:
- 'Learn about our SaaS offering that integrates with your Git repositories and can be used alongside your existing Flipt instances',
- href: 'https://docs.flipt.io/cloud/overview'
- },
{
icon: CommandLineIcon,
name: 'Try the CLI',
diff --git a/ui/src/app/events/eventSlice.ts b/ui/src/app/events/eventSlice.ts
index 55598202eb..ad80b4ec4b 100644
--- a/ui/src/app/events/eventSlice.ts
+++ b/ui/src/app/events/eventSlice.ts
@@ -4,12 +4,12 @@ import { RootState } from '~/store';
export const eventKey = 'event';
interface IEventState {
completedOnboarding: boolean;
- dismissedBanner_v1_49_0: boolean;
+ dismissedBanner_v1_54_0: boolean;
}
const initialState: IEventState = {
completedOnboarding: false,
- dismissedBanner_v1_49_0: false
+ dismissedBanner_v1_54_0: false
};
export const eventSlice = createSlice({
@@ -20,7 +20,7 @@ export const eventSlice = createSlice({
state.completedOnboarding = true;
},
bannerDismissed: (state) => {
- state.dismissedBanner_v1_49_0 = true;
+ state.dismissedBanner_v1_54_0 = true;
}
}
});
@@ -34,7 +34,7 @@ export const selectCompletedOnboarding = createSelector(
export const selectDismissedBanner = createSelector(
[(state: RootState) => state.user],
- (user) => user.dismissedBanner_v1_49_0
+ (user) => user.dismissedBanner_v1_54_0
);
export default eventSlice.reducer;
diff --git a/ui/src/components/Banner.tsx b/ui/src/components/Banner.tsx
index e25058e991..5be7bfb61a 100644
--- a/ui/src/components/Banner.tsx
+++ b/ui/src/components/Banner.tsx
@@ -6,10 +6,11 @@ type BannerProps = {
title: string;
description: string;
href: string;
+ icon?: React.ReactNode;
};
export default function Banner(props: BannerProps) {
- const { title, description, href } = props;
+ const { title, description, href, icon } = props;
const dispatch = useDispatch();
@@ -18,13 +19,17 @@ export default function Banner(props: BannerProps) {
{title}
-
+ {icon ? (
+ icon
+ ) : (
+
+ )}
{description}
→
diff --git a/ui/tests/onboarding.spec.ts b/ui/tests/onboarding.spec.ts
index 9fe38a8c1a..cd9753708e 100644
--- a/ui/tests/onboarding.spec.ts
+++ b/ui/tests/onboarding.spec.ts
@@ -9,11 +9,6 @@ test.describe('Onboarding', () => {
await expect(
page.getByRole('heading', { name: 'Get Started' })
).toBeVisible();
- await expect(
- page.getByRole('heading', {
- name: 'Introducing Flipt Cloud'
- })
- ).toBeVisible();
await expect(
page.getByRole('heading', { name: 'Try the CLI' })
).toBeVisible();
- 