System page: various minor UI tweaks (blakeblackshear#4985)

* System page: various minor UI tweaks

* Be consistent with capitalisation

* Change detection start epoch to running/idle

* Remove detection start column entirely

web/src/routes/System.jsx

@@ -142,15 +142,15 @@ export default function System() {
  <Thead>
  <Tr>
  <Th>P-ID</Th>
- <Th>Detection Start</Th>
  <Th>Inference Speed</Th>
+ <Th>CPU %</Th>
  </Tr>
  </Thead>
  <Tbody>
  <Tr>
  <Td>{detectors[detector]['pid']}</Td>
- <Td>{detectors[detector]['detection_start']}</Td>
- <Td>{detectors[detector]['inference_speed']}</Td>
+ <Td>{detectors[detector]['inference_speed']} ms</Td>
+ <Td>{cpu_usages[detectors[detector]['pid']]?.['cpu'] || '- '}%</Td>
  </Tr>
  </Tbody>
  </Table>
@@ -185,7 +185,7 @@ export default function System() {
  <Table className="w-full">
  <Thead>
  <Tr>
- <Th>Gpu %</Th>
+ <Th>GPU %</Th>
  <Th>Memory %</Th>
  </Tr>
  </Thead>
@@ -220,20 +220,27 @@ export default function System() {
  <Tr>
  <Th>Process</Th>
  <Th>P-ID</Th>
- <Th>fps</Th>
- <Th>Cpu %</Th>
+ <Th>FPS</Th>
+ <Th>CPU %</Th>
  <Th>Memory %</Th>
  </Tr>
  </Thead>
  <Tbody>
- <Tr key="capture" index="0">
+ <Tr key="ffmpeg" index="0">
+ <Td>ffmpeg</Td>
+ <Td>{cameras[camera]['ffmpeg_pid'] || '- '}</Td>
+ <Td>{cameras[camera]['camera_fps'] || '- '}</Td>
+ <Td>{cpu_usages[cameras[camera]['ffmpeg_pid']]?.['cpu'] || '- '}%</Td>
+ <Td>{cpu_usages[cameras[camera]['ffmpeg_pid']]?.['mem'] || '- '}%</Td>
+ </Tr> 
+ <Tr key="capture" index="1">
  <Td>Capture</Td>
  <Td>{cameras[camera]['capture_pid'] || '- '}</Td>
  <Td>{cameras[camera]['process_fps'] || '- '}</Td>
  <Td>{cpu_usages[cameras[camera]['capture_pid']]?.['cpu'] || '- '}%</Td>
  <Td>{cpu_usages[cameras[camera]['capture_pid']]?.['mem'] || '- '}%</Td>
  </Tr>
- <Tr key="detect" index="1">
+ <Tr key="detect" index="2">
  <Td>Detect</Td>
  <Td>{cameras[camera]['pid'] || '- '}</Td>
  <Td>
@@ -242,13 +249,6 @@ export default function System() {
  <Td>{cpu_usages[cameras[camera]['pid']]?.['cpu'] || '- '}%</Td>
  <Td>{cpu_usages[cameras[camera]['pid']]?.['mem'] || '- '}%</Td>
  </Tr>
- <Tr key="ffmpeg" index="2">
- <Td>ffmpeg</Td>
- <Td>{cameras[camera]['ffmpeg_pid'] || '- '}</Td>
- <Td>{cameras[camera]['camera_fps'] || '- '}</Td>
- <Td>{cpu_usages[cameras[camera]['ffmpeg_pid']]?.['cpu'] || '- '}%</Td>
- <Td>{cpu_usages[cameras[camera]['ffmpeg_pid']]?.['mem'] || '- '}%</Td>
- </Tr>
  </Tbody>
  </Table>
  </div>