Skip to content

Commit a9f617e

Browse files
subirjollySubir Jolly
andauthored
feat: add menuitems for create org and add more orgs to global header (#5923)
* feat: add menuitems for create org global header. * chore: move showCreateOrg flag behind createDeleteOrgs feature flag * chore: update global header tests * chore: update per review suggestions * chore: remove unused import * chore: use updated selector * chore: remove default export and add relative path for styling * chore: remove not required comment * chore: update per review * chore: add divider support to global header dropdown * chore: update styles per ux review * chore: use forEach instead of reduce for simplicity, per review Co-authored-by: Subir Jolly <sjolly@influxdata.com>
1 parent bd0c0e0 commit a9f617e

File tree

10 files changed

+371
-92
lines changed

10 files changed

+371
-92
lines changed

cypress/e2e/cloud/globalHeader.test.ts

Lines changed: 17 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import {makeQuartzUseIDPEOrgID} from 'cypress/support/Utils'
2+
13
describe('change-account change-org global header', () => {
24
const globalHeaderFeatureFlags = {
35
multiOrg: true,
@@ -11,37 +13,6 @@ describe('change-account change-org global header', () => {
1113
cy.intercept('GET', 'api/v2/quartz/accounts/**/orgs').as('getQuartzOrgs')
1214
}
1315

14-
const makeQuartzUseIDPEOrgID = () => {
15-
cy.fixture('multiOrgAccounts1.json').then(quartzAccounts => {
16-
cy.intercept('GET', 'api/v2/quartz/accounts', quartzAccounts).as(
17-
'getQuartzAccounts'
18-
)
19-
})
20-
21-
cy.fixture('multiOrgIdentity').then(quartzIdentity => {
22-
quartzIdentity.org.id = idpeOrgID
23-
24-
cy.intercept('GET', 'api/v2/quartz/identity', quartzIdentity).as(
25-
'getQuartzIdentity'
26-
)
27-
})
28-
29-
cy.fixture('multiOrgOrgs1').then(quartzOrgs => {
30-
quartzOrgs[0].id = idpeOrgID
31-
32-
cy.intercept('GET', 'api/v2/quartz/accounts/**/orgs', quartzOrgs).as(
33-
'getQuartzOrgs'
34-
)
35-
})
36-
37-
cy.fixture('orgDetails').then(quartzOrgDetails => {
38-
quartzOrgDetails.id = idpeOrgID
39-
cy.intercept('GET', 'api/v2/quartz/orgs/*', quartzOrgDetails).as(
40-
'getQuartzOrgDetails'
41-
)
42-
})
43-
}
44-
4516
const mockQuartzOutage = () => {
4617
const quartzFailure = {
4718
statusCode: 503,
@@ -63,7 +34,7 @@ describe('change-account change-org global header', () => {
6334
method: 'GET',
6435
url: 'api/v2/orgs',
6536
}).then(res => {
66-
makeQuartzUseIDPEOrgID()
37+
makeQuartzUseIDPEOrgID(idpeOrgID)
6738
// Store the IDPE org ID so that it can be cloned when intercepting quartz.
6839
if (res.body.orgs) {
6940
idpeOrgID = res.body.orgs[0].id
@@ -75,7 +46,7 @@ describe('change-account change-org global header', () => {
7546

7647
beforeEach(() => {
7748
// Preserve one session throughout.
78-
makeQuartzUseIDPEOrgID()
49+
makeQuartzUseIDPEOrgID(idpeOrgID)
7950
Cypress.Cookies.preserveOnce('sid')
8051
cy.setFeatureFlags(globalHeaderFeatureFlags)
8152
})
@@ -97,13 +68,13 @@ describe('change-account change-org global header', () => {
9768

9869
describe('change org dropdown', () => {
9970
before(() => {
100-
makeQuartzUseIDPEOrgID()
71+
makeQuartzUseIDPEOrgID(idpeOrgID)
10172
cy.setFeatureFlags(globalHeaderFeatureFlags)
10273
cy.visit('/')
10374
})
10475

10576
it('navigates to the org settings page', () => {
106-
makeQuartzUseIDPEOrgID()
77+
makeQuartzUseIDPEOrgID(idpeOrgID)
10778
cy.getByTestID('globalheader--org-dropdown')
10879
.should('be.visible')
10980
.click()
@@ -119,7 +90,7 @@ describe('change-account change-org global header', () => {
11990
})
12091

12192
it('navigates to the org members page', () => {
122-
makeQuartzUseIDPEOrgID()
93+
makeQuartzUseIDPEOrgID(idpeOrgID)
12394
cy.getByTestID('globalheader--org-dropdown')
12495
.should('be.visible')
12596
.click()
@@ -135,7 +106,7 @@ describe('change-account change-org global header', () => {
135106
})
136107

137108
it('navigates to the org usage page', () => {
138-
makeQuartzUseIDPEOrgID()
109+
makeQuartzUseIDPEOrgID(idpeOrgID)
139110

140111
cy.getByTestID('globalheader--org-dropdown').should('exist').click()
141112
cy.getByTestID('globalheader--org-dropdown-main').should('be.visible')
@@ -149,7 +120,7 @@ describe('change-account change-org global header', () => {
149120
})
150121

151122
it('can change change the active org', () => {
152-
makeQuartzUseIDPEOrgID()
123+
makeQuartzUseIDPEOrgID(idpeOrgID)
153124
cy.getByTestID('globalheader--org-dropdown').should('exist').click()
154125

155126
cy.getByTestID('globalheader--org-dropdown-main').should('be.visible')
@@ -176,17 +147,17 @@ describe('change-account change-org global header', () => {
176147

177148
describe('change account dropdown', () => {
178149
beforeEach(() => {
179-
makeQuartzUseIDPEOrgID()
150+
makeQuartzUseIDPEOrgID(idpeOrgID)
180151
cy.setFeatureFlags(globalHeaderFeatureFlags)
181152
})
182153

183154
before(() => {
184-
makeQuartzUseIDPEOrgID()
155+
makeQuartzUseIDPEOrgID(idpeOrgID)
185156
cy.visit('/')
186157
})
187158

188159
it('navigates to the account settings page', () => {
189-
makeQuartzUseIDPEOrgID()
160+
makeQuartzUseIDPEOrgID(idpeOrgID)
190161
cy.getByTestID('globalheader--account-dropdown').should('exist').click()
191162

192163
cy.getByTestID('globalheader--account-dropdown-main').should(
@@ -201,7 +172,7 @@ describe('change-account change-org global header', () => {
201172
})
202173

203174
it('navigates to the account billing page', () => {
204-
makeQuartzUseIDPEOrgID()
175+
makeQuartzUseIDPEOrgID(idpeOrgID)
205176
cy.getByTestID('globalheader--account-dropdown').should('exist').click()
206177

207178
cy.getByTestID('globalheader--account-dropdown-main').should(
@@ -218,7 +189,7 @@ describe('change-account change-org global header', () => {
218189
})
219190

220191
it('can change change the active account', () => {
221-
makeQuartzUseIDPEOrgID()
192+
makeQuartzUseIDPEOrgID(idpeOrgID)
222193
cy.getByTestID('globalheader--account-dropdown').should('exist').click()
223194

224195
cy.getByTestID('globalheader--account-dropdown-main').should(
@@ -247,13 +218,13 @@ describe('change-account change-org global header', () => {
247218

248219
describe('user profile avatar', {scrollBehavior: false}, () => {
249220
before(() => {
250-
makeQuartzUseIDPEOrgID()
221+
makeQuartzUseIDPEOrgID(idpeOrgID)
251222
cy.setFeatureFlags(globalHeaderFeatureFlags)
252223
cy.visit('/')
253224
})
254225

255226
it('navigates to the `user profile` page', () => {
256-
makeQuartzUseIDPEOrgID()
227+
makeQuartzUseIDPEOrgID(idpeOrgID)
257228
cy.getByTestID('global-header--user-avatar').should('be.visible').click()
258229

259230
cy.getByTestID('global-header--user-popover-profile-button')
@@ -266,7 +237,7 @@ describe('change-account change-org global header', () => {
266237
})
267238

268239
it('allows the user to log out', () => {
269-
makeQuartzUseIDPEOrgID()
240+
makeQuartzUseIDPEOrgID(idpeOrgID)
270241
cy.getByTestID('global-header--user-avatar').should('be.visible').click()
271242

272243
// Logout can't be handled in the test, and redirects to a 404 that
Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
import {makeQuartzUseIDPEOrgID} from 'cypress/support/Utils'
2+
3+
const createOrgsFeatureFlags = {
4+
multiOrg: true,
5+
createDeleteOrgs: true,
6+
}
7+
8+
describe('FREE: global header menu items test', () => {
9+
let idpeOrgID: string
10+
11+
before(() => {
12+
cy.flush().then(() =>
13+
cy.signin().then(() => {
14+
cy.request({
15+
method: 'GET',
16+
url: 'api/v2/orgs',
17+
}).then(res => {
18+
// Store the IDPE org ID so that it can be cloned when intercepting quartz.
19+
if (res.body.orgs) {
20+
idpeOrgID = res.body.orgs[0].id
21+
}
22+
})
23+
})
24+
)
25+
})
26+
27+
beforeEach(() => {
28+
// Preserve one session throughout.
29+
Cypress.Cookies.preserveOnce('sid')
30+
cy.setFeatureFlags(createOrgsFeatureFlags)
31+
makeQuartzUseIDPEOrgID(idpeOrgID)
32+
cy.visit('/')
33+
})
34+
35+
it('has add more organizations in menu items', () => {
36+
cy.getByTestID('globalheader--org-dropdown').should('exist').click()
37+
38+
cy.getByTestID('globalheader--org-dropdown-main').should('be.visible')
39+
cy.getByTestID(
40+
'globalheader--org-dropdown-main-Add More Organizations'
41+
).should('be.visible')
42+
})
43+
})
44+
45+
describe('PAYG: global header menu items test', () => {
46+
let idpeOrgID: string
47+
48+
before(() => {
49+
cy.flush().then(() =>
50+
cy.signin().then(() => {
51+
cy.request({
52+
method: 'GET',
53+
url: 'api/v2/orgs',
54+
}).then(res => {
55+
// Store the IDPE org ID so that it can be cloned when intercepting quartz.
56+
if (res.body.orgs) {
57+
idpeOrgID = res.body.orgs[0].id
58+
}
59+
60+
Cypress.Cookies.preserveOnce('sid')
61+
cy.setFeatureFlags(createOrgsFeatureFlags)
62+
})
63+
})
64+
)
65+
})
66+
67+
beforeEach(() => {
68+
makeQuartzUseIDPEOrgID(idpeOrgID, 'pay_as_you_go')
69+
cy.visit('/')
70+
})
71+
72+
it('PAYG: can check create organization menu item exists', () => {
73+
cy.getByTestID('globalheader--org-dropdown').should('exist').click()
74+
75+
cy.getByTestID('globalheader--org-dropdown-main').should('be.visible')
76+
cy.getByTestID(
77+
'global-header--main-dropdown-item-Create Organization'
78+
).should('be.visible')
79+
})
80+
})
81+
82+
describe('Contract: global header menu items test', () => {
83+
let idpeOrgID: string
84+
85+
before(() => {
86+
cy.flush().then(() =>
87+
cy.signin().then(() => {
88+
cy.request({
89+
method: 'GET',
90+
url: 'api/v2/orgs',
91+
}).then(res => {
92+
// Store the IDPE org ID so that it can be cloned when intercepting quartz.
93+
if (res.body.orgs) {
94+
idpeOrgID = res.body.orgs[0].id
95+
}
96+
97+
Cypress.Cookies.preserveOnce('sid')
98+
cy.setFeatureFlags(createOrgsFeatureFlags)
99+
})
100+
})
101+
)
102+
})
103+
104+
beforeEach(() => {
105+
makeQuartzUseIDPEOrgID(idpeOrgID, 'contract')
106+
cy.visit('/')
107+
})
108+
109+
it('Contract: can check create organization menu item exists', () => {
110+
cy.getByTestID('globalheader--org-dropdown').should('exist').click()
111+
112+
cy.getByTestID('globalheader--org-dropdown-main').should('be.visible')
113+
cy.getByTestID(
114+
'global-header--main-dropdown-item-Create Organization'
115+
).should('be.visible')
116+
})
117+
})
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"user": {
3+
"id": "03b0f952abf7e5ce",
4+
"email": "test@influxdata.com",
5+
"firstName": "Marty",
6+
"lastName": "McFly",
7+
"operatorRole": null,
8+
"accountCount": 2,
9+
"orgCount": 20
10+
},
11+
"org": {
12+
"id": "a12eb3c74e6c3azc",
13+
"name": "Test Organization",
14+
"clusterHost": "https://us-west1.iamzuora.cloud2.influxdata.com"
15+
},
16+
17+
"account": {
18+
"id": 416,
19+
"name": "Influx",
20+
"type": "contract",
21+
"accountCreatedAt": "Tue Jun 01 2022 08:49:14 GMT-0400 (Eastern Daylight Time)",
22+
"billing_provider": "gcm"
23+
}
24+
}
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"user": {
3+
"id": "03b0f952abf7e5ce",
4+
"email": "test@influxdata.com",
5+
"firstName": "Marty",
6+
"lastName": "McFly",
7+
"operatorRole": null,
8+
"accountCount": 2,
9+
"orgCount": 20
10+
},
11+
"org": {
12+
"id": "a12eb3c74e6c3azc",
13+
"name": "Test Organization",
14+
"clusterHost": "https://us-west1.iamzuora.cloud2.influxdata.com"
15+
},
16+
17+
"account": {
18+
"id": 416,
19+
"name": "Influx",
20+
"type": "pay_as_you_go",
21+
"accountCreatedAt": "Tue Jun 01 2022 08:49:14 GMT-0400 (Eastern Daylight Time)",
22+
"billing_provider": "aws"
23+
}
24+
}

cypress/support/Utils.ts

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -165,3 +165,45 @@ export function genCurve(args: CurveArgs): string[] {
165165

166166
return result
167167
}
168+
169+
export const makeQuartzUseIDPEOrgID = (
170+
idpeOrgID: string,
171+
accountType = 'free'
172+
) => {
173+
cy.fixture('multiOrgAccounts1.json').then(quartzAccounts => {
174+
cy.intercept('GET', 'api/v2/quartz/accounts', quartzAccounts).as(
175+
'getQuartzAccounts'
176+
)
177+
})
178+
179+
let fixtureName = 'multiOrgIdentity'
180+
if (accountType === 'pay_as_you_go') {
181+
fixtureName = 'multiOrgIdentityPAYG'
182+
}
183+
if (accountType === 'contract') {
184+
fixtureName = 'multiOrgIdentityContract'
185+
}
186+
187+
cy.fixture(fixtureName).then(quartzIdentity => {
188+
quartzIdentity.org.id = idpeOrgID
189+
190+
cy.intercept('GET', 'api/v2/quartz/identity', quartzIdentity).as(
191+
'getQuartzIdentity'
192+
)
193+
})
194+
195+
cy.fixture('multiOrgOrgs1').then(quartzOrgs => {
196+
quartzOrgs[0].id = idpeOrgID
197+
198+
cy.intercept('GET', 'api/v2/quartz/accounts/**/orgs', quartzOrgs).as(
199+
'getQuartzOrgs'
200+
)
201+
})
202+
203+
cy.fixture('orgDetails').then(quartzOrgDetails => {
204+
quartzOrgDetails.id = idpeOrgID
205+
cy.intercept('GET', 'api/v2/quartz/orgs/*', quartzOrgDetails).as(
206+
'getQuartzOrgDetails'
207+
)
208+
})
209+
}

src/identity/apis/auth.ts

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -322,9 +322,5 @@ export const updateUserAccount = async (accountId, name) => {
322322
throw new ServerError(response.data.message)
323323
}
324324

325-
// TODO: Remove the following line of code when this PR(https://github.com/influxdata/quartz/issues/6846) is done
326-
// Instead return response.data.
327-
const data = {...response.data, id: Number(response.data.id)}
328-
329-
return data
325+
return response.data
330326
}

0 commit comments

Comments
 (0)