3 |
3 |
6 | 
45 |
46 | 3. View smaller or larger timeframes of data by clicking the Change Timeframe button and selecting a range of time to view. One hour will view all data from the last hour, one day will view all data from the last day, etc.
47 | 
48 |
49 | ## How It Works
50 |
51 | The DockerWatch container holds four smaller containers: a web container, an api container, an InfluxDB database container, and a sensor container. The sensor collects data from the Docker daemon and stores it in the database. The API container queries for data from the database upon request from the web container. The CPU, Memory, Network, and Disk metrics for all containers in Docker Desktop, including DockerWatch, are monitored for as long as the DockerWatch container is running.
52 |
53 | ## Authors
54 |
55 | - Brynn Sakell [@BrynnSakell](https://github.com/BrynnSakell) | [LinkedIn](https://linkedin.com/in/brynnsakell)
56 | - Dan Pietsch [@dpietsch14](https://github.com/dpietsch14) | [LinkedIn](https://linkedin.com/in/danielpietsch14/)
57 | - Nadia Abowitz [@abowitzn](https://github.com/abowitzn) | [LinkedIn](https://linkedin.com/in/nadia-abowitz/)
58 | - Rob Mosher [@rob-mosher](https://github.com/rob-mosher) | [LinkedIn](https://linkedin.com/in/rob-mosher-it/)
59 | - Stephen Rivas [@stephenpharmd](https://github.com/stephenpharmd) | [LinkedIn](https://linkedin.com/in/stephenpharmd/)
60 |
61 | ## License
62 |
63 | This project is licensed under the [MIT License](LICENSE)
64 |
65 | ## Contributing
66 |
67 | DockerWatch launched on January 12, 2023 and is currently in active beta development through the OSlabs Beta community initiative. The application is licensed under the terms of the MIT license, making it a fully open source product. Developers are welcome to contribute to the codebase and expand on its features.
68 |
--------------------------------------------------------------------------------
/src/sensors/sensor1/dbInsert.js:
--------------------------------------------------------------------------------
1 | require('dotenv').config({ path: '../../../.env' });
2 |
3 | /** @module write
4 | * Writes a data point to InfluxDB using the Javascript client library with Node.js. */
5 | const { InfluxDB } = require('@influxdata/influxdb-client');
6 | const { Point } = require('@influxdata/influxdb-client');
7 |
8 | /* Environment variables * */
9 | const token = process.env.DB_INFLUXDB_INIT_ADMIN_TOKEN;
10 | const org = process.env.DB_INFLUXDB_INIT_ORG;
11 | const bucket = process.env.DB_INFLUXDB_INIT_BUCKET;
12 |
13 | const dbFunc = (containerStats) => {
14 | const dbURL = process.env.DB_URL || 'http://127.0.0.1:8086';
15 |
16 | // Create a write client from the getWriteApi method. Provide your `org` and `bucket`
17 | const client = new InfluxDB({ url: dbURL, token });
18 |
19 | const writeApi = client.getWriteApi(org, bucket, 's');
20 |
21 | // Create a point and write it to the buffer
22 | writeApi.useDefaultTags({
23 | container_id: 'container_id',
24 | container_name: 'container_name',
25 | });
26 |
27 | /* Use the Point() constructor to create a point,
28 | In InfluxDB, a point represents a single data record */
29 |
30 | const pointCPU = new Point('CPU')
31 | .tag('container_id', containerStats.id)
32 | .tag('container_name', containerStats.name)
33 | .floatField('cpu_usage', containerStats.cpu_usage)
34 | .floatField('precpu_usage', containerStats.precpu_usage)
35 | .floatField('system_cpu_usage', containerStats.system_cpu_usage)
36 | .floatField('system_precpu_usage', containerStats.system_precpu_usage)
37 | .floatField('online_cpus', containerStats.online_cpus);
38 |
39 | const pointMemory = new Point('Memory')
40 | .tag('container_id', containerStats.id)
41 | .tag('container_name', containerStats.name)
42 | .floatField('memory_limit', containerStats.memory_limit)
43 | .floatField('memory_usage', containerStats.memory_usage);
44 |
45 | const pointDisk = new Point('Disk')
46 | .tag('container_id', containerStats.id)
47 | .tag('container_name', containerStats.name)
48 | .floatField('read_value', containerStats.disk_read)
49 | .floatField('write_value', containerStats.disk_write);
50 |
51 | const pointNetwork = new Point('Network')
52 | .tag('container_id', containerStats.id)
53 | .tag('container_name', containerStats.name)
54 | .floatField('rx_bytes', containerStats.rx_bytes)
55 | .floatField('rx_dropped', containerStats.rx_dropped)
56 | .floatField('rx_errors', containerStats.rx_errors)
57 | .floatField('rx_packets', containerStats.rx_packets)
58 | .floatField('tx_bytes', containerStats.tx_bytes)
59 | .floatField('tx_dropped', containerStats.tx_dropped)
60 | .floatField('tx_errors', containerStats.tx_errors)
61 | .floatField('tx_packets', containerStats.tx_packets);
62 |
63 | // Use the writePoint() method to write the point to your InfluxDB bucket
64 | writeApi.writePoint(pointCPU);
65 | writeApi.writePoint(pointMemory);
66 | writeApi.writePoint(pointDisk);
67 | writeApi.writePoint(pointNetwork);
68 |
69 | // Flush pending writes and close writeApi
70 | writeApi
71 | .close()
72 | // .then(() => {
73 | // console.log('FINISHED');
74 | // })
75 | .catch((e) => {
76 | console.error(e);
77 | console.log('Finished ERROR');
78 | });
79 | };
80 |
81 | module.exports = dbFunc;
82 |
--------------------------------------------------------------------------------
/src/web/client/containers/Sidebar.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect, useRef } from 'react';
2 | import Container from '../components/ContainerButton';
3 |
4 | export default function Sidebar({ containerData, setContainerData }) {
5 | const [containerList, updateContainerList] = useState([]);
6 | // const timeFrame = useRef('1h');
7 | const [timeFrame, setTimeFrame] = useState('1h');
8 | const [timeDisplay, setTimeDisplay] = useState('Past 1 hour');
9 | /* contains the current running setInterval calling the
10 | function that requests the api for metric data for the last clicked container. */
11 | const intervalRef = useRef(0);
12 | const idRef = useRef(0);
13 |
14 | // a hook to highlight the selected container
15 | const containerRef = useRef('');
16 | // makes request to api for list of current running containers
17 | const getContainers = () => {
18 | const apiURL = process.env.API_URL || 'http://127.0.0.1:8081';
19 |
20 | fetch(`${apiURL}/api/v1/containers`)
21 | .then((response) => response.json())
22 | .then((data) => {
23 | updateContainerList(data);
24 | })
25 | .catch((err) => console.log(err));
26 | };
27 |
28 | // calls getContainers on mount
29 | useEffect(() => {
30 | getContainers();
31 | }, []);
32 |
33 | const timeRangeClicked = (str) => {
34 | setTimeFrame(str);
35 |
36 | const times = {
37 | '1m': 'Past 1 minute',
38 | '5m': 'Past 5 minutes',
39 | '15m': 'Past 15 minutes',
40 | '1h': 'Past 1 hour',
41 | '3h': 'Past 3 hours',
42 | '6h': 'Past 6 hours',
43 | '12h': 'Past 12 hours',
44 | '1d': 'Past 1 day',
45 | '7d': 'Past 7 days',
46 | };
47 |
48 | setTimeDisplay(times[str]);
49 | };
50 |
51 | // iterates through contaierList and returns an array of container buttons to render to sidebar
52 | const containerButtons = containerList.map((container) => (
53 |