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 React from 'react'
19
import {
20
  Box,
21
  CircularProgress,
22
  CircularProgressProps,
23
  Typography
24
} from '@mui/material'
25

26
function CircularProgressWithLabel (props: CircularProgressProps & { value: number }): JSX.Element {
27
  return (
28
    <Box position='relative' display='inline-flex'>
29
      <CircularProgress variant='determinate' size={80} {...props} />
30
      <Box
31
        top={0}
32
        left={0}
33
        bottom={0}
34
        right={0}
35
        position='absolute'
36
        display='flex'
37
        alignItems='center'
38
        justifyContent='center'
39
      >
40
        <Typography variant='h4' component='div' color='textSecondary'>
41
          {`${Math.round(props.value)}%`}
42
        </Typography>
43
      </Box>
44
    </Box>
45
  )
46
}
47

48
function OverallConcurrency (props) {
49
  const { maxSession, sessionCount } = props
50
  const currentLoad = Math.min(
51
    ((sessionCount / (maxSession === 0 ? 1 : maxSession)) * 100), 100)
52

53
  return (
54
    <Box
55
      p={2}
56
      m={2}
57
      data-testid='overall-concurrency'
58
    >
59
      <Typography
60
        align='center'
61
        gutterBottom
62
        variant='h4'
63
      >
64
        Concurrency
65
      </Typography>
66
      <Box
67
        display='flex'
68
        justifyContent='center'
69
        mt={2}
70
        mb={2}
71
        data-testid='concurrency-usage'
72
      >
73
        <CircularProgressWithLabel value={currentLoad} />
74
      </Box>
75
      <Typography
76
        align='center'
77
        variant='h4'
78
      >
79
        <Box display='inline' data-testid='session-count'>
80
          {sessionCount}
81
        </Box>
82
        {' / '}
83
        <Box display='inline' data-testid='max-session'>
84
          {maxSession}
85
        </Box>
86
      </Typography>
87
    </Box>
88
  )
89
}
90

91
export default OverallConcurrency
92

93