@@ -22,16 +22,12 @@ import createStyles from "@mui/styles/createStyles";
22
22
import withStyles from "@mui/styles/withStyles" ;
23
23
import get from "lodash/get" ;
24
24
import Grid from "@mui/material/Grid" ;
25
-
26
- import { ITenant } from "../ListTenants/types" ;
27
25
import {
28
26
containerForHeader ,
29
27
pageContentStyles ,
30
28
tenantDetailsStyles ,
31
29
} from "../../Common/FormComponents/common/styleLibrary" ;
32
30
import { AppState } from "../../../../store" ;
33
- import { ErrorResponseHandler } from "../../../../common/types" ;
34
- import api from "../../../../common/api" ;
35
31
import PageHeader from "../../Common/PageHeader/PageHeader" ;
36
32
import { CircleIcon , MinIOTierIconXs , TrashIcon } from "../../../../icons" ;
37
33
import { niceBytes } from "../../../../common/utils" ;
@@ -46,15 +42,10 @@ import BoxIconButton from "../../Common/BoxIconButton/BoxIconButton";
46
42
import withSuspense from "../../Common/Components/withSuspense" ;
47
43
import { IAM_PAGES } from "../../../../common/SecureComponent/permissions" ;
48
44
import { tenantIsOnline } from "../ListTenants/utils" ;
49
- import {
50
- setErrorSnackMessage ,
51
- setSnackBarMessage ,
52
- } from "../../../../systemSlice" ;
53
- import {
54
- setTenantDetailsLoad ,
55
- setTenantInfo ,
56
- setTenantName ,
57
- } from "../tenantsSlice" ;
45
+ import { setSnackBarMessage } from "../../../../systemSlice" ;
46
+ import { setTenantDetailsLoad , setTenantName } from "../tenantsSlice" ;
47
+ import { getTenantAsync } from "../thunks/tenantDetailsAsync" ;
48
+ import { LinearProgress } from "@mui/material" ;
58
49
59
50
const TenantYAML = withSuspense ( React . lazy ( ( ) => import ( "./TenantYAML" ) ) ) ;
60
51
const TenantSummary = withSuspense ( React . lazy ( ( ) => import ( "./TenantSummary" ) ) ) ;
@@ -188,72 +179,28 @@ const TenantDetails = ({ classes, match, history }: ITenantDetailsProps) => {
188
179
const tenantNamespace = match . params [ "tenantNamespace" ] ;
189
180
const [ deleteOpen , setDeleteOpen ] = useState < boolean > ( false ) ;
190
181
182
+ // if the current tenant selected is not the one in the redux, reload it
191
183
useEffect ( ( ) => {
192
- if ( ! loadingTenant ) {
193
- if (
194
- tenantName !== selectedTenant ||
195
- tenantNamespace !== selectedNamespace
196
- ) {
197
- dispatch (
198
- setTenantName ( {
199
- name : tenantName ,
200
- namespace : tenantNamespace ,
201
- } )
202
- ) ;
203
- dispatch ( setTenantDetailsLoad ( true ) ) ;
204
- }
184
+ if (
185
+ selectedNamespace !== tenantNamespace ||
186
+ selectedTenant !== tenantName
187
+ ) {
188
+ dispatch (
189
+ setTenantName ( {
190
+ name : tenantName ,
191
+ namespace : tenantNamespace ,
192
+ } )
193
+ ) ;
194
+ dispatch ( getTenantAsync ( ) ) ;
205
195
}
206
196
} , [
207
- loadingTenant ,
208
197
selectedTenant ,
209
198
selectedNamespace ,
210
199
dispatch ,
211
200
tenantName ,
212
201
tenantNamespace ,
213
202
] ) ;
214
203
215
- useEffect ( ( ) => {
216
- if ( loadingTenant ) {
217
- api
218
- . invoke (
219
- "GET" ,
220
- `/api/v1/namespaces/${ tenantNamespace } /tenants/${ tenantName } `
221
- )
222
- . then ( ( res : ITenant ) => {
223
- // add computed fields
224
- const resPools = ! res . pools ? [ ] : res . pools ;
225
-
226
- let totalInstances = 0 ;
227
- let totalVolumes = 0 ;
228
- let poolNamedIndex = 0 ;
229
- for ( let pool of resPools ) {
230
- const cap =
231
- pool . volumes_per_server *
232
- pool . servers *
233
- pool . volume_configuration . size ;
234
- pool . label = `pool-${ poolNamedIndex } ` ;
235
- if ( pool . name === undefined || pool . name === "" ) {
236
- pool . name = pool . label ;
237
- }
238
- pool . capacity = niceBytes ( cap + "" ) ;
239
- pool . volumes = pool . servers * pool . volumes_per_server ;
240
- totalInstances += pool . servers ;
241
- totalVolumes += pool . volumes ;
242
- poolNamedIndex += 1 ;
243
- }
244
- res . total_instances = totalInstances ;
245
- res . total_volumes = totalVolumes ;
246
-
247
- dispatch ( setTenantInfo ( res ) ) ;
248
- dispatch ( setTenantDetailsLoad ( false ) ) ;
249
- } )
250
- . catch ( ( err : ErrorResponseHandler ) => {
251
- dispatch ( setErrorSnackMessage ( err ) ) ;
252
- dispatch ( setTenantDetailsLoad ( false ) ) ;
253
- } ) ;
254
- }
255
- } , [ loadingTenant , tenantNamespace , tenantName , dispatch ] ) ;
256
-
257
204
const path = get ( match , "path" , "/" ) ;
258
205
const splitSections = path . split ( "/" ) ;
259
206
@@ -332,6 +279,11 @@ const TenantDetails = ({ classes, match, history }: ITenantDetailsProps) => {
332
279
/>
333
280
334
281
< PageLayout className = { classes . pageContainer } >
282
+ { loadingTenant && (
283
+ < Grid item xs = { 12 } >
284
+ < LinearProgress />
285
+ </ Grid >
286
+ ) }
335
287
< Grid item xs = { 12 } >
336
288
< ScreenTitle
337
289
icon = {
@@ -417,7 +369,7 @@ const TenantDetails = ({ classes, match, history }: ITenantDetailsProps) => {
417
369
variant = "outlined"
418
370
aria-label = "Refresh List"
419
371
onClick = { ( ) => {
420
- dispatch ( setTenantDetailsLoad ( true ) ) ;
372
+ dispatch ( getTenantAsync ( ) ) ;
421
373
} }
422
374
>
423
375
< span > Refresh</ span > < RefreshIcon />
0 commit comments