From 829e1f0920e9ba977878c759a7f23a107dca5657 Mon Sep 17 00:00:00 2001
From: Yunus M <myounis.ar@live.com>
Date: Mon, 2 Sep 2024 23:52:12 +0530
Subject: [PATCH] feat: onboarding v2 base setup

---
 frontend/src/AppRoutes/pageComponents.ts              |  4 ++++
 frontend/src/AppRoutes/routes.ts                      |  8 ++++++++
 frontend/src/constants/routes.ts                      |  1 +
 frontend/src/container/AppLayout/index.tsx            |  2 ++
 frontend/src/container/SideNav/config.ts              |  1 +
 frontend/src/container/SideNav/menuItems.tsx          | 11 +++++++++++
 frontend/src/container/TopNav/Breadcrumbs/index.tsx   |  1 +
 .../src/pages/OnboardingPageV2/OnboardingPageV2.tsx   | 11 +++++++++++
 frontend/src/pages/OnboardingPageV2/index.tsx         |  3 +++
 frontend/src/utils/permission/index.ts                |  1 +
 10 files changed, 43 insertions(+)
 create mode 100644 frontend/src/pages/OnboardingPageV2/OnboardingPageV2.tsx
 create mode 100644 frontend/src/pages/OnboardingPageV2/index.tsx

diff --git a/frontend/src/AppRoutes/pageComponents.ts b/frontend/src/AppRoutes/pageComponents.ts
index 0a7764149b..c267304e6b 100644
--- 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
index 42ce00c0fb..fc59fef1e3 100644
--- a/frontend/src/AppRoutes/routes.ts
+++ b/frontend/src/AppRoutes/routes.ts
@@ -31,6 +31,7 @@ import {
 	NewDashboardPage,
 	OldLogsExplorer,
 	Onboarding,
+	OnboardingV2,
 	OrganizationSettings,
 	PasswordReset,
 	PipelinePage,
@@ -68,6 +69,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
index b4f43ee684..50d189f4a8 100644
--- 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
index beb4cea61c..898481e2a5 100644
--- a/frontend/src/container/AppLayout/index.tsx
+++ b/frontend/src/container/AppLayout/index.tsx
@@ -191,6 +191,8 @@ 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 ||
 		pathname === ROUTES.GET_STARTED_LOGS_MANAGEMENT ||
diff --git a/frontend/src/container/SideNav/config.ts b/frontend/src/container/SideNav/config.ts
index 37e9db4d9f..7b37f64bb7 100644
--- 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
index 6d24b74c53..a1c41ddea8 100644
--- a/frontend/src/container/SideNav/menuItems.tsx
+++ b/frontend/src/container/SideNav/menuItems.tsx
@@ -29,6 +29,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',
@@ -66,6 +72,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
index 9efd50d2c3..c98f4d05e2 100644
--- 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
new file mode 100644
index 0000000000..ccdc0226f8
--- /dev/null
+++ 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
new file mode 100644
index 0000000000..9fad953dfe
--- /dev/null
+++ 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
index 8a35121f57..6052900a05 100644
--- a/frontend/src/utils/permission/index.ts
+++ b/frontend/src/utils/permission/index.ts
@@ -86,6 +86,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'],