1
// Licensed to the Software Freedom Conservancy (SFC) under one
2
// or more contributor license agreements.  See the NOTICE file
3
// distributed with this work for additional information
4
// regarding copyright ownership.  The SFC licenses this file
5
// to you under the Apache License, Version 2.0 (the
6
// "License"); you may not use this file except in compliance
7
// with the License.  You may obtain a copy of the License at
8
//
9
//   http://www.apache.org/licenses/LICENSE-2.0
10
//
11
// Unless required by applicable law or agreed to in writing,
12
// software distributed under the License is distributed on an
13
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
14
// KIND, either express or implied.  See the License for the
15
// specific language governing permissions and limitations
16
// under the License.
17

18
import { Box, Grid, Typography } from '@mui/material'
19
import React from 'react'
20
import LinearProgress, {
21
  LinearProgressProps
22
} from '@mui/material/LinearProgress'
23

24
function LinearProgressWithLabel (props: LinearProgressProps & { value: number }): JSX.Element {
25
  return (
26
    <Box display='flex' alignItems='center'>
27
      <Box width='100%' mr={1}>
28
        <LinearProgress variant='determinate' {...props} />
29
      </Box>
30
      <Box minWidth={35}>
31
        <Typography variant='body2' color='textSecondary'>
32
          {`${Math.round(props.value)}%`}
33
        </Typography>
34
      </Box>
35
    </Box>
36
  )
37
}
38

39
function NodeLoad (props) {
40
  const { node } = props
41
  const sessionCount = node.sessionCount ?? 0
42
  const currentLoad = sessionCount === 0
43
    ? 0
44
    : Math.min(((sessionCount / node.maxSession) * 100), 100).toFixed(2)
45

46
  return (
47
    <Grid item xs={12}>
48
      <Grid
49
        container
50
        justifyContent='space-between'
51
        spacing={2}
52
      >
53
        <Grid item xs={3}>
54
          <Box pt={1} mt={2}>
55
            <Typography
56
              variant='body2'
57
              gutterBottom
58
            >
59
              Sessions: {sessionCount}
60
            </Typography>
61
          </Box>
62
        </Grid>
63
        <Grid item xs={9}>
64
          <Box pt={1} mt={2}>
65
            <Typography
66
              variant='body2'
67
              gutterBottom
68
            >
69
              Max. Concurrency: {node.maxSession}
70
            </Typography>
71
          </Box>
72
        </Grid>
73
        <Grid item xs={12}>
74
          <LinearProgressWithLabel value={Number(currentLoad)} />
75
        </Grid>
76
      </Grid>
77
    </Grid>
78
  )
79
}
80

81
export default NodeLoad
82

83