Merge pull request 'release-1.7.0' (#37) from release-1.7.0 into master

Reviewed-on: https://git.tech.wbsrv.ru/web-server/angie-console-light/pulls/37

Author: nfort

CHANGELOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## [v1.7.0](https://github.com/webserver-llc/angie-console-light/releases/tag/1.7.0) (2025-03-24)
+
+### Added
+- Display exact data volumes in bytes on mouse hover 
+- New "busy" state for upstream peers in the statistics API, indicating that a peer has reached the limit configured by the "max_conns" option.
+
+### Fixed
+- Fixed documentation links
+
 ## [v1.6.1](https://github.com/webserver-llc/angie-console-light/releases/tag/1.6.1) (2025-01-27)
 
 ### Fixed

locales/en/pages/index/aboutangie.json

@@ -2,5 +2,7 @@
   "Reload": "Reload",
   "Config Files": "Configuration",
   "Address": "Address",
-  "Last reload": "Last reload"
+  "Last reload": "Last reload",
+  "Version": "Version",
+  "Docs URL": "https://en.angie.software/angie/docs/"
 }

locales/en/upstreams/peer-tooltip.json

@@ -5,6 +5,7 @@
   "Checking": "Checking",
   "Up": "Up",
   "Down": "Down",
+  "Busy": "Busy",
   "Type: backup": "Type: backup",
   "Total downtime:": "Total downtime:",
   "Down since:": "Down since:"

locales/ru/pages/index/aboutangie.json

@@ -2,5 +2,7 @@
   "Reload": "Перезагрузок",
   "Config Files": "Конфигурация",
   "Address": "Адрес",
-  "Last reload": "Последняя перезагрузка"
+  "Last reload": "Последняя перезагрузка",
+  "Version": "Версия",
+  "Docs URL": "https://angie.software/angie/docs/"
 }

locales/ru/upstreams/peer-tooltip.json

@@ -5,6 +5,7 @@
   "Checking": "На проверке",
   "Up": "Активный",
   "Down": "Недоступный",
+  "Busy": "Занят",
   "Type: backup": "Тип: запасной",
   "Total downtime:": "Простаивает",
   "Down since:": "Не доступен с"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "angie-console-light",
-  "version": "1.6.1",
+  "version": "1.7.0",
   "description": "Angie Console Light",
   "main": "index.js",
   "scripts": {

src/calculators/factories.js

@@ -53,6 +53,7 @@ export function handlePeer(upstreamsKey, STATS, previousState, upstream, peer) {
 			break;
 		case 'unavail':
 		case 'unhealthy':
+		case 'busy':
 			STATS.servers.failed++;
 			STATS.failures.increment(upstream.name);
 			upstream.stats.failed++;

src/components/human-readable-bytes/__test__/readable-size.test.jsx

@@ -0,0 +1,73 @@
+/*
+*
+ * Copyright 2023-present, Web Server LLC
+ * Copyright 2017-present, Nginx, Inc.
+ * Copyright 2017-present, Ivan Poluyanov
+ * Copyright 2017-present, Igor Meleshchenko
+ * All rights reserved.
+ *
+ */
+import React from 'react';
+import { shallow } from 'enzyme';
+import HumanReadableBytes from '../human-readable-bytes';
+import tooltips from '#/tooltips';
+
+describe('<HumanReadableBytes />', () => {
+	it('renders value and tooltip when value > 1023', () => {
+		const initialValue = 2000;
+		let tooltipText;
+		jest
+			.spyOn(tooltips, 'useTooltip')
+			.mockClear()
+			.mockImplementation((value) => {
+				tooltipText = value;
+			});
+
+		const wrapper = shallow(<HumanReadableBytes value={initialValue} />);
+		const outputText = wrapper.find('span').text();
+
+		expect(outputText).toBe('1.95 KiB');
+		expect(tooltipText).toBe(`${initialValue} B`);
+	});
+
+	it('should render 0 when input value prop is not set', () => {
+		const wrapper = shallow(<HumanReadableBytes />);
+		const outputText = wrapper.find('span').text();
+
+		expect(outputText).toBe('0');
+	});
+
+	it('renders value with postfix', () => {
+		const initialValue = 2000;
+		const postfix = 'postfix';
+		let tooltipText;
+		jest
+			.spyOn(tooltips, 'useTooltip')
+			.mockClear()
+			.mockImplementation((input) => {
+				tooltipText = input;
+			});
+
+		const wrapper = shallow(<HumanReadableBytes value={initialValue} postfix={postfix} />);
+		const outputText = wrapper.find('span').text();
+
+		expect(outputText).toBe(`1.95 KiB${postfix}`);
+		expect(tooltipText).toBe(`${initialValue} B${postfix}`);
+	});
+
+	it('wont render tooltip when value <= 1023', () => {
+		const initialValue = 500;
+		let tooltipComponent;
+		jest
+			.spyOn(tooltips, 'useTooltip')
+			.mockClear()
+			.mockImplementation((component) => {
+				tooltipComponent = component;
+			});
+		const wrapper = shallow(<HumanReadableBytes value={initialValue} />);
+		const outputText = wrapper.find('span').text();
+
+		expect(outputText).toBe(`${initialValue} B`);
+		expect(tooltipComponent).toBe(undefined);
+	});
+});

src/components/human-readable-bytes/human-readable-bytes.jsx

@@ -0,0 +1,45 @@
+/*
+*
+ * Copyright 2023-present, Web Server LLC
+ * Copyright 2017-present, Nginx, Inc.
+ * Copyright 2017-present, Ivan Poluyanov
+ * Copyright 2017-present, Igor Meleshchenko
+ * All rights reserved.
+ *
+ */
+import React from 'react';
+import { withNamespaces } from 'react-i18next';
+import utils from '#/utils';
+import tooltips from '#/tooltips/index.jsx';
+
+class HumanReadableBytes extends React.Component {
+	formatReadableBytes(value, maxMeasurementUnit) {
+		const { t } = this.props;
+		return utils.formatReadableBytes(
+			value,
+			t(maxMeasurementUnit),
+			utils.translateReadableBytesUnits({ t })
+		);
+	}
+
+	render() {
+		const { value = 0, measurementUnit, postfix = '' } = this.props;
+
+		const readableValue = `${this.formatReadableBytes(value, measurementUnit)}${postfix}`;
+		const bytesValue = `${this.formatReadableBytes(value, 'B')}${postfix}`;
+
+		return (
+			(value > 1023) ?
+				(
+					<span {...tooltips.useTooltip(bytesValue, 'hint')}>
+						{readableValue}
+					</span>
+				) :
+				(
+					<span>{readableValue}</span>
+				)
+		);
+	}
+}
+
+export default withNamespaces('common')(HumanReadableBytes);

src/components/pages/__test__/streamzones.test.jsx

@@ -12,6 +12,7 @@ import { shallow } from 'enzyme';
 import { StreamZones } from '../streamzones.jsx';
 import styles from '../../table/style.css';
 import utils from '../../../utils';
+import HumanReadableBytes from '#/components/human-readable-bytes/human-readable-bytes';
 
 describe('<StreamZones Page />', () => {
 	describe('render()', () => {
@@ -40,7 +41,7 @@ describe('<StreamZones Page />', () => {
 		it('zones row', () => {
 			jest.spyOn(utils, 'formatReadableBytes').mockClear().mockImplementation(a => a);
 
-			const server_zones = new Map([
+			const server_zones = [
 				['test', {
 					processing: 100,
 					connections: 23,
@@ -66,7 +67,7 @@ describe('<StreamZones Page />', () => {
 					'4xxChanged': false,
 					'5xxChanged': true
 				}]
-			]);
+			];
 			const wrapper = shallow(<StreamZones data={{ server_zones }} />);
 			const rows = wrapper.find('tbody tr');
 			let cells = rows.at(0).find('td');
@@ -106,26 +107,24 @@ describe('<StreamZones Page />', () => {
 			expect(cell.prop('className')).toBe(styles.bdr);
 			// row 1, cell 8, text
 			expect(cell.text()).toBe('86');
+
+			const row = 0;
+			// row 1, cell 9
 			cell = cells.at(8);
-			// row 1, cell 9, className
 			expect(cell.prop('className')).toBe(styles.px60);
-			// row 1, cell 9, text
-			expect(cell.text()).toBe('333');
+			expect(cell.find(HumanReadableBytes).props().value).toBe(server_zones[row][1].sent_s);
+			// row 1, cell 10
 			cell = cells.at(9);
-			// row 1, cell 10, className
 			expect(cell.prop('className')).toBe(styles.px60);
-			// row 1, cell 10, text
-			expect(cell.text()).toBe('0');
+			expect(cell.find(HumanReadableBytes).props().value).toBe(server_zones[row][1].rcvd_s);
+			// row 1, cell 11
 			cell = cells.at(10);
-			// row 1, cell 11, className
 			expect(cell.prop('className')).toBe(styles.px60);
-			// row 1, cell 11, text
-			expect(cell.text()).toBe('950');
+			expect(cell.find(HumanReadableBytes).props().value).toBe(server_zones[row][1].sent);
+			// row 1, cell 12
 			cell = cells.at(11);
-			// row 1, cell 12, className
 			expect(cell.prop('className')).toBe(`${ styles.px60 } ${ styles.bdr }`);
-			// row 1, cell 12, text
-			expect(cell.text()).toBe('3');
+			expect(cell.find(HumanReadableBytes).props().value).toBe(server_zones[row][1].received);
 
 			// TODO: Add tests for SSL stat cells