Skip to content

Commit 0774660

Browse files
SilviaAmAmSilviaAmAm
authored
Merge pull request #418 from maykinmedia/issue/#393-frontend
🐛 #393 - fix: prevent API calls from being made when selecting za…
2 parents 5857064 + 3479678 commit 0774660

File tree

8 files changed

+137
-60
lines changed

8 files changed

+137
-60
lines changed

‎frontend/package-lock.json

+93-14
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frontend/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"@maykin-ui/admin-ui": "^0.0.35",
6+
"@maykin-ui/admin-ui": "^0.0.36",
77
"@storybook/test-runner": "^0.18.2",
88
"@testing-library/jest-dom": "^5.17.0",
99
"@testing-library/user-event": "^13.5.0",

‎frontend/src/pages/destructionlist/abstract/BaseListView.tsx

+28-19
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,8 @@ export type BaseListViewProps = React.PropsWithChildren<{
5151

5252
dataGridProps?: Partial<DataGridProps>;
5353

54-
onClearZaakSelection?: () => void; // FIXME: REMOVE?
54+
onClearZaakSelection?: () => void;
55+
onSelectionChange?: (rows: AttributeData[]) => void;
5556
}>;
5657

5758
export function BaseListView({
@@ -78,6 +79,7 @@ export function BaseListView({
7879
children,
7980

8081
onClearZaakSelection,
82+
onSelectionChange,
8183
}: BaseListViewProps) {
8284
const { state } = useNavigation();
8385
const [page, setPage] = usePage();
@@ -142,23 +144,28 @@ export function BaseListView({
142144

143145
// Selection actions.
144146
const getSelectionActions = useCallback(() => {
145-
const fixedItems =
146-
selectable && hasSelection
147-
? ([
148-
{
149-
children: (
150-
<>
151-
<Solid.ExclamationTriangleIcon />
152-
Huidige selectie wissen
153-
</>
154-
),
155-
variant: "warning",
156-
wrap: false,
157-
onClick: handleClearZaakSelection,
158-
},
159-
] as ButtonProps[])
160-
: [];
161-
return [...(selectionActions || []), ...fixedItems];
147+
const disabled = selectable && hasSelection;
148+
const dynamicItems = (selectionActions || []).map((props) =>
149+
Object.hasOwn(props, "disabled")
150+
? props
151+
: { ...props, disabled: selectable && !hasSelection },
152+
);
153+
const fixedItems = disabled
154+
? ([
155+
{
156+
children: (
157+
<>
158+
<Solid.ExclamationTriangleIcon />
159+
Huidige selectie wissen
160+
</>
161+
),
162+
variant: "warning",
163+
wrap: false,
164+
onClick: handleClearZaakSelection,
165+
},
166+
] as ButtonProps[])
167+
: [];
168+
return [...dynamicItems, ...fixedItems];
162169
}, [selectable, hasSelection, selectedZakenOnPage, selectionActions]);
163170

164171
return (
@@ -182,7 +189,8 @@ export function BaseListView({
182189
allowSelectAllPages,
183190
allPagesSelected,
184191
count: paginatedZaken.count,
185-
equalityChecker: (a, b) => a.uuid === b.uuid || a.url === b.url,
192+
equalityChecker: (a, b) =>
193+
a && b && (a.uuid === b.uuid || a.url === b.url),
186194
fields,
187195
filterTransform,
188196
loading: state === "loading",
@@ -199,6 +207,7 @@ export function BaseListView({
199207
onPageChange: setPage,
200208
onSelect: handleSelect,
201209
onSelectAllPages: handleSelectAllPages,
210+
onSelectionChange: onSelectionChange,
202211
onSort: setSort,
203212

204213
...dataGridProps,

‎frontend/src/pages/destructionlist/create/DestructionListCreate.tsx

+1-2
Original file line numberDiff line numberDiff line change
@@ -113,8 +113,6 @@ export function DestructionListCreatePage() {
113113
Vernietigingslijst opstellen
114114
</>
115115
),
116-
disabled: !allPagesSelected && !hasSelection,
117-
118116
variant: "primary",
119117
wrap: false,
120118
onClick: handleClick,
@@ -131,6 +129,7 @@ export function DestructionListCreatePage() {
131129
<Body>
132130
<Form
133131
fields={modalFormFields}
132+
justify="stretch"
134133
onSubmit={handleSubmit}
135134
validateOnChange={true}
136135
labelSubmit="Vernietigingslijst opstellen"

‎frontend/src/pages/destructionlist/detail/components/DestructionListEdit/DestructionListEdit.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,7 @@ export function DestructionListEdit() {
109109
Annuleren
110110
</>
111111
),
112+
disabled: false, // Set explicitly to prevent automatic value based on selection presence.
112113
wrap: false,
113114
onClick: () => handleSetEditing(false),
114115
},

‎frontend/src/pages/destructionlist/detail/components/DestructionListProcessReview/DestructionListProcessReview.tsx

-4
Original file line numberDiff line numberDiff line change
@@ -142,9 +142,6 @@ export function DestructionListProcessReview() {
142142
};
143143
}, [reviewItems, objectList]);
144144

145-
// Selection actions based on `editingState`.
146-
const selectionActions: ButtonProps[] = useMemo(() => [], []);
147-
148145
/**
149146
* Gets called when te selection is cleared.
150147
*/
@@ -227,7 +224,6 @@ export function DestructionListProcessReview() {
227224
paginatedZaken={paginatedZaken}
228225
secondaryNavigationItems={secondaryNavigationItems}
229226
selectable="visible"
230-
selectionActions={selectionActions}
231227
storageKey={storageKey}
232228
onClearZaakSelection={handleClearSelection}
233229
>

0 commit comments

Comments
 (0)