Skip to content

Commit 12c3c8e

Browse files
gregorydlogangregorydlogan
committed
Merge branch 'fix-main-typing' of Arnei/opencast-admin-interface into main
Pull request #1150 Fixes #1149 Fix typescript conflict for initial state of table field "resource"
2 parents f5621c7 + 9312ac3 commit 12c3c8e

4 files changed

Lines changed: 43 additions & 110 deletions

File tree

‎src/components/shared/Table.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { JSX, useEffect, useRef, useState } from "react";
22
import { useTranslation } from "react-i18next";
33
import {
4+
getMultiSelect,
45
getPageOffset,
56
getTable,
67
getTableDirection,
@@ -60,6 +61,7 @@ const Table = ({
6061
const rows = useAppSelector(state => getTableRows(state));
6162
const sortBy = useAppSelector(state => getTableSorting(state));
6263
const reverse = useAppSelector(state => getTableDirection(state));
64+
const multiSelect = useAppSelector(state => getMultiSelect(state));
6365

6466
// Size options for pagination
6567
const sizeOptions = [10, 20, 50, 100, 1000];
@@ -179,7 +181,7 @@ const Table = ({
179181
<thead>
180182
<tr>
181183
{/* Only show if multiple selection is possible */}
182-
{table.multiSelect ? (
184+
{multiSelect ? (
183185
<th className="small">
184186
{/*Checkbox to select all rows*/}
185187
<input
@@ -245,7 +247,7 @@ const Table = ({
245247
<tr key={key}>
246248
{/* Show if multi selection is possible */}
247249
{/* Checkbox for selection of row */}
248-
{table.multiSelect && "id" in row && (
250+
{multiSelect && "id" in row && (
249251
<td>
250252
<input
251253
type="checkbox"

‎src/selectors/tableSelectors.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ export const getNumberDirectAccessiblePages = (state: RootState) => state.table.
1616
export const getResourceType = (state: RootState) => state.table.resource;
1717
export const getTableSorting = (state: RootState) => state.table.sortBy[state.table.resource];
1818
export const getTableDirection = (state: RootState) => state.table.reverse[state.table.resource];
19+
export const getMultiSelect = (state: RootState) => state.table.multiSelect[state.table.resource];
1920
export const getTable = (state: RootState) => state.table;
2021
export const getDeactivatedColumns = (state: RootState) =>
2122
state.table.columns.filter((column) => column.deactivated);

‎src/slices/tableSlice.ts‎

Lines changed: 27 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { PayloadAction, SerializedError, createSlice } from '@reduxjs/toolkit'
2-
import { TableConfig } from '../configs/tableConfigs/aclsTableConfig';
2+
import { aclsTableConfig, TableConfig } from '../configs/tableConfigs/aclsTableConfig';
33
import { Server } from './serverSlice';
44
import { Recording } from './recordingSlice';
55
import { Job } from './jobSlice';
@@ -10,6 +10,15 @@ import { AclResult } from './aclSlice';
1010
import { ThemeDetailsType } from './themeSlice';
1111
import { Series } from './seriesSlice';
1212
import { Event } from './eventSlice';
13+
import { eventsTableConfig } from '../configs/tableConfigs/eventsTableConfig';
14+
import { seriesTableConfig } from '../configs/tableConfigs/seriesTableConfig';
15+
import { recordingsTableConfig } from '../configs/tableConfigs/recordingsTableConfig';
16+
import { jobsTableConfig } from '../configs/tableConfigs/jobsTableConfig';
17+
import { serversTableConfig } from '../configs/tableConfigs/serversTableConfig';
18+
import { servicesTableConfig } from '../configs/tableConfigs/servicesTableConfig';
19+
import { usersTableConfig } from '../configs/tableConfigs/usersTableConfig';
20+
import { groupsTableConfig } from '../configs/tableConfigs/groupsTableConfig';
21+
import { themesTableConfig } from '../configs/tableConfigs/themesTableConfig';
1322

1423
/*
1524
Overview of the structure of the data in arrays in state
@@ -70,14 +79,14 @@ export function isSeries(row: Row | Event | Series | Recording | Server | Job |
7079
// TODO: Improve row typing. While this somewhat correctly reflects the current state of our code, it is rather annoying to work with.
7180
export type Row = { selected: boolean } & ( Event | Series | Recording | Server | Job | Service | User | Group | AclResult | ThemeDetailsType )
7281

73-
export type Resource = "" | "events" | "series" | "recordings" | "jobs" | "servers" | "services" | "users" | "groups" | "acls" | "themes"
82+
export type Resource = "events" | "series" | "recordings" | "jobs" | "servers" | "services" | "users" | "groups" | "acls" | "themes"
7483

7584
export type ReverseOptions = "ASC" | "DESC"
7685

7786
export type TableState = {
7887
status: 'uninitialized' | 'loading' | 'succeeded' | 'failed',
7988
error: SerializedError | null,
80-
multiSelect: boolean,
89+
multiSelect: { [key in Resource]: boolean },
8190
resource: Resource,
8291
pages: Page[],
8392
columns: TableConfig["columns"],
@@ -93,8 +102,19 @@ export type TableState = {
93102
const initialState: TableState = {
94103
status: 'uninitialized',
95104
error: null,
96-
multiSelect: false,
97-
resource: "",
105+
multiSelect: {
106+
events: eventsTableConfig.multiSelect,
107+
series: seriesTableConfig.multiSelect,
108+
recordings: recordingsTableConfig.multiSelect,
109+
jobs: jobsTableConfig.multiSelect,
110+
servers: serversTableConfig.multiSelect,
111+
services: servicesTableConfig.multiSelect,
112+
users: usersTableConfig.multiSelect,
113+
groups: groupsTableConfig.multiSelect,
114+
acls: aclsTableConfig.multiSelect,
115+
themes: themesTableConfig.multiSelect,
116+
},
117+
resource: "events",
98118
pages: [],
99119
columns: [],
100120
sortBy: {
@@ -137,7 +157,7 @@ const tableSlice = createSlice({
137157
initialState,
138158
reducers: {
139159
loadResourceIntoTable(state, action: PayloadAction<{
140-
multiSelect: TableState["multiSelect"],
160+
multiSelect: TableState["multiSelect"][Resource],
141161
columns: TableConfig["columns"],
142162
resource: TableState["resource"],
143163
pages: TableState["pages"],
@@ -146,7 +166,7 @@ const tableSlice = createSlice({
146166
reverse: TableState["reverse"][Resource],
147167
totalItems: TableState["pagination"]["totalItems"],
148168
}>) {
149-
state.multiSelect = action.payload.multiSelect;
169+
state.multiSelect[action.payload.resource] = action.payload.multiSelect;
150170
state.columns = action.payload.columns;
151171
state.resource = action.payload.resource;
152172
state.pages = action.payload.pages;

‎src/thunks/tableThunks.ts‎

Lines changed: 11 additions & 101 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,4 @@
1-
import { eventsTableConfig } from "../configs/tableConfigs/eventsTableConfig";
2-
import { seriesTableConfig } from "../configs/tableConfigs/seriesTableConfig";
3-
import { recordingsTableConfig } from "../configs/tableConfigs/recordingsTableConfig";
4-
import { jobsTableConfig } from "../configs/tableConfigs/jobsTableConfig";
5-
import { serversTableConfig } from "../configs/tableConfigs/serversTableConfig";
6-
import { servicesTableConfig } from "../configs/tableConfigs/servicesTableConfig";
7-
import { usersTableConfig } from "../configs/tableConfigs/usersTableConfig";
8-
import { groupsTableConfig } from "../configs/tableConfigs/groupsTableConfig";
9-
import { TableConfig, aclsTableConfig } from "../configs/tableConfigs/aclsTableConfig";
10-
import { themesTableConfig } from "../configs/tableConfigs/themesTableConfig";
1+
import { TableConfig } from "../configs/tableConfigs/aclsTableConfig";
112
import {
123
deselectAll,
134
loadResourceIntoTable,
@@ -78,21 +69,13 @@ export const loadEventsIntoTable = (): AppThunk => async (dispatch, getState) =>
7869
resource: "events" as const,
7970
rows: resource,
8071
columns: events.columns,
81-
multiSelect: table.multiSelect,
72+
multiSelect: table.multiSelect["events"],
8273
pages: pages,
8374
sortBy: table.sortBy["events"],
8475
reverse: table.reverse["events"],
8576
totalItems: total,
8677
};
8778

88-
if (table.resource !== "events") {
89-
const multiSelect = eventsTableConfig.multiSelect;
90-
91-
tableData = {
92-
...tableData,
93-
multiSelect: multiSelect,
94-
};
95-
}
9679
dispatch(loadResourceIntoTable(tableData));
9780
};
9881

@@ -125,21 +108,13 @@ export const loadSeriesIntoTable = (): AppThunk => (dispatch, getState) => {
125108
resource: "series" as const,
126109
rows: resource,
127110
columns: series.columns,
128-
multiSelect: table.multiSelect,
111+
multiSelect: table.multiSelect["series"],
129112
pages: pages,
130113
sortBy: table.sortBy["series"],
131114
reverse: table.reverse["series"],
132115
totalItems: total,
133116
};
134117

135-
if (table.resource !== "series") {
136-
const multiSelect = seriesTableConfig.multiSelect;
137-
138-
tableData = {
139-
...tableData,
140-
multiSelect: multiSelect,
141-
};
142-
}
143118
dispatch(loadResourceIntoTable(tableData));
144119
};
145120

@@ -154,7 +129,7 @@ export const loadRecordingsIntoTable = (): AppThunk => (dispatch, getState) => {
154129
let tableData = {
155130
resource: "recordings" as const,
156131
columns: recordings.columns,
157-
multiSelect: table.multiSelect,
132+
multiSelect: table.multiSelect["recordings"],
158133
pages: pages,
159134
sortBy: table.sortBy["recordings"],
160135
reverse: table.reverse["recordings"],
@@ -164,15 +139,6 @@ export const loadRecordingsIntoTable = (): AppThunk => (dispatch, getState) => {
164139
totalItems: total,
165140
};
166141

167-
if (table.resource !== "recordings") {
168-
const multiSelect = recordingsTableConfig.multiSelect;
169-
170-
tableData = {
171-
...tableData,
172-
multiSelect: multiSelect,
173-
};
174-
}
175-
176142
dispatch(loadResourceIntoTable(tableData));
177143
};
178144

@@ -190,21 +156,13 @@ export const loadJobsIntoTable = (): AppThunk => (dispatch, getState) => {
190156
return { ...obj, selected: false }
191157
}),
192158
columns: jobs.columns,
193-
multiSelect: table.multiSelect,
159+
multiSelect: table.multiSelect["jobs"],
194160
pages: pages,
195161
sortBy: table.sortBy["jobs"],
196162
reverse: table.reverse["jobs"],
197163
totalItems: total,
198164
};
199165

200-
if (table.resource !== "jobs") {
201-
const multiSelect = jobsTableConfig.multiSelect;
202-
203-
tableData = {
204-
...tableData,
205-
multiSelect: multiSelect,
206-
};
207-
}
208166
dispatch(loadResourceIntoTable(tableData));
209167
};
210168

@@ -222,21 +180,13 @@ export const loadServersIntoTable = (): AppThunk => (dispatch, getState) => {
222180
return { ...obj, selected: false }
223181
}),
224182
columns: servers.columns,
225-
multiSelect: table.multiSelect,
183+
multiSelect: table.multiSelect["servers"],
226184
pages: pages,
227185
sortBy: table.sortBy["servers"],
228186
reverse: table.reverse["servers"],
229187
totalItems: total,
230188
};
231189

232-
if (table.resource !== "servers") {
233-
const multiSelect = serversTableConfig.multiSelect;
234-
235-
tableData = {
236-
...tableData,
237-
multiSelect: multiSelect,
238-
};
239-
}
240190
dispatch(loadResourceIntoTable(tableData));
241191
};
242192

@@ -256,20 +206,11 @@ export const loadServicesIntoTable = (): AppThunk => (dispatch, getState) => {
256206
totalItems: total,
257207
resource: "services" as const,
258208
columns: services.columns,
259-
multiSelect: table.multiSelect,
209+
multiSelect: table.multiSelect["services"],
260210
sortBy: table.sortBy["services"],
261211
reverse: table.reverse["services"],
262212
};
263213

264-
if (table.resource !== "services") {
265-
const multiSelect = servicesTableConfig.multiSelect;
266-
267-
tableData = {
268-
...tableData,
269-
multiSelect: multiSelect,
270-
};
271-
}
272-
273214
dispatch(loadResourceIntoTable(tableData));
274215
};
275216

@@ -287,21 +228,13 @@ export const loadUsersIntoTable = (): AppThunk => (dispatch, getState) => {
287228
return { ...obj, selected: false }
288229
}),
289230
columns: users.columns,
290-
multiSelect: table.multiSelect,
231+
multiSelect: table.multiSelect["users"],
291232
pages: pages,
292233
sortBy: table.sortBy["users"],
293234
reverse: table.reverse["users"],
294235
totalItems: total,
295236
};
296237

297-
if (table.resource !== "users") {
298-
const multiSelect = usersTableConfig.multiSelect;
299-
300-
tableData = {
301-
...tableData,
302-
multiSelect: multiSelect,
303-
};
304-
}
305238
dispatch(loadResourceIntoTable(tableData));
306239
};
307240

@@ -319,21 +252,13 @@ export const loadGroupsIntoTable = (): AppThunk => (dispatch, getState) => {
319252
return { ...obj, selected: false }
320253
}),
321254
columns: groups.columns,
322-
multiSelect: table.multiSelect,
255+
multiSelect: table.multiSelect["groups"],
323256
pages: pages,
324257
sortBy: table.sortBy["groups"],
325258
reverse: table.reverse["groups"],
326259
totalItems: total,
327260
};
328261

329-
if (table.resource !== "groups") {
330-
const multiSelect = groupsTableConfig.multiSelect;
331-
332-
tableData = {
333-
...tableData,
334-
multiSelect: multiSelect,
335-
};
336-
}
337262
dispatch(loadResourceIntoTable(tableData));
338263
};
339264

@@ -351,20 +276,13 @@ export const loadAclsIntoTable = (): AppThunk => (dispatch, getState) => {
351276
return { ...obj, selected: false }
352277
}),
353278
columns: acls.columns,
354-
multiSelect: table.multiSelect,
279+
multiSelect: table.multiSelect["acls"],
355280
pages: pages,
356281
sortBy: table.sortBy["acls"],
357282
reverse: table.reverse["acls"],
358283
totalItems: total,
359284
};
360285

361-
if (table.resource !== "acls") {
362-
const multiSelect = aclsTableConfig.multiSelect;
363-
tableData = {
364-
...tableData,
365-
multiSelect: multiSelect,
366-
};
367-
}
368286
dispatch(loadResourceIntoTable(tableData));
369287
};
370288

@@ -382,21 +300,13 @@ export const loadThemesIntoTable = (): AppThunk => (dispatch, getState) => {
382300
return { ...obj, selected: false }
383301
}),
384302
columns: themes.columns,
385-
multiSelect: table.multiSelect,
303+
multiSelect: table.multiSelect["themes"],
386304
pages: pages,
387305
sortBy: table.sortBy["themes"],
388306
reverse: table.reverse["themes"],
389307
totalItems: total,
390308
};
391309

392-
if (table.resource !== "themes") {
393-
const multiSelect = themesTableConfig.multiSelect;
394-
395-
tableData = {
396-
...tableData,
397-
multiSelect: multiSelect,
398-
};
399-
}
400310
dispatch(loadResourceIntoTable(tableData));
401311
};
402312

0 commit comments

Comments
 (0)