feat: onboarding v2 base setup

SigNoz · Sep 3, 2024 · c163163 · c163163
1 parent 709c286
commit c163163
Show file tree

Hide file tree

Showing 10 changed files with 42 additions and 0 deletions.
diff --git a/frontend/src/AppRoutes/pageComponents.ts b/frontend/src/AppRoutes/pageComponents.ts
@@ -66,6 +66,10 @@ export const Onboarding = Loadable(
 	() => import(/* webpackChunkName: "Onboarding" */ 'pages/OnboardingPage'),
 );
 
+export const OnboardingV2 = Loadable(
+	() => import(/* webpackChunkName: "Onboarding" */ 'pages/OnboardingPageV2'),
+);
+
 export const DashboardPage = Loadable(
 	() =>
 		import(/* webpackChunkName: "DashboardPage" */ 'pages/DashboardsListPage'),

diff --git a/frontend/src/AppRoutes/routes.ts b/frontend/src/AppRoutes/routes.ts
@@ -29,6 +29,7 @@ import {
 	NewDashboardPage,
 	OldLogsExplorer,
 	Onboarding,
+	OnboardingV2,
 	OrganizationSettings,
 	PasswordReset,
 	PipelinePage,
@@ -66,6 +67,13 @@ const routes: AppRoutes[] = [
 		isPrivate: true,
 		key: 'GET_STARTED',
 	},
+	{
+		path: ROUTES.GET_STARTED_V2,
+		exact: false,
+		component: OnboardingV2,
+		isPrivate: true,
+		key: 'GET_STARTED_V2',
+	},
 	{
 		component: LogsIndexToFields,
 		path: ROUTES.LOGS_INDEX_FIELDS,

diff --git a/frontend/src/constants/routes.ts b/frontend/src/constants/routes.ts
@@ -8,6 +8,7 @@ const ROUTES = {
 	TRACE_DETAIL: '/trace/:id',
 	TRACES_EXPLORER: '/traces-explorer',
 	GET_STARTED: '/get-started',
+	GET_STARTED_V2: '/get-started-v2',
 	GET_STARTED_APPLICATION_MONITORING: '/get-started/application-monitoring',
 	GET_STARTED_LOGS_MANAGEMENT: '/get-started/logs-management',
 	GET_STARTED_INFRASTRUCTURE_MONITORING:

diff --git a/frontend/src/container/AppLayout/index.tsx b/frontend/src/container/AppLayout/index.tsx
@@ -213,6 +213,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 	const pageTitle = t(routeKey);
 	const renderFullScreen =
 		pathname === ROUTES.GET_STARTED ||
+		pathname === ROUTES.GET_STARTED_V2 ||
 		pathname === ROUTES.WORKSPACE_LOCKED ||
 		pathname === ROUTES.GET_STARTED_APPLICATION_MONITORING ||
 		pathname === ROUTES.GET_STARTED_INFRASTRUCTURE_MONITORING ||

diff --git a/frontend/src/container/SideNav/config.ts b/frontend/src/container/SideNav/config.ts
@@ -27,6 +27,7 @@ export const routeConfig: Record<string, QueryParams[]> = {
 	[ROUTES.ERROR_DETAIL]: [QueryParams.resourceAttributes],
 	[ROUTES.HOME_PAGE]: [QueryParams.resourceAttributes],
 	[ROUTES.GET_STARTED]: [QueryParams.resourceAttributes],
+	[ROUTES.GET_STARTED_V2]: [QueryParams.resourceAttributes],
 	[ROUTES.LIST_ALL_ALERT]: [QueryParams.resourceAttributes],
 	[ROUTES.LIST_LICENSES]: [QueryParams.resourceAttributes],
 	[ROUTES.LOGIN]: [QueryParams.resourceAttributes],

diff --git a/frontend/src/container/SideNav/menuItems.tsx b/frontend/src/container/SideNav/menuItems.tsx
@@ -30,6 +30,12 @@ export const getStartedMenuItem = {
 	icon: <RocketOutlined rotate={45} />,
 };
 
+export const getStartedV2MenuItem = {
+	key: ROUTES.GET_STARTED_V2,
+	label: 'Get Started V2',
+	icon: <RocketOutlined rotate={45} />,
+};
+
 export const inviteMemberMenuItem = {
 	key: `${ROUTES.ORG_SETTINGS}#invite-team-members`,
 	label: 'Invite Team Member',
@@ -67,6 +73,11 @@ export const trySignozCloudMenuItem: SidebarItem = {
 };
 
 const menuItems: SidebarItem[] = [
+	{
+		key: ROUTES.GET_STARTED_V2,
+		label: 'Get Started V2',
+		icon: <RocketOutlined size={16} />,
+	},
 	{
 		key: ROUTES.APPLICATION,
 		label: 'Services',

diff --git a/frontend/src/container/TopNav/Breadcrumbs/index.tsx b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
@@ -9,6 +9,7 @@ const breadcrumbNameMap: Record<string, string> = {
 	[ROUTES.SERVICE_MAP]: 'Service Map',
 	[ROUTES.USAGE_EXPLORER]: 'Usage Explorer',
 	[ROUTES.GET_STARTED]: 'Get Started',
+	[ROUTES.GET_STARTED_V2]: 'Get Started V2',
 	[ROUTES.ALL_CHANNELS]: 'Channels',
 	[ROUTES.SETTINGS]: 'Settings',
 	[ROUTES.DASHBOARD]: 'Dashboard',

diff --git a/frontend/src/pages/OnboardingPageV2/OnboardingPageV2.tsx b/frontend/src/pages/OnboardingPageV2/OnboardingPageV2.tsx
@@ -0,0 +1,11 @@
+import { Typography } from 'antd';
+
+function OnboardingPageV2(): JSX.Element {
+	return (
+		<div className="onboarding-v2">
+			<Typography.Title>Onboarding V2</Typography.Title>
+		</div>
+	);
+}
+
+export default OnboardingPageV2;
diff --git a/frontend/src/pages/OnboardingPageV2/index.tsx b/frontend/src/pages/OnboardingPageV2/index.tsx
@@ -0,0 +1,3 @@
+import OnboardingPage from './OnboardingPageV2';
+
+export default OnboardingPage;
diff --git a/frontend/src/utils/permission/index.ts b/frontend/src/utils/permission/index.ts
@@ -84,6 +84,7 @@ export const routePermission: Record<keyof typeof ROUTES, ROLES[]> = {
 	LOGS_PIPELINES: ['ADMIN', 'EDITOR', 'VIEWER'],
 	TRACE_EXPLORER: ['ADMIN', 'EDITOR', 'VIEWER'],
 	GET_STARTED: ['ADMIN', 'EDITOR', 'VIEWER'],
+	GET_STARTED_V2: ['ADMIN', 'EDITOR', 'VIEWER'],
 	GET_STARTED_APPLICATION_MONITORING: ['ADMIN', 'EDITOR', 'VIEWER'],
 	GET_STARTED_INFRASTRUCTURE_MONITORING: ['ADMIN', 'EDITOR', 'VIEWER'],
 	GET_STARTED_LOGS_MANAGEMENT: ['ADMIN', 'EDITOR', 'VIEWER'],