Skip to content

Commit 87fb0ae

Browse files
committed
Add alert banner to system items dialog #1608
1 parent 97082de commit 87fb0ae

File tree

5 files changed

+73
-47
lines changed

5 files changed

+73
-47
lines changed

cypress/e2e/with_api/systems/functions.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -160,8 +160,8 @@ export const moveItemToSystem = (values: {
160160
cy.findByText('Storage 2').click();
161161
});
162162

163-
// eslint-disable-next-line cypress/no-unnecessary-waiting
164-
cy.wait(4000);
163+
cy.findByText('Item Moving Rule Applied').should('exist');
164+
165165
cy.findByRole('button', { name: 'Move here' }).should('not.be.disabled');
166166
cy.findByRole('button', { name: 'Move here' }).click();
167167
cy.findByRole('dialog').should('not.exist', { timeout: 10000 });

cypress/e2e/with_mock_data/systems.cy.ts

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -990,8 +990,7 @@ describe('Systems', () => {
990990
cy.findByRole('button', { name: 'navigate to systems home' }).click();
991991
cy.findByLabelText('Storage row').click();
992992

993-
// eslint-disable-next-line cypress/no-unnecessary-waiting
994-
cy.wait(4000);
993+
cy.findByText('Item Moving Rule Applied').should('exist');
995994
cy.findByRole('button', { name: 'Move here' }).click();
996995
});
997996

@@ -1069,8 +1068,7 @@ describe('Systems', () => {
10691068
cy.findByLabelText('Row Actions').first().click();
10701069
cy.findByText('Edit').click();
10711070

1072-
// eslint-disable-next-line cypress/no-unnecessary-waiting
1073-
cy.wait(100);
1071+
cy.findByText('Item Moving Rule Applied').should('exist');
10741072

10751073
cy.findByRole('button', { name: 'Next' }).click();
10761074

@@ -1102,8 +1100,7 @@ describe('Systems', () => {
11021100
cy.findByLabelText('Row Actions').first().click();
11031101
cy.findByText('Duplicate').click();
11041102

1105-
// eslint-disable-next-line cypress/no-unnecessary-waiting
1106-
cy.wait(100);
1103+
cy.findByText('Item Creation Rule Applied').should('exist');
11071104

11081105
cy.findByRole('button', { name: 'Next' }).click();
11091106
cy.findByRole('button', { name: 'Next' }).click();

src/items/__snapshots__/itemsTable.component.test.tsx.snap

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -3557,12 +3557,12 @@ exports[`Items Table > renders the dense table correctly 1`] = `
35573557
</span>
35583558
</div>
35593559
<input
3560-
aria-describedby=":r2r4:-helper-text"
3560+
aria-describedby=":r2qu:-helper-text"
35613561
aria-invalid="false"
35623562
aria-label="Filter by Serial Number"
35633563
autocomplete="off"
35643564
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedStart MuiInputBase-inputAdornedEnd css-110vr2a-MuiInputBase-input-MuiInput-input"
3565-
id=":r2r4:"
3565+
id=":r2qu:"
35663566
placeholder="Filter by Serial Number"
35673567
title="Filter by Serial Number"
35683568
type="text"
@@ -3600,7 +3600,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
36003600
</div>
36013601
<p
36023602
class="MuiFormHelperText-root MuiFormHelperText-sizeMedium css-v98l45-MuiFormHelperText-root"
3603-
id=":r2r4:-helper-text"
3603+
id=":r2qu:-helper-text"
36043604
>
36053605
<label>
36063606
Filter Mode: Fuzzy
@@ -3714,11 +3714,11 @@ exports[`Items Table > renders the dense table correctly 1`] = `
37143714
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd css-6h9cc6-MuiInputBase-root-MuiInput-root"
37153715
>
37163716
<input
3717-
aria-describedby=":r2rd:-helper-text"
3717+
aria-describedby=":r2r7:-helper-text"
37183718
aria-invalid="false"
37193719
autocomplete="off"
37203720
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
3721-
id=":r2rd:"
3721+
id=":r2r7:"
37223722
inputmode="text"
37233723
placeholder="Min"
37243724
type="text"
@@ -3749,7 +3749,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
37493749
</div>
37503750
<p
37513751
class="MuiFormHelperText-root MuiFormHelperText-sizeMedium css-18y2hez-MuiFormHelperText-root"
3752-
id=":r2rd:-helper-text"
3752+
id=":r2r7:-helper-text"
37533753
>
37543754
<label>
37553755
Filter Mode: Between Inclusive
@@ -3766,7 +3766,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
37663766
aria-invalid="false"
37673767
autocomplete="off"
37683768
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
3769-
id=":r2rg:"
3769+
id=":r2ra:"
37703770
inputmode="text"
37713771
placeholder="Max"
37723772
type="text"
@@ -3904,11 +3904,11 @@ exports[`Items Table > renders the dense table correctly 1`] = `
39043904
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd css-6h9cc6-MuiInputBase-root-MuiInput-root"
39053905
>
39063906
<input
3907-
aria-describedby=":r2rn:-helper-text"
3907+
aria-describedby=":r2rh:-helper-text"
39083908
aria-invalid="false"
39093909
autocomplete="off"
39103910
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
3911-
id=":r2rn:"
3911+
id=":r2rh:"
39123912
inputmode="text"
39133913
placeholder="Min"
39143914
type="text"
@@ -3939,7 +3939,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
39393939
</div>
39403940
<p
39413941
class="MuiFormHelperText-root MuiFormHelperText-sizeMedium css-18y2hez-MuiFormHelperText-root"
3942-
id=":r2rn:-helper-text"
3942+
id=":r2rh:-helper-text"
39433943
>
39443944
<label>
39453945
Filter Mode: Between Inclusive
@@ -3956,7 +3956,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
39563956
aria-invalid="false"
39573957
autocomplete="off"
39583958
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
3959-
id=":r2rq:"
3959+
id=":r2rk:"
39603960
inputmode="text"
39613961
placeholder="Max"
39623962
type="text"
@@ -4094,11 +4094,11 @@ exports[`Items Table > renders the dense table correctly 1`] = `
40944094
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd css-6h9cc6-MuiInputBase-root-MuiInput-root"
40954095
>
40964096
<input
4097-
aria-describedby=":r2s1:-helper-text"
4097+
aria-describedby=":r2rr:-helper-text"
40984098
aria-invalid="false"
40994099
autocomplete="off"
41004100
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
4101-
id=":r2s1:"
4101+
id=":r2rr:"
41024102
inputmode="text"
41034103
placeholder="Min"
41044104
type="text"
@@ -4129,7 +4129,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
41294129
</div>
41304130
<p
41314131
class="MuiFormHelperText-root MuiFormHelperText-sizeMedium css-18y2hez-MuiFormHelperText-root"
4132-
id=":r2s1:-helper-text"
4132+
id=":r2rr:-helper-text"
41334133
>
41344134
<label>
41354135
Filter Mode: Between Inclusive
@@ -4146,7 +4146,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
41464146
aria-invalid="false"
41474147
autocomplete="off"
41484148
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
4149-
id=":r2s4:"
4149+
id=":r2ru:"
41504150
inputmode="text"
41514151
placeholder="Max"
41524152
type="text"
@@ -4284,11 +4284,11 @@ exports[`Items Table > renders the dense table correctly 1`] = `
42844284
class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd css-6h9cc6-MuiInputBase-root-MuiInput-root"
42854285
>
42864286
<input
4287-
aria-describedby=":r2sb:-helper-text"
4287+
aria-describedby=":r2s5:-helper-text"
42884288
aria-invalid="false"
42894289
autocomplete="off"
42904290
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
4291-
id=":r2sb:"
4291+
id=":r2s5:"
42924292
inputmode="text"
42934293
placeholder="Min"
42944294
type="text"
@@ -4319,7 +4319,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
43194319
</div>
43204320
<p
43214321
class="MuiFormHelperText-root MuiFormHelperText-sizeMedium css-18y2hez-MuiFormHelperText-root"
4322-
id=":r2sb:-helper-text"
4322+
id=":r2s5:-helper-text"
43234323
>
43244324
<label>
43254325
Filter Mode: Between Inclusive
@@ -4336,7 +4336,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
43364336
aria-invalid="false"
43374337
autocomplete="off"
43384338
class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-1yrc8ca-MuiInputBase-input-MuiInput-input"
4339-
id=":r2se:"
4339+
id=":r2s8:"
43404340
inputmode="text"
43414341
placeholder="Max"
43424342
type="text"
@@ -4474,9 +4474,9 @@ exports[`Items Table > renders the dense table correctly 1`] = `
44744474
aria-expanded="false"
44754475
aria-haspopup="listbox"
44764476
aria-label="Filter by Is Defective"
4477-
aria-labelledby=":r2sl:"
4477+
aria-labelledby=":r2sf:"
44784478
class="MuiSelect-select MuiSelect-standard MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-10y8whu-MuiSelect-select-MuiInputBase-input-MuiInput-input"
4479-
id=":r2sl:"
4479+
id=":r2sf:"
44804480
role="combobox"
44814481
tabindex="0"
44824482
>
@@ -5127,7 +5127,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
51275127
>
51285128
<label
51295129
class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-animated MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-animated css-10j3yc8-MuiFormLabel-root-MuiInputLabel-root"
5130-
for="mrt-rows-per-page-:r2qt:"
5130+
for="mrt-rows-per-page-:r2qn:"
51315131
>
51325132
Rows per page
51335133
</label>
@@ -5148,7 +5148,7 @@ exports[`Items Table > renders the dense table correctly 1`] = `
51485148
aria-hidden="true"
51495149
aria-invalid="false"
51505150
class="MuiSelect-nativeInput css-j0riat-MuiSelect-nativeInput"
5151-
id="mrt-rows-per-page-:r2qt:"
5151+
id="mrt-rows-per-page-:r2qn:"
51525152
tabindex="-1"
51535153
value="5"
51545154
/>

src/systems/systemItemsDialog.component.test.tsx

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -222,31 +222,36 @@ describe('SystemItemsDialog', () => {
222222
await user.click(screen.getByLabelText('navigate to systems home'));
223223

224224
await waitFor(() => {
225-
expect(screen.getByText('Giant laser')).toBeInTheDocument();
225+
expect(screen.getByText('Pulse Laser')).toBeInTheDocument();
226226
});
227227

228-
await user.click(screen.getByText('Giant laser'));
228+
await user.click(screen.getByText('Pulse Laser'));
229229

230-
await waitFor(() => {
231-
expect(screen.getByText('Smaller laser')).toBeInTheDocument();
232-
});
230+
expect(
231+
await screen.findByText('Item Moving Rule Applied')
232+
).toBeInTheDocument();
233+
expect(
234+
await screen.findByLabelText(
235+
'The items usage statuses will be updated to In Use, as defined by the rules'
236+
)
237+
).toBeInTheDocument();
233238

234239
await user.click(screen.getByRole('button', { name: 'Move here' }));
235240

236241
expect(axiosPatchSpy).toHaveBeenCalledWith('/v1/items/KvT2Ox7n', {
237-
system_id: '65328f34a40ff5301575a4e3',
242+
system_id: '656da8ef9cba7a76c6f81a5d',
238243
usage_status_id: '1',
239244
});
240245
expect(axiosPatchSpy).toHaveBeenCalledWith('/v1/items/G463gOIA', {
241-
system_id: '65328f34a40ff5301575a4e3',
246+
system_id: '656da8ef9cba7a76c6f81a5d',
242247
usage_status_id: '1',
243248
});
244249

245250
expect(mockOnClose).toHaveBeenCalled();
246251
expect(mockOnChangeSelectedItems).toHaveBeenCalledWith({});
247252
}, 10000);
248253

249-
it('moves selected systems (to non-root system)', async () => {
254+
it('moves selected systems (to non-root system with the same system type)', async () => {
250255
props.parentSystemId = SystemsJSON[2].id;
251256
createView();
252257

@@ -257,22 +262,28 @@ describe('SystemItemsDialog', () => {
257262
await user.click(screen.getByLabelText('navigate to systems home'));
258263

259264
await waitFor(() => {
260-
expect(screen.getByText('Giant laser')).toBeInTheDocument();
265+
expect(screen.getByText('Pulse Laser')).toBeInTheDocument();
261266
});
262267

263-
await user.click(screen.getByText('Giant laser'));
268+
await user.click(screen.getByText('Pulse Laser'));
264269

265-
await waitFor(() => {
266-
expect(screen.getByText('Smaller laser')).toBeInTheDocument();
267-
});
270+
expect(
271+
await screen.findByText('Item Moving Rule Applied')
272+
).toBeInTheDocument();
273+
274+
expect(
275+
await screen.findByLabelText(
276+
'The items usage statuses we remain the same, as defined by the rules'
277+
)
278+
).toBeInTheDocument();
268279

269280
await user.click(screen.getByRole('button', { name: 'Move here' }));
270281

271282
expect(axiosPatchSpy).toHaveBeenCalledWith('/v1/items/KvT2Ox7n', {
272-
system_id: '65328f34a40ff5301575a4e3',
283+
system_id: '656da8ef9cba7a76c6f81a5d',
273284
});
274285
expect(axiosPatchSpy).toHaveBeenCalledWith('/v1/items/G463gOIA', {
275-
system_id: '65328f34a40ff5301575a4e3',
286+
system_id: '656da8ef9cba7a76c6f81a5d',
276287
});
277288

278289
expect(mockOnClose).toHaveBeenCalled();

src/systems/systemItemsDialog.component.tsx

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
useGetSystems,
1919
useGetSystemsBreadcrumbs,
2020
} from '../api/systems';
21+
import MRTTopTableAlert from '../common/mrtTopTableAlert.component';
2122
import handleTransferState from '../handleTransferState';
2223
import Breadcrumbs from '../view/breadcrumbs.component';
2324
import { SystemsTableView } from './systemsTableView.component';
@@ -61,7 +62,8 @@ const SystemItemsDialog = React.memo((props: SystemItemsDialogProps) => {
6162
const { data: tableRules } = useGetRules(srcSystemTypeId);
6263

6364
// This should be a list of 1 rule
64-
const { data: selectedRules } = useGetRules(srcSystemTypeId, dstSystemTypeId);
65+
const { data: selectedRules, isLoading: isSelectedRulesLoading } =
66+
useGetRules(srcSystemTypeId, dstSystemTypeId);
6567

6668
const [placeIntoSystemError, setPlaceIntoSystemError] = React.useState<
6769
string | undefined
@@ -168,6 +170,22 @@ const SystemItemsDialog = React.memo((props: SystemItemsDialogProps) => {
168170
/>
169171
</Grid>
170172
<Grid size={12}>
173+
{parentSystemId &&
174+
selectedItems.length !== 0 &&
175+
parentSystemId !== selectedItems[0].system_id &&
176+
!isSelectedRulesLoading &&
177+
!systemsDataLoading && (
178+
<MRTTopTableAlert
179+
title="Item Moving Rule Applied"
180+
showInfoTooltip
181+
infoTooltipTitle={
182+
selectedRules && selectedRules[0]
183+
? `The items usage statuses will be updated to ${selectedRules[0].dst_usage_status?.value}, as defined by the rules`
184+
: 'The items usage statuses we remain the same, as defined by the rules'
185+
}
186+
alertProps={{ elevation: 1 }}
187+
/>
188+
)}
171189
<SystemsTableView
172190
systemsData={systemsData}
173191
systemsDataLoading={systemsDataLoading}

0 commit comments

Comments
 (0)