diff --git a/frontend/public/locales/en/titles.json b/frontend/public/locales/en/titles.json
index aa59005c3f..4d3e899d76 100644
--- a/frontend/public/locales/en/titles.json
+++ b/frontend/public/locales/en/titles.json
@@ -4,7 +4,7 @@
"SERVICE_METRICS": "SigNoz | Service Metrics",
"SERVICE_MAP": "SigNoz | Service Map",
"GET_STARTED": "SigNoz | Get Started",
- "GET_STARTED_V2": "SigNoz | Get Started",
+ "ONBOARDING": "SigNoz | Get Started",
"GET_STARTED_APPLICATION_MONITORING": "SigNoz | Get Started | APM",
"GET_STARTED_LOGS_MANAGEMENT": "SigNoz | Get Started | Logs",
"GET_STARTED_INFRASTRUCTURE_MONITORING": "SigNoz | Get Started | Infrastructure",
diff --git a/frontend/src/AppRoutes/routes.ts b/frontend/src/AppRoutes/routes.ts
index fc59fef1e3..1901095a67 100644
--- a/frontend/src/AppRoutes/routes.ts
+++ b/frontend/src/AppRoutes/routes.ts
@@ -70,11 +70,11 @@ const routes: AppRoutes[] = [
key: 'GET_STARTED',
},
{
- path: ROUTES.GET_STARTED_V2,
+ path: ROUTES.ONBOARDING,
exact: false,
component: OnboardingV2,
isPrivate: true,
- key: 'GET_STARTED_V2',
+ key: 'ONBOARDING',
},
{
component: LogsIndexToFields,
diff --git a/frontend/src/constants/routes.ts b/frontend/src/constants/routes.ts
index 50d189f4a8..3c17336889 100644
--- a/frontend/src/constants/routes.ts
+++ b/frontend/src/constants/routes.ts
@@ -8,7 +8,7 @@ const ROUTES = {
TRACE_DETAIL: '/trace/:id',
TRACES_EXPLORER: '/traces-explorer',
GET_STARTED: '/get-started',
- GET_STARTED_V2: '/get-started-v2',
+ ONBOARDING: '/onboarding',
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 898481e2a5..700914cc6a 100644
--- a/frontend/src/container/AppLayout/index.tsx
+++ b/frontend/src/container/AppLayout/index.tsx
@@ -191,7 +191,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
const pageTitle = t(routeKey);
const renderFullScreen =
pathname === ROUTES.GET_STARTED ||
- pathname === ROUTES.GET_STARTED_V2 ||
+ pathname === ROUTES.ONBOARDING ||
pathname === ROUTES.WORKSPACE_LOCKED ||
pathname === ROUTES.GET_STARTED_APPLICATION_MONITORING ||
pathname === ROUTES.GET_STARTED_INFRASTRUCTURE_MONITORING ||
diff --git a/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.styles.scss b/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.styles.scss
index 263e1d4e80..ae26562b3a 100644
--- a/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.styles.scss
+++ b/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.styles.scss
@@ -7,19 +7,24 @@
.ant-select-selector {
border: 1px solid #1d212d;
- border-top-right-radius: 0px;
- border-bottom-right-radius: 0px;
-
- border-right: none;
+ border-top-left-radius: 0px;
+ border-bottom-left-radius: 0px;
}
}
.team-member-email-input {
width: 80%;
+ background-color: #121317;
+ border-top-right-radius: 0px;
+ border-bottom-right-radius: 0px;
- border: 1px solid #1d212d;
- border-top-left-radius: 0px;
- border-bottom-left-radius: 0px;
+ .ant-input,
+ .ant-input-group-addon {
+ background-color: #121317 !important;
+ border-right: 0px;
+ border-top-right-radius: 0px;
+ border-bottom-right-radius: 0px;
+ }
}
}
diff --git a/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.tsx b/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.tsx
index e4d2a64bc7..4adfd92c6e 100644
--- a/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.tsx
+++ b/frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.tsx
@@ -11,6 +11,7 @@ import {
CheckCircle,
Plus,
TriangleAlert,
+ X,
} from 'lucide-react';
import { useCallback, useEffect, useState } from 'react';
import { useMutation } from 'react-query';
@@ -75,6 +76,10 @@ function InviteTeamMembers({
setTeamMembersToInvite((prev) => [...(prev || []), newTeamMember]);
};
+ const handleRemoveTeamMember = (id: string): void => {
+ setTeamMembersToInvite((prev) => (prev || []).filter((m) => m.id !== id));
+ };
+
// Validation function to check all users
const validateAllUsers = (): boolean => {
let isValid = true;
@@ -174,7 +179,7 @@ function InviteTeamMembers({
-
+
Collaborate with your team
@@ -186,15 +191,6 @@ function InviteTeamMembers({
{teamMembersToInvite?.map((member) => (
-
+
+
+ {teamMembersToInvite?.length > 1 && (
+ }
+ onClick={(): void => handleRemoveTeamMember(member.id)}
+ />
+ )}
))}
diff --git a/frontend/src/container/OnboardingQuestionaire/OnboardingQuestionaire.styles.scss b/frontend/src/container/OnboardingQuestionaire/OnboardingQuestionaire.styles.scss
index 8be4dc608c..00b091d1d8 100644
--- a/frontend/src/container/OnboardingQuestionaire/OnboardingQuestionaire.styles.scss
+++ b/frontend/src/container/OnboardingQuestionaire/OnboardingQuestionaire.styles.scss
@@ -83,6 +83,31 @@
}
}
}
+
+ &.invite-team-members-form {
+ min-height: calc(420px - 24px);
+ max-height: calc(420px - 24px);
+
+ .invite-team-members-container {
+ max-height: 260px;
+ padding-right: 8px;
+ overflow-y: auto;
+
+ &::-webkit-scrollbar {
+ width: 0.1rem;
+ }
+ &::-webkit-scrollbar-corner {
+ background: transparent;
+ }
+ &::-webkit-scrollbar-thumb {
+ background: rgb(136, 136, 136);
+ border-radius: 0.625rem;
+ }
+ &::-webkit-scrollbar-track {
+ background: transparent;
+ }
+ }
+ }
}
.invite-team-members-container {
@@ -173,6 +198,10 @@
font-style: normal;
font-weight: 500;
line-height: 20px;
+
+ display: flex;
+ align-items: center;
+ gap: 8px;
}
input[type='text'] {
@@ -237,7 +266,8 @@
}
.onboarding-questionaire-button,
- .add-another-member-button {
+ .add-another-member-button,
+ .remove-team-member-button {
display: flex;
align-items: center;
justify-content: space-between;
@@ -270,11 +300,27 @@
}
}
- .add-another-member-button {
+ .add-another-member-button,
+ .remove-team-member-button {
font-size: 12px;
height: 32px;
}
+ .remove-team-member-button {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ border: 1px solid #1d212d;
+ border-top-left-radius: 0px;
+ border-bottom-left-radius: 0px;
+ background-color: #121317;
+
+ border-left: 0px;
+ border-top-left-radius: 0px;
+ border-bottom-left-radius: 0px;
+ }
+
.onboarding-questionaire-other-input {
.ant-input-group {
.ant-input {
diff --git a/frontend/src/container/OnboardingQuestionaire/index.tsx b/frontend/src/container/OnboardingQuestionaire/index.tsx
index 974070b944..a5d1f83254 100644
--- a/frontend/src/container/OnboardingQuestionaire/index.tsx
+++ b/frontend/src/container/OnboardingQuestionaire/index.tsx
@@ -3,6 +3,7 @@ import './OnboardingQuestionaire.styles.scss';
import { NotificationInstance } from 'antd/es/notification/interface';
import updateProfileAPI from 'api/onboarding/updateProfile';
import editOrg from 'api/user/editOrg';
+import getOrgUser from 'api/user/getOrgUser';
import { AxiosError } from 'axios';
import { SOMETHING_WENT_WRONG } from 'constants/api';
import ROUTES from 'constants/routes';
@@ -11,7 +12,7 @@ import { useNotifications } from 'hooks/useNotifications';
import history from 'lib/history';
import { Dispatch, useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
-import { useMutation } from 'react-query';
+import { useMutation, useQuery } from 'react-query';
import { useDispatch, useSelector } from 'react-redux';
import { AppState } from 'store/reducers';
import AppActions from 'types/actions';
@@ -78,6 +79,17 @@ function OnboardingQuestionaire(): JSX.Element {
const { t } = useTranslation(['organizationsettings', 'common']);
const { org } = useSelector
((state) => state.app);
+
+ const { data: orgUsers, isLoading: isLoadingOrgUsers } = useQuery({
+ queryFn: () =>
+ getOrgUser({
+ orgId: (org || [])[0].id,
+ }),
+ queryKey: ['getOrgUser', org?.[0].id],
+ });
+
+ console.log('orgUsers', orgUsers, isLoadingOrgUsers);
+
const dispatch = useDispatch>();
const [orgData, setOrgData] = useState(null);
@@ -188,7 +200,7 @@ function OnboardingQuestionaire(): JSX.Element {
};
const handleOnboardingComplete = (): void => {
- history.push(ROUTES.APPLICATION);
+ history.push(ROUTES.GET_STARTED);
};
return (
diff --git a/frontend/src/container/SideNav/config.ts b/frontend/src/container/SideNav/config.ts
index 7b37f64bb7..7fdd462a52 100644
--- a/frontend/src/container/SideNav/config.ts
+++ b/frontend/src/container/SideNav/config.ts
@@ -27,7 +27,7 @@ export const routeConfig: Record = {
[ROUTES.ERROR_DETAIL]: [QueryParams.resourceAttributes],
[ROUTES.HOME_PAGE]: [QueryParams.resourceAttributes],
[ROUTES.GET_STARTED]: [QueryParams.resourceAttributes],
- [ROUTES.GET_STARTED_V2]: [QueryParams.resourceAttributes],
+ [ROUTES.ONBOARDING]: [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 a1c41ddea8..6d24b74c53 100644
--- a/frontend/src/container/SideNav/menuItems.tsx
+++ b/frontend/src/container/SideNav/menuItems.tsx
@@ -29,12 +29,6 @@ export const getStartedMenuItem = {
icon: ,
};
-export const getStartedV2MenuItem = {
- key: ROUTES.GET_STARTED_V2,
- label: 'Get Started V2',
- icon: ,
-};
-
export const inviteMemberMenuItem = {
key: `${ROUTES.ORG_SETTINGS}#invite-team-members`,
label: 'Invite Team Member',
@@ -72,11 +66,6 @@ export const trySignozCloudMenuItem: SidebarItem = {
};
const menuItems: SidebarItem[] = [
- {
- key: ROUTES.GET_STARTED_V2,
- label: 'Get Started V2',
- icon: ,
- },
{
key: ROUTES.APPLICATION,
label: 'Services',
diff --git a/frontend/src/container/TopNav/Breadcrumbs/index.tsx b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
index c98f4d05e2..9efd50d2c3 100644
--- a/frontend/src/container/TopNav/Breadcrumbs/index.tsx
+++ b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
@@ -9,7 +9,6 @@ const breadcrumbNameMap: Record = {
[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/utils/permission/index.ts b/frontend/src/utils/permission/index.ts
index 6052900a05..e58843232a 100644
--- a/frontend/src/utils/permission/index.ts
+++ b/frontend/src/utils/permission/index.ts
@@ -86,7 +86,7 @@ export const routePermission: Record = {
LOGS_PIPELINES: ['ADMIN', 'EDITOR', 'VIEWER'],
TRACE_EXPLORER: ['ADMIN', 'EDITOR', 'VIEWER'],
GET_STARTED: ['ADMIN', 'EDITOR', 'VIEWER'],
- GET_STARTED_V2: ['ADMIN', 'EDITOR', 'VIEWER'],
+ ONBOARDING: ['ADMIN', 'EDITOR', 'VIEWER'],
GET_STARTED_APPLICATION_MONITORING: ['ADMIN', 'EDITOR', 'VIEWER'],
GET_STARTED_INFRASTRUCTURE_MONITORING: ['ADMIN', 'EDITOR', 'VIEWER'],
GET_STARTED_LOGS_MANAGEMENT: ['ADMIN', 'EDITOR', 'VIEWER'],