Skip to content

Commit bf12e0e

Browse files
N7RemusN7Remus
committed
create query action by id, and update tenant components
1 parent 9fdc075 commit bf12e0e

File tree

7 files changed

+135
-162
lines changed

7 files changed

+135
-162
lines changed

‎.gitignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,4 +27,5 @@ yarn-debug.log*
2727
yarn-error.log*
2828

2929
!types.d.ts
30-
.vscode
30+
.vscode
31+
stats.html

‎src/components/helpdialog/HelpDialog.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const HelpDialog = (): JSX.Element => {
2525
open={ helpOpen }
2626
onClose={ handleCloseHelp }
2727
maxWidth='xs'
28-
content={ <><ShortcutKeys /></> }
28+
content={ <ShortcutKeys /> }
2929
actions={
3030
<Box display="flex" alignItems="center" justifyContent="space-between" width="100%">
3131
<Box display="flex" alignItems="left">

‎src/components/managementservice/tenants/Tenant.tsx‎

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
1-
import React from 'react';
2-
import { Button, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions } from '@mui/material';
31
import { useEffect, useMemo, useState } from 'react';
2+
import { Button, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions } from '@mui/material';
43
// eslint-disable-next-line camelcase
54
import { MaterialReactTable, type MRT_ColumnDef } from 'material-react-table';
65
import { Tenant } from '../../../utils/types';
76
import { useAppDispatch } from '../../../store/hooks';
87
import { createData, deleteData, getData, patchData } from '../../../store/actions/managementActions';
8+
import TenantFQDNTable from './TenatnFQDN';
9+
import TenantOAuthTable from './TenantOAuth';
10+
export interface TenantProp {
11+
tenantId: number;
12+
}
913

1014
const TenantTable = () => {
1115

@@ -54,7 +58,7 @@ const TenantTable = () => {
5458
fetchProduct();
5559
}, []);
5660

57-
const [ open, setOpen ] = React.useState(false);
61+
const [ open, setOpen ] = useState(false);
5862

5963
const handleClickOpen = () => {
6064
setId(0);
@@ -148,6 +152,10 @@ const TenantTable = () => {
148152

149153
value={description}
150154
/>
155+
Tenant domains
156+
<TenantFQDNTable tenantId={id} />
157+
Tenant Auth
158+
<TenantOAuthTable tenantId={id} />
151159

152160
</DialogContent>
153161
<DialogActions>

‎src/components/managementservice/tenants/TenantOAuth.tsx‎

Lines changed: 11 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
/* eslint-disable camelcase */
2-
import { SyntheticEvent, useEffect, useMemo, useState } from 'react';
2+
import { useEffect, useMemo, useState } from 'react';
33
import { MaterialReactTable, type MRT_ColumnDef } from 'material-react-table';
4-
import { Button, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions, Autocomplete } from '@mui/material';
4+
import { Button, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions } from '@mui/material';
55
import { Tenant, TenantOAuth } from '../../../utils/types';
66
import { useAppDispatch } from '../../../store/hooks';
7-
import { createData, deleteData, getData, patchData } from '../../../store/actions/managementActions';
7+
import { createData, deleteData, getData, getDataByID, patchData } from '../../../store/actions/managementActions';
88
import { notificationsActions } from '../../../store/slices/notificationsSlice';
9+
import { TenantProp } from './Tenant';
910

10-
const TenantOAuthTable = () => {
11+
const TenantOAuthTable = (props: TenantProp) => {
12+
const tenantId = props.tenantId;
1113

1214
const dispatch = useAppDispatch();
1315

@@ -71,10 +73,9 @@ const TenantOAuthTable = () => {
7173
const [ data, setData ] = useState([]);
7274
const [ isLoading, setIsLoading ] = useState(false);
7375
const [ id, setId ] = useState(0);
74-
const [ tenantId, setTenantId ] = useState(0);
7576
const [ profileUrl, setProfileUrl ] = useState('');
7677
const [ wellknown, setWellknown ] = useState('');
77-
const [ wellknownEpmty, setWellknownEmpty ] = useState(true);
78+
const [ wellknownEmpty, setWellknownEmpty ] = useState(true);
7879

7980
const [ key, setKey ] = useState('');
8081
const [ secret, setSecret ] = useState('');
@@ -83,8 +84,7 @@ const TenantOAuthTable = () => {
8384
const [ scope, setScope ] = useState('');
8485
const [ scopeDelimeter, setScopeDelimeter ] = useState('');
8586
const [ redirect, setRedirect ] = useState('');
86-
const [ tenantIdOption, setTenantIdOption ] = useState<Tenant | undefined>();
87-
87+
8888
async function fetchProduct() {
8989
setIsLoading(true);
9090

@@ -96,7 +96,7 @@ const TenantOAuthTable = () => {
9696
});
9797

9898
// eslint-disable-next-line @typescript-eslint/no-explicit-any
99-
dispatch(getData('tenantOAuths')).then((tdata: any) => {
99+
dispatch(getDataByID(tenantId, 'tenantOAuths')).then((tdata: any) => {
100100
if (tdata != undefined) {
101101
setData(tdata.data);
102102
}
@@ -114,16 +114,13 @@ const TenantOAuthTable = () => {
114114

115115
const handleClickOpen = () => {
116116
setId(0);
117-
setTenantId(0);
118117
setProfileUrl('https://edumeet.example.com/kc/realms/<realm>/protocol/openid-connect/userinfo');
119118
setKey('edumeet-dev-client');
120119
setSecret('');
121120
setAuthorizeUrl('https://edumeet.example.com/kc/realms/<realm>/protocol/openid-connect/auth');
122121
setAccessUrl('https://edumeet.example.com/kc/realms/<realm>/protocol/openid-connect/token');
123122
setScope('openid profile email');
124123
setScopeDelimeter(' ');
125-
setTenantIdOption(undefined);
126-
setTenantId(0);
127124
setRedirect('https://edumeet.example.com/mgmt/oauth/tenant/callback');
128125
setOpen(true);
129126
};
@@ -132,13 +129,6 @@ const TenantOAuthTable = () => {
132129
setOpen(true);
133130
};
134131

135-
const handleTenantIdChange = (event: SyntheticEvent<Element, Event>, newValue: Tenant) => {
136-
if (newValue) {
137-
setTenantId(newValue.id);
138-
setTenantIdOption(newValue);
139-
}
140-
};
141-
142132
const handleProfileUrlChange = (event: { target: { value: React.SetStateAction<string>; }; }) => {
143133
setProfileUrl(event.target.value);
144134
};
@@ -289,16 +279,6 @@ const TenantOAuthTable = () => {
289279
onChange={handleTenantIdChange}
290280
value={tenantId}
291281
/> */}
292-
<Autocomplete
293-
options={tenants}
294-
getOptionLabel={(option) => option.name}
295-
fullWidth
296-
disableClearable
297-
onChange={handleTenantIdChange}
298-
value={tenantIdOption}
299-
sx={{ marginTop: '8px' }}
300-
renderInput={(params) => <TextField {...params} label="Tenant" />}
301-
/>
302282
<TextField
303283
margin="dense"
304284
required
@@ -309,7 +289,7 @@ const TenantOAuthTable = () => {
309289
value={wellknown}
310290
onChange={handleWellknownChange}
311291
/>
312-
<Button onClick={handleWellknownUpdate} variant="contained" fullWidth disabled={wellknownEpmty} >Update parameters from URL</Button>
292+
<Button onClick={handleWellknownUpdate} variant="contained" fullWidth disabled={wellknownEmpty} >Update parameters from URL</Button>
313293
<TextField
314294
margin="dense"
315295
required
@@ -409,7 +389,7 @@ const TenantOAuthTable = () => {
409389
const r = row.getAllCells();
410390

411391
const tid = r[0].getValue();
412-
const ttenantId= r[1].getValue();
392+
// const ttenantId= r[1].getValue();
413393
const taccess= r[2].getValue();
414394
const tauthorize= r[3].getValue();
415395
const tprofile= r[4].getValue();
@@ -420,17 +400,6 @@ const TenantOAuthTable = () => {
420400
if (typeof tid === 'number') {
421401
setId(tid);
422402
}
423-
if (typeof ttenantId === 'string') {
424-
const ttenant = tenants.find((x) => x.id === parseInt(ttenantId));
425-
426-
if (ttenant) {
427-
setTenantIdOption(ttenant);
428-
}
429-
setTenantId(parseInt(ttenantId));
430-
} else {
431-
setTenantId(0);
432-
}
433-
434403
if (typeof tprofile === 'string') { setProfileUrl(tprofile); } else {
435404
setProfileUrl('');
436405
}

‎src/components/managementservice/tenants/TenatnFQDN.tsx‎

Lines changed: 13 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
1-
import { SyntheticEvent, useEffect, useMemo, useState } from 'react';
1+
import { useEffect, useMemo, useState } from 'react';
22
// eslint-disable-next-line camelcase
33
import { MaterialReactTable, type MRT_ColumnDef } from 'material-react-table';
4-
import { Button, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions, Autocomplete } from '@mui/material';
4+
import { Button, Dialog, DialogTitle, DialogContent, DialogContentText, TextField, DialogActions } from '@mui/material';
55
import { Tenant, TenantFQDN } from '../../../utils/types';
66
import { useAppDispatch } from '../../../store/hooks';
7-
import { createData, deleteData, getData, patchData } from '../../../store/actions/managementActions';
8-
9-
const TenantFQDNTable = () => {
7+
import { createData, deleteData, getData, getDataByID, patchData } from '../../../store/actions/managementActions';
8+
import { TenantProp } from './Tenant';
109

10+
const TenantFQDNTable = (props: TenantProp) => {
11+
const tenantId = props.tenantId;
1112
const dispatch = useAppDispatch();
1213

1314
type TenantOptionTypes = Array<Tenant>
@@ -54,9 +55,6 @@ const TenantFQDNTable = () => {
5455
const [ data, setData ] = useState([]);
5556
const [ isLoading, setIsLoading ] = useState(false);
5657
const [ id, setId ] = useState(0);
57-
const [ tenantId, setTenantId ] = useState(0);
58-
59-
const [ tenantIdOption, setTenantIdOption ] = useState<Tenant | undefined>();
6058

6159
const [ fqdn, setFQDN ] = useState('');
6260

@@ -73,7 +71,7 @@ const TenantFQDNTable = () => {
7371
});
7472

7573
// eslint-disable-next-line @typescript-eslint/no-explicit-any
76-
dispatch(getData('tenantFQDNs')).then((tdata: any) => {
74+
dispatch(getDataByID(tenantId, 'tenantFQDNs')).then((tdata: any) => {
7775
if (tdata != undefined) {
7876
setData(tdata.data);
7977
}
@@ -90,8 +88,6 @@ const TenantFQDNTable = () => {
9088

9189
const handleClickOpen = () => {
9290
setId(0);
93-
setTenantId(0);
94-
setTenantIdOption(undefined);
9591
setDescription('');
9692
setFQDN('');
9793
setOpen(true);
@@ -101,13 +97,6 @@ const TenantFQDNTable = () => {
10197
setOpen(true);
10298
};
10399

104-
const handleTenantIdChange = (event: SyntheticEvent<Element, Event>, newValue: Tenant) => {
105-
if (newValue) {
106-
setTenantId(newValue.id);
107-
setTenantIdOption(newValue);
108-
}
109-
};
110-
111100
const handleDescriptionChange = (event: { target: { value: React.SetStateAction<string>; }; }) => {
112101
setDescription(event.target.value);
113102
};
@@ -164,16 +153,6 @@ const TenantFQDNTable = () => {
164153
These are the parameters that you can change.
165154
</DialogContentText>
166155
<input type="hidden" name="id" value={id} />
167-
<Autocomplete
168-
options={tenants}
169-
getOptionLabel={(option) => option.name}
170-
fullWidth
171-
disableClearable
172-
onChange={handleTenantIdChange}
173-
value={tenantIdOption}
174-
sx={{ marginTop: '8px' }}
175-
renderInput={(params) => <TextField {...params} label="Tenant" />}
176-
/>
177156
<TextField
178157
margin="dense"
179158
id="description"
@@ -207,25 +186,14 @@ const TenantFQDNTable = () => {
207186
const r = row.getAllCells();
208187

209188
const tid = r[0].getValue();
210-
const ttenantId = r[1].getValue();
189+
// const ttenantId = r[1].getValue();
211190
const tdescription = r[2].getValue();
212191
const tfqdn = r[3].getValue();
213192

214193
if (typeof tid === 'number') {
215194
setId(tid);
216195
}
217196

218-
if (typeof ttenantId === 'string') {
219-
const ttenant = tenants.find((x) => x.id === parseInt(ttenantId));
220-
221-
if (ttenant) {
222-
setTenantIdOption(ttenant);
223-
}
224-
setTenantId(parseInt(ttenantId));
225-
} else {
226-
setTenantId(0);
227-
}
228-
229197
if (typeof tdescription === 'string') {
230198
setDescription(tdescription);
231199
} else {
@@ -244,7 +212,11 @@ const TenantFQDNTable = () => {
244212
columns={columns}
245213
data={data} // fallback to array if data is undefined
246214
initialState={{
247-
columnVisibility: {}
215+
columnVisibility: {
216+
id: false,
217+
tenantId: false,
218+
description: false
219+
}
248220
}}
249221
state={{ isLoading }} /></>;
250222
};

‎src/store/actions/managementActions.tsx‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,41 @@ export const getData = (serviceName:string): AppThunk<Promise<object | undefined
7676
return data;
7777
};
7878

79+
export const getDataByID = (id:string|number, serviceName:string): AppThunk<Promise<object | undefined>> => async (
80+
dispatch,
81+
_getState,
82+
{ managementService }
83+
): Promise<object | undefined> => {
84+
85+
logger.debug('getData() [serviceName:%s]', serviceName);
86+
87+
let data: object | undefined;
88+
89+
try {
90+
91+
data = await (await managementService).service(serviceName).find(
92+
{
93+
query: {
94+
id: id,
95+
$sort: {
96+
id: 1
97+
}
98+
}
99+
}
100+
);
101+
102+
} catch (error) {
103+
if (error instanceof Error) {
104+
dispatch(notificationsActions.enqueueNotification({
105+
message: `Failed to get data: ${error.toString()}`,
106+
options: { variant: 'error' }
107+
}));
108+
}
109+
}
110+
111+
return data;
112+
};
113+
79114
export const deleteData = (id : number, serviceName:string): AppThunk<Promise<object | undefined>> => async (
80115
dispatch,
81116
_getState,

0 commit comments

Comments
 (0)