Skip to content

Commit c531474

Browse files
kagora-akamaikagora-akamai
authored
change: [DPS-41998] - Akamai Object Storage Destination - tech writing improvements (#13556)
1 parent 128efd1 commit c531474

15 files changed

Lines changed: 101 additions & 51 deletions

‎packages/manager/.changeset/pr-13556-changed-1775141881220.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@linode/manager": Changed
3+
---
4+
5+
Logs Delivery copy based on tech writing updates ([#13556](https://github.com/linode/manager/pull/13556))

‎packages/manager/cypress/e2e/core/delivery/create-destination.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,7 @@ describe('Create Destination', () => {
163163
);
164164

165165
// Switch to manual mode and fill in values
166-
cy.findByLabelText('Enter Bucket manually').click();
166+
cy.findByLabelText('Enter Bucket details manually').click();
167167
logsDestinationForm.setBucket('my-manual-bucket');
168168
logsDestinationForm.setEndpoint('my-endpoint.com');
169169

‎packages/manager/cypress/e2e/core/delivery/edit-destination.spec.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -160,7 +160,9 @@ describe('Edit Destination', () => {
160160
]);
161161

162162
// Edit mode defaults to manual bucket entry
163-
cy.findByLabelText('Enter Bucket manually').should('be.checked');
163+
cy.findByLabelText('Enter Bucket details manually').should(
164+
'be.checked'
165+
);
164166

165167
// Endpoint should be enabled in manual mode
166168
cy.findByLabelText('Endpoint').should('be.enabled');

‎packages/manager/cypress/support/ui/pages/logs-destination-form.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ export const logsDestinationForm = {
7676
cy.findByLabelText('Endpoint')
7777
.should('be.visible')
7878
.should('be.enabled')
79-
.should('have.attr', 'placeholder', 'Endpoint for the destination')
79+
.should('have.attr', 'placeholder', 'https://us-ord-1.linodeobjects.com')
8080
.clear();
8181
cy.focused().type(endpoint);
8282
},
@@ -129,7 +129,7 @@ export const logsDestinationForm = {
129129
data: AkamaiObjectStorageDetailsExtended
130130
) => {
131131
// Switch to manual bucket entry
132-
cy.findByLabelText('Enter Bucket manually').click();
132+
cy.findByLabelText('Enter Bucket details manually').click();
133133

134134
logsDestinationForm.setBucket(data.bucket_name);
135135
logsDestinationForm.setEndpoint(data.host);

‎packages/manager/src/features/Delivery/Destinations/DestinationForm/DestinationCreate.test.tsx‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,9 @@ describe('DestinationCreate', () => {
112112
it('should render Endpoint input and allow to type text in manual mode', async () => {
113113
renderDestinationCreate(flags);
114114

115-
const manualRadio = screen.getByLabelText('Enter Bucket manually');
115+
const manualRadio = screen.getByLabelText(
116+
'Enter Bucket details manually'
117+
);
116118
await userEvent.click(manualRadio);
117119

118120
const endpointInput = screen.getByLabelText('Endpoint');
@@ -124,7 +126,9 @@ describe('DestinationCreate', () => {
124126
it('should render Bucket input and allow to type text in manual mode', async () => {
125127
renderDestinationCreate(flags);
126128

127-
const manualRadio = screen.getByLabelText('Enter Bucket manually');
129+
const manualRadio = screen.getByLabelText(
130+
'Enter Bucket details manually'
131+
);
128132
await userEvent.click(manualRadio);
129133

130134
const bucketInput = screen.getByLabelText('Bucket');
@@ -223,10 +227,12 @@ describe('DestinationCreate', () => {
223227
expect(endpointInput).toBeDisabled();
224228
});
225229

226-
it('should enable the Endpoint field when "Enter Bucket manually" is selected', async () => {
230+
it('should enable the Endpoint field when "Enter Bucket details manually" is selected', async () => {
227231
renderDestinationCreate(flags);
228232

229-
const manualRadio = screen.getByLabelText('Enter Bucket manually');
233+
const manualRadio = screen.getByLabelText(
234+
'Enter Bucket details manually'
235+
);
230236
await userEvent.click(manualRadio);
231237

232238
const endpointInput = screen.getByLabelText('Endpoint');
@@ -237,7 +243,9 @@ describe('DestinationCreate', () => {
237243
renderDestinationCreate(flags);
238244

239245
// Switch to manual mode and fill in values
240-
const manualRadio = screen.getByLabelText('Enter Bucket manually');
246+
const manualRadio = screen.getByLabelText(
247+
'Enter Bucket details manually'
248+
);
241249
await userEvent.click(manualRadio);
242250

243251
const bucketInput = screen.getByLabelText('Bucket');
@@ -312,7 +320,9 @@ describe('DestinationCreate', () => {
312320
await userEvent.type(destinationNameInput, 'Test');
313321

314322
// Switch to manual bucket entry to allow typing
315-
const manualRadio = screen.getByLabelText('Enter Bucket manually');
323+
const manualRadio = screen.getByLabelText(
324+
'Enter Bucket details manually'
325+
);
316326
await userEvent.click(manualRadio);
317327

318328
const endpointInput = screen.getByLabelText('Endpoint');

‎packages/manager/src/features/Delivery/Destinations/DestinationForm/DestinationEdit.test.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -114,10 +114,12 @@ describe('DestinationEdit', () => {
114114
await waitForElementToBeRemoved(loadingElement);
115115
};
116116

117-
it('should default to "Enter Bucket manually" radio in edit mode', async () => {
117+
it('should default to "Enter Bucket details manually" radio in edit mode', async () => {
118118
await renderEditWithMockDestination();
119119

120-
const manualRadio = screen.getByLabelText('Enter Bucket manually');
120+
const manualRadio = screen.getByLabelText(
121+
'Enter Bucket details manually'
122+
);
121123
expect(manualRadio).toBeChecked();
122124
});
123125

‎packages/manager/src/features/Delivery/Shared/DestinationAkamaiObjectStorageDetailsForm.tsx‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,17 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
103103
<Typography sx={{ mt: 2 }} variant="h3">
104104
Bucket
105105
</Typography>
106+
<Typography
107+
sx={{
108+
mt: 2,
109+
maxWidth: 440,
110+
whiteSpace: 'preserve-spaces',
111+
}}
112+
>
113+
Choose how to provide bucket details. Selecting a bucket associated with
114+
your account will auto-fill the required settings. Entering a bucket
115+
manually requires you to provide all connection details.
116+
</Typography>
106117
<RadioGroup
107118
onChange={(_, value) => handleBucketConfigurationChange(value)}
108119
sx={{ '&[role="radiogroup"]': { mb: 0 } }}
@@ -115,7 +126,7 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
115126
/>
116127
<FormControlLabel
117128
control={<Radio />}
118-
label="Enter Bucket manually"
129+
label="Enter Bucket details manually"
119130
value="bucket_entered_manually"
120131
/>
121132
</RadioGroup>
@@ -155,6 +166,7 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
155166
);
156167
}}
157168
options={buckets}
169+
placeholder="Select a Bucket"
158170
textFieldProps={{
159171
inputProps: {
160172
'data-pendo-id': `${pendoPageId}Bucket`,
@@ -204,7 +216,8 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
204216
onChange={(value) => {
205217
field.onChange(value);
206218
}}
207-
placeholder="Endpoint for the destination"
219+
placeholder="https://us-ord-1.linodeobjects.com"
220+
tooltipText="The Object Storage service endpoint associated with your bucket's region"
208221
value={field.value}
209222
/>
210223
)}
@@ -222,6 +235,7 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
222235
label="Access Key ID"
223236
onBlur={field.onBlur}
224237
onChange={(value) => field.onChange(value)}
238+
tooltipText="The access key identifier used for authentication"
225239
value={field.value}
226240
/>
227241
)}
@@ -239,6 +253,7 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
239253
label="Secret Access Key"
240254
onBlur={field.onBlur}
241255
onChange={(value) => field.onChange(value)}
256+
tooltipText="The confidential security credential used with Access Key ID to access Object Storage"
242257
value={field.value}
243258
/>
244259
)}
@@ -268,6 +283,7 @@ export const DestinationAkamaiObjectStorageDetailsForm = ({
268283
optional
269284
placeholder="Prefix for log storage path"
270285
sx={{ maxWidth: 416 }}
286+
tooltipText="The path prefix used for organizing uploaded objects"
271287
value={field.value}
272288
/>
273289
)}

‎packages/manager/src/features/Delivery/Streams/StreamForm/Clusters/StreamFormClusters.test.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ describe('StreamFormClusters', () => {
156156

157157
it('should filter clusters by name', async () => {
158158
await renderComponentWithoutSelectedClusters();
159-
const input = screen.getByPlaceholderText('Search');
159+
const input = screen.getByPlaceholderText('Search for a cluster');
160160

161161
// Type test value inside the search
162162
await userEvent.click(input);
@@ -169,7 +169,7 @@ describe('StreamFormClusters', () => {
169169

170170
it('should filter clusters by region with search input', async () => {
171171
await renderComponentWithoutSelectedClusters();
172-
const input = screen.getByPlaceholderText('Search');
172+
const input = screen.getByPlaceholderText('Search for a cluster');
173173

174174
// Type test value inside the search
175175
await userEvent.click(input);
@@ -185,7 +185,7 @@ describe('StreamFormClusters', () => {
185185

186186
it('should filter clusters by log generation status with search input', async () => {
187187
await renderComponentWithoutSelectedClusters();
188-
const input = screen.getByPlaceholderText('Search');
188+
const input = screen.getByPlaceholderText('Search for a cluster');
189189

190190
// Type test value inside the search
191191
await userEvent.click(input);
@@ -198,7 +198,7 @@ describe('StreamFormClusters', () => {
198198

199199
it('should filter clusters by log generation status with autocomplete', async () => {
200200
await renderComponentWithoutSelectedClusters();
201-
const input = screen.getByPlaceholderText('Log Generation');
201+
const input = screen.getByPlaceholderText('Logging Status');
202202

203203
// Enabled filter option
204204
await userEvent.click(input);
@@ -488,7 +488,7 @@ describe('StreamFormClusters', () => {
488488
it('should only display regions that have clusters and the required capability', async () => {
489489
await renderComponentWithoutSelectedClusters();
490490

491-
const regionSelect = screen.getByPlaceholderText('Select Region');
491+
const regionSelect = screen.getByPlaceholderText('Select a Region');
492492
await userEvent.click(regionSelect);
493493

494494
const regionOptions = await screen.findAllByRole('option');

‎packages/manager/src/features/Delivery/Streams/StreamForm/Clusters/StreamFormClusters.tsx‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -234,12 +234,20 @@ export const StreamFormClusters = (props: StreamFormClustersProps) => {
234234
<ErrorState errorText="There was an error loading your Kubernetes clusters." />
235235
) : (
236236
<>
237+
<Typography sx={{ mt: 2 }}>
238+
Select the LKE clusters that will send audit logs to the configured
239+
destination. Logging must be enabled for a cluster before it can be
240+
selected. To enable logging for a cluster, use the Linode API to{' '}
241+
<Link
242+
external
243+
hideIcon
244+
to="https://techdocs.akamai.com/linode-api/reference/put-lke-cluster"
245+
>
246+
update the cluster
247+
</Link>{' '}
248+
to set <i>audit_logs_enabled</i> to <i>true</i>.
249+
</Typography>
237250
<div hidden={true}>
238-
<Notice sx={{ mt: 2 }} variant="info">
239-
Disabling this option allows you to manually define which clusters
240-
will be included in the stream. Stream will not be updated
241-
automatically with newly configured clusters.
242-
</Notice>
243251
<Controller
244252
name={controlPaths.isAutoAddAllClustersEnabled}
245253
render={({ field }) => (
@@ -258,25 +266,17 @@ export const StreamFormClusters = (props: StreamFormClustersProps) => {
258266
}
259267
await trigger('stream.details');
260268
}}
261-
sxFormLabel={{ ml: -1 }}
269+
sxFormLabel={{ ml: -1, mt: 2 }}
262270
text="Automatically include all existing and recently configured clusters."
263271
/>
264272
)}
265273
/>
274+
<Notice sx={{ mt: 2 }} variant="info">
275+
Disable this option if you wish to manually define which clusters
276+
are included in the stream. The stream won’t be automatically
277+
updated when new clusters are configured.
278+
</Notice>
266279
</div>
267-
<Typography sx={{ mt: 2 }}>
268-
Select the LKE clusters that will send audit logs to the configured
269-
destination. Logging must be enabled for a cluster before it can be
270-
selected. To enable logging for a cluster, use the Linode API{' '}
271-
<Link
272-
external
273-
hideIcon
274-
to="https://techdocs.akamai.com/linode-api/reference/put-lke-cluster"
275-
>
276-
update the cluster
277-
</Link>{' '}
278-
to set audit_logs_enabled to true.
279-
</Typography>
280280
<StyledGrid
281281
sx={{
282282
alignItems: 'center',
@@ -302,7 +302,7 @@ export const StreamFormClusters = (props: StreamFormClustersProps) => {
302302
}}
303303
label="Search"
304304
onSearch={(value) => setSearchText(value)}
305-
placeholder="Search"
305+
placeholder="Search for a cluster"
306306
value={searchText}
307307
/>
308308
<StyledSelectsWrapper>
@@ -313,7 +313,7 @@ export const StreamFormClusters = (props: StreamFormClustersProps) => {
313313
onChange={(_, region) => {
314314
setRegionFilter(region?.id ?? '');
315315
}}
316-
placeholder="Select Region"
316+
placeholder="Select a Region"
317317
regionFilter="core"
318318
regions={visibleRegions ?? []}
319319
sx={{
@@ -325,7 +325,7 @@ export const StreamFormClusters = (props: StreamFormClustersProps) => {
325325
label=""
326326
onChange={(_, option) => setLogGenerationFilter(option?.value)}
327327
options={logGenerationOptions}
328-
placeholder="Log Generation"
328+
placeholder="Logging Status"
329329
sx={{
330330
width: '160px !important',
331331
}}

‎packages/manager/src/features/Delivery/Streams/StreamForm/Clusters/StreamFormClustersTableContent.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export const StreamFormClusterTableContent = ({
9595
>
9696
Region
9797
</TableSortCell>
98-
<TableCell sx={{ width: '25%' }}>Log Generation</TableCell>
98+
<TableCell sx={{ width: '25%' }}>Logging Status</TableCell>
9999
</TableRow>
100100
</TableHead>
101101
<TableBody>

0 commit comments

Comments
 (0)