luci-proto-wireguard: adapt to use uqr

If for some reason luci-lib-uqr is absent, the GUI shows that the proto handler needs installing (since it now has a dep which is missing). Suitable action is to install the lib or remove/install wireguard again. Signed-off-by: Paul Donald <[email protected]>
freifunk-berlin · Jun 27, 2024 · 74f366a · 74f366a
1 parent b2e7441
commit 74f366a
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 28 deletions.
diff --git a/protocols/luci-proto-wireguard/Makefile b/protocols/luci-proto-wireguard/Makefile
@@ -7,7 +7,7 @@
 include $(TOPDIR)/rules.mk
 
 LUCI_TITLE:=Support for WireGuard VPN
-LUCI_DEPENDS:=+wireguard-tools +ucode
+LUCI_DEPENDS:=+wireguard-tools +ucode +luci-lib-uqr
 LUCI_PKGARCH:=all
 
 PKG_LICENSE:=Apache-2.0

diff --git a/protocols/luci-proto-wireguard/htdocs/luci-static/resources/protocol/wireguard.js b/protocols/luci-proto-wireguard/htdocs/luci-static/resources/protocol/wireguard.js
@@ -7,6 +7,7 @@
 'require form';
 'require network';
 'require validation';
+'require uqr';
 
 var generateKey = rpc.declare({
 	object: 'luci.wireguard',
@@ -64,28 +65,16 @@ function generateDescription(name, texts) {
 	]);
 }
 
-function invokeQREncode(data, code) {
-	return fs.exec_direct('/usr/bin/qrencode', [
-		'--inline', '--8bit', '--type=SVG',
-		'--output=-', '--', data
-	]).then(function(svg) {
-		code.style.opacity = '';
-		dom.content(code, Object.assign(E(svg), { style: 'width:100%;height:auto' }));
-	}).catch(function(error) {
-		code.style.opacity = '';
-
-		if (L.isObject(error) && error.name == 'NotFoundError') {
-			dom.content(code, [
-				Object.assign(E(qrIcon), { style: 'width:32px;height:32px;opacity:.2' }),
-				E('p', _('The <em>qrencode</em> package is required for generating an QR code image of the configuration.'))
-			]);
-		}
-		else {
-			dom.content(code, [
-				_('Unable to generate QR code: %s').format(L.isObject(error) ? error.message : error)
-			]);
-		}
-	});
+function buildSVGQRCode(data, code) {
+	// pixel size larger than 4 clips right and bottom edges of complex configs
+	const options = {
+		pixelSize: 4,
+		whiteColor: 'white',
+		blackColor: 'black'
+	};
+	const svg = uqr.renderSVG(data, options);
+	code.style.opacity = '';
+	dom.content(code, Object.assign(E(svg), { style: 'width:100%;height:auto' }));
 }
 
 var cbiKeyPairGenerate = form.DummyValue.extend({
@@ -779,7 +768,7 @@ return network.registerProtocol('wireguard', {
 						conf.firstChild.data = configGenerator(endpoint.getValue(), ips.getValue(), eips.getValue(), dns.getValue());
 						code.style.opacity = '.5';
 
-						invokeQREncode(conf.firstChild.data, code);
+						buildSVGQRCode(conf.firstChild.data, code);
 					}
 				};
 
@@ -833,7 +822,7 @@ return network.registerProtocol('wireguard', {
 						}, [ peer_config ])
 					]);
 
-					invokeQREncode(peer_config, node.firstChild);
+					buildSVGQRCode(peer_config, node.firstChild);
 
 					return node;
 				};

diff --git a/protocols/luci-proto-wireguard/root/usr/share/rpcd/acl.d/luci-wireguard.json b/protocols/luci-proto-wireguard/root/usr/share/rpcd/acl.d/luci-wireguard.json
@@ -2,9 +2,6 @@
 	"luci-proto-wireguard": {
 		"description": "Grant access to LuCI Wireguard procedures",
 		"read": {
-			"file": {
-				"/usr/bin/qrencode --inline --8bit --type=SVG --output=- -- *": [ "exec" ]
-			},
 			"ubus": {
 				"luci.wireguard": [
 					"getWgInstances"