Skip to content

Commit 988fc5f

Browse files
upcoming: [UIE-10490] - Configure New Feature Chip and Banner Messaging for Linode Alerts and Metrics (#13509)
* Configure New Feature Chip & Banner Messaging for aclp alerts and metrics * Update and add new tests * Added changeset: Configure new feature chip and banner messaging for ACLP Linode Alerts and Metrics * Added changeset: New `getFeatureChip` utility to shared package * Add and update LinodeAlerts tests * Add Utilities documentation in the shared pkg readme file * Add changeset in utilities pkg * Remove remaining beta references from var names in Summary.tsx * Remove beta from the comment * Minor refactoring * Update remaining beta naming references and add unit tests for newly added utility
1 parent 4536cf7 commit 988fc5f

26 files changed

Lines changed: 548 additions & 235 deletions
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@linode/manager": Upcoming Features
3+
---
4+
5+
Configure new feature chip and banner messaging for ACLP Linode Alerts and Metrics ([#13509](https://github.com/linode/manager/pull/13509))

packages/manager/cypress/e2e/core/cloudpulse/aclp-support.spec.ts

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,10 @@ import {
1414
import { randomLabel, randomNumber } from 'support/util/random';
1515

1616
import {
17+
METRICS_BETA_AND_NEW_MODE_BUTTON_TEXT,
1718
METRICS_BETA_MODE_BANNER_TEXT,
18-
METRICS_BETA_MODE_BUTTON_TEXT,
19-
METRICS_LEGACY_MODE_BANNER_TEXT,
20-
METRICS_LEGACY_MODE_BUTTON_TEXT,
19+
METRICS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT,
20+
METRICS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT,
2121
} from 'src/features/Linodes/constants';
2222

2323
import type { Stats } from '@linode/api-v4';
@@ -69,7 +69,7 @@ describe('ACLP Components UI varies according to ACLP support by region and user
6969
});
7070
// UI displays beta metrics, can switch to legacy view
7171
it('user preference enables aclp', function () {
72-
mockGetUserPreferences({ isAclpMetricsBeta: true }).as(
72+
mockGetUserPreferences({ isAclpMetricsMode: true }).as(
7373
'getUserPreferences'
7474
);
7575
cy.visitWithLogin(`/linodes/${this.mockLinodeId}/metrics`);
@@ -97,7 +97,7 @@ describe('ACLP Components UI varies according to ACLP support by region and user
9797
cy.contains(METRICS_BETA_MODE_BANNER_TEXT).should('be.visible');
9898

9999
ui.button
100-
.findByTitle(METRICS_BETA_MODE_BUTTON_TEXT)
100+
.findByTitle(METRICS_BETA_AND_NEW_MODE_BUTTON_TEXT)
101101
.should('be.visible')
102102
.should('be.enabled');
103103
// UI displays mock error msg
@@ -107,7 +107,7 @@ describe('ACLP Components UI varies according to ACLP support by region and user
107107

108108
// UI displays legacy metrics, can switch to beta view
109109
it('user preference disables aclp', function () {
110-
mockGetUserPreferences({ isAclpMetricsBeta: false }).as(
110+
mockGetUserPreferences({ isAclpMetricsMode: false }).as(
111111
'getUserPreferences'
112112
);
113113
const mockLegacyStats: Stats = generateMockLegacyStats();
@@ -137,19 +137,23 @@ describe('ACLP Components UI varies according to ACLP support by region and user
137137
);
138138
// expect legacy metrics view of LinodeSummary component to be displayed
139139
cy.get('[data-testid="linode-summary"]').should('be.visible');
140-
cy.contains(METRICS_LEGACY_MODE_BANNER_TEXT).should('be.visible');
140+
cy.contains(METRICS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT).should(
141+
'be.visible'
142+
);
141143
// switch to beta metrics
142144
ui.button
143-
.findByTitle(METRICS_LEGACY_MODE_BUTTON_TEXT)
145+
.findByTitle(METRICS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
144146
.should('be.visible')
145147
.should('be.enabled')
146148
.click();
147149
// wait for dashboard query to complete
148150
cy.wait('@getDashboardError');
149151
cy.contains(METRICS_BETA_MODE_BANNER_TEXT).should('be.visible');
150-
cy.contains(METRICS_LEGACY_MODE_BANNER_TEXT).should('not.exist');
152+
cy.contains(METRICS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT).should(
153+
'not.exist'
154+
);
151155
ui.button
152-
.findByTitle(METRICS_BETA_MODE_BUTTON_TEXT)
156+
.findByTitle(METRICS_BETA_AND_NEW_MODE_BUTTON_TEXT)
153157
.should('be.visible')
154158
.should('be.enabled');
155159
});
@@ -182,7 +186,7 @@ describe('ACLP Components UI varies according to ACLP support by region and user
182186
});
183187
// UI displays legacy metrics, no option to switch to beta view
184188
it('user preference enables aclp', function () {
185-
mockGetUserPreferences({ isAclpMetricsBeta: true }).as(
189+
mockGetUserPreferences({ isAclpMetricsMode: true }).as(
186190
'getUserPreferences'
187191
);
188192
cy.visitWithLogin(`/linodes/${this.mockLinodeId}/metrics`);
@@ -191,7 +195,7 @@ describe('ACLP Components UI varies according to ACLP support by region and user
191195

192196
// UI displays legacy metrics, no option to switch to beta view
193197
it('user preference disables aclp', function () {
194-
mockGetUserPreferences({ isAclpMetricsBeta: false }).as(
198+
mockGetUserPreferences({ isAclpMetricsMode: false }).as(
195199
'getUserPreferences'
196200
);
197201
cy.visitWithLogin(`/linodes/${this.mockLinodeId}/metrics`);

packages/manager/cypress/e2e/core/linodes/alerts-create.spec.ts

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,10 @@ import {
1818
firewallFactory,
1919
} from 'src/factories';
2020
import {
21+
ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT,
2122
ALERTS_BETA_MODE_BANNER_TEXT,
22-
ALERTS_BETA_MODE_BUTTON_TEXT,
23-
ALERTS_LEGACY_MODE_BANNER_TEXT,
24-
ALERTS_LEGACY_MODE_BUTTON_TEXT,
23+
ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT,
24+
ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT,
2525
} from 'src/features/Linodes/constants';
2626

2727
const mockFirewall = firewallFactory.build({
@@ -246,7 +246,7 @@ describe('Create flow when beta alerts enabled by region and feature flag', func
246246
// switch to beta
247247
// alerts are off/false but enabled, can switch to on/true
248248
ui.button
249-
.findByTitle(ALERTS_LEGACY_MODE_BUTTON_TEXT)
249+
.findByTitle(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
250250
.should('be.visible')
251251
.should('be.enabled')
252252
.click();
@@ -402,7 +402,7 @@ describe('Create flow when beta alerts enabled by region and feature flag', func
402402
cy.get('[data-testid="notice-info"]')
403403
.should('be.visible')
404404
.within(() => {
405-
cy.contains(ALERTS_LEGACY_MODE_BANNER_TEXT);
405+
cy.contains(ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT);
406406
});
407407
});
408408
// legacy alert form, inputs are ON but readonly
@@ -420,7 +420,7 @@ describe('Create flow when beta alerts enabled by region and feature flag', func
420420

421421
// upgrade from legacy alerts to beta alerts
422422
ui.button
423-
.findByTitle(ALERTS_LEGACY_MODE_BUTTON_TEXT)
423+
.findByTitle(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
424424
.should('be.visible')
425425
.should('be.enabled')
426426
.click();
@@ -435,7 +435,7 @@ describe('Create flow when beta alerts enabled by region and feature flag', func
435435
});
436436
// possible to downgrade from ACLP alerts to legacy alerts
437437
ui.button
438-
.findByTitle(ALERTS_BETA_MODE_BUTTON_TEXT)
438+
.findByTitle(ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT)
439439
.should('be.visible')
440440
.should('be.enabled');
441441
});

packages/manager/cypress/e2e/core/linodes/alerts-edit.spec.ts

Lines changed: 23 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@ import { randomLabel } from 'support/util/random';
1212

1313
import { alertFactory } from 'src/factories';
1414
import {
15+
ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT,
1516
ALERTS_BETA_MODE_BANNER_TEXT,
16-
ALERTS_BETA_MODE_BUTTON_TEXT,
1717
ALERTS_BETA_PROMPT,
18-
ALERTS_LEGACY_MODE_BANNER_TEXT,
19-
ALERTS_LEGACY_MODE_BUTTON_TEXT,
18+
ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT,
19+
ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT,
2020
ALERTS_LEGACY_PROMPT,
2121
} from 'src/features/Linodes/constants';
2222

@@ -142,7 +142,7 @@ describe('region enables alerts', function () {
142142
cy.get('[data-testid="notice-info"]')
143143
.should('be.visible')
144144
.within(() => {
145-
cy.contains(ALERTS_LEGACY_MODE_BANNER_TEXT);
145+
cy.contains(ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT);
146146
});
147147
// alerts are disabled so all toggles are off
148148
ui.toggle.find().each(($toggle) => {
@@ -152,7 +152,7 @@ describe('region enables alerts', function () {
152152

153153
// upgrade from legacy alerts to ACLP alerts
154154
ui.button
155-
.findByTitle(ALERTS_LEGACY_MODE_BUTTON_TEXT)
155+
.findByTitle(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
156156
.should('be.visible')
157157
.should('be.enabled')
158158
.click();
@@ -171,7 +171,7 @@ describe('region enables alerts', function () {
171171
});
172172
// possible to downgrade from ACLP alerts to legacy alerts
173173
ui.button
174-
.findByTitle(ALERTS_BETA_MODE_BUTTON_TEXT)
174+
.findByTitle(ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT)
175175
.should('be.visible')
176176
.should('be.enabled');
177177

@@ -203,7 +203,7 @@ describe('region enables alerts', function () {
203203
cy.get('[data-testid="notice-info"]')
204204
.should('be.visible')
205205
.within(() => {
206-
cy.contains(ALERTS_LEGACY_MODE_BANNER_TEXT);
206+
cy.contains(ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT);
207207
});
208208

209209
// alerts are enabled so all toggles are on if val > 0
@@ -214,7 +214,7 @@ describe('region enables alerts', function () {
214214

215215
// upgrade from legacy alerts to ACLP alerts
216216
ui.button
217-
.findByTitle(ALERTS_LEGACY_MODE_BUTTON_TEXT)
217+
.findByTitle(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
218218
.should('be.visible')
219219
.should('be.enabled')
220220
.click();
@@ -274,7 +274,7 @@ describe('region enables alerts', function () {
274274

275275
// downgrade from ACLP alerts to legacy alerts
276276
ui.button
277-
.findByTitle(ALERTS_BETA_MODE_BUTTON_TEXT)
277+
.findByTitle(ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT)
278278
.should('be.visible')
279279
.should('be.enabled')
280280
.click();
@@ -289,7 +289,7 @@ describe('region enables alerts', function () {
289289
cy.get('[data-testid="notice-info"]')
290290
.should('be.visible')
291291
.within(() => {
292-
cy.contains(ALERTS_LEGACY_MODE_BANNER_TEXT);
292+
cy.contains(ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT);
293293
});
294294
// alerts are disabled so all toggles are off
295295
ui.toggle.find().each(($toggle) => {
@@ -301,7 +301,7 @@ describe('region enables alerts', function () {
301301
});
302302
// possible to upgrade to beta
303303
ui.button
304-
.findByTitle(ALERTS_LEGACY_MODE_BUTTON_TEXT)
304+
.findByTitle(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
305305
.should('be.visible')
306306
.should('be.enabled');
307307

@@ -339,7 +339,7 @@ describe('region enables alerts', function () {
339339
assertLinodeAlertsEnabled(this.alertDefinitions);
340340
// downgrade from ACLP alerts to legacy alerts
341341
ui.button
342-
.findByTitle(ALERTS_BETA_MODE_BUTTON_TEXT)
342+
.findByTitle(ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT)
343343
.should('be.visible')
344344
.should('be.enabled')
345345
.click();
@@ -356,7 +356,7 @@ describe('region enables alerts', function () {
356356
cy.get('[data-testid="notice-info"]')
357357
.should('be.visible')
358358
.within(() => {
359-
cy.contains(ALERTS_LEGACY_MODE_BANNER_TEXT);
359+
cy.contains(ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT);
360360
});
361361
// turn the toggles off
362362
ui.toggle
@@ -444,13 +444,13 @@ describe('region enables alerts', function () {
444444
cy.get('[data-testid="notice-info"]')
445445
.should('be.visible')
446446
.within(() => {
447-
cy.contains(ALERTS_LEGACY_MODE_BANNER_TEXT);
447+
cy.contains(ALERTS_LEGACY_MODE_BETA_PHASE_BANNER_TEXT);
448448
});
449449
});
450450

451451
// upgrade from legacy alerts to ACLP alerts
452452
ui.button
453-
.findByTitle(ALERTS_LEGACY_MODE_BUTTON_TEXT)
453+
.findByTitle(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT)
454454
.should('be.visible')
455455
.should('be.enabled')
456456
.click();
@@ -558,8 +558,10 @@ describe('region disables alerts. beta alerts not available regardless of linode
558558
cy.contains('Alerts').should('be.visible');
559559
cy.get('[data-testid="notice-info"]').should('not.exist');
560560
// not possible to upgrade or downgrade
561-
cy.findByText(ALERTS_LEGACY_MODE_BUTTON_TEXT).should('not.exist');
562-
cy.findByText(ALERTS_BETA_MODE_BUTTON_TEXT).should('not.exist');
561+
cy.findByText(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT).should(
562+
'not.exist'
563+
);
564+
cy.findByText(ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT).should('not.exist');
563565
// alerts are disabled so all toggles are off but are not readonly
564566
ui.toggle.find().each(($toggle) => {
565567
cy.wrap($toggle)
@@ -591,8 +593,10 @@ describe('region disables alerts. beta alerts not available regardless of linode
591593
cy.contains('Alerts').should('be.visible');
592594
cy.get('[data-testid="notice-info"]').should('not.exist');
593595
// not possible to upgrade or downgrade
594-
cy.findByText(ALERTS_LEGACY_MODE_BUTTON_TEXT).should('not.exist');
595-
cy.findByText(ALERTS_BETA_MODE_BUTTON_TEXT).should('not.exist');
596+
cy.findByText(ALERTS_LEGACY_MODE_BETA_PHASE_BUTTON_TEXT).should(
597+
'not.exist'
598+
);
599+
cy.findByText(ALERTS_BETA_AND_NEW_MODE_BUTTON_TEXT).should('not.exist');
596600
// legacy alerts are enabled
597601
ui.toggle.find().each(($toggle) => {
598602
cy.wrap($toggle)

packages/manager/src/featureFlags.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -181,6 +181,7 @@ interface AclpAlerting {
181181
editDisabledStatuses?: AlertStatusType[];
182182
maxDimensionFiltersValues?: number;
183183
maxEmailChannelRecipients?: number;
184+
new?: boolean;
184185
notificationChannels: boolean;
185186
recentActivity: boolean;
186187
systemChannelSupportedServices?: CloudPulseServiceType[]; // linode, dbaas, etc.

0 commit comments

Comments
 (0)