nodebb-plugin-web-push 0.1.0

package/.eslintrc

@@ -0,0 +1,3 @@
+{
+	"extends": "nodebb"
+}

package/.gitattributes

@@ -0,0 +1,22 @@
+# Auto detect text files and perform LF normalization
+* text=auto
+
+# Custom for Visual Studio
+*.cs     diff=csharp
+*.sln    merge=union
+*.csproj merge=union
+*.vbproj merge=union
+*.fsproj merge=union
+*.dbproj merge=union
+
+# Standard to msysgit
+*.doc	 diff=astextplain
+*.DOC	 diff=astextplain
+*.docx diff=astextplain
+*.DOCX diff=astextplain
+*.dot  diff=astextplain
+*.DOT  diff=astextplain
+*.pdf  diff=astextplain
+*.PDF	 diff=astextplain
+*.rtf	 diff=astextplain
+*.RTF	 diff=astextplain

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 NodeBB Inc. <sales@nodebb.org>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,9 @@
+# Push Notifications (via Push API) Plugin for NodeBB
+
+This plugin adds push notification functionality for NodeBB via the in-browser [Push API](https://developer.mozilla.org/en-US/docs/Web/API/Push_API).
+
+Once installed, users are able to configure their push notification subscription settings from their account profile.
+
+## Installation
+
+    npm install nodebb-plugin-web-push

package/commitlint.config.js

@@ -0,0 +1,26 @@
+'use strict';
+
+module.exports = {
+	extends: ['@commitlint/config-angular'],
+	rules: {
+		'header-max-length': [1, 'always', 72],
+		'type-enum': [
+			2,
+			'always',
+			[
+				'breaking',
+				'build',
+				'chore',
+				'ci',
+				'docs',
+				'feat',
+				'fix',
+				'perf',
+				'refactor',
+				'revert',
+				'style',
+				'test',
+			],
+		],
+	},
+};

package/lib/controllers.js

@@ -0,0 +1,36 @@
+'use strict';
+
+const user = require.main.require('./src/user');
+
+const subscriptions = require('./subscriptions');
+
+const helpers = require.main.require('./src/controllers/helpers');
+
+const Controllers = module.exports;
+
+Controllers.renderSettings = async function (req, res) {
+	if (res.locals.uid !== req.user.uid) {
+		return helpers.notAllowed(req, res);
+	}
+
+	const [{ username, userslug }, count] = await Promise.all([
+		user.getUserFields(res.locals.uid, ['username', 'userslug']),
+		subscriptions.count(req.uid),
+	]);
+	console.log(count);
+
+	const payload = {
+		...res.locals.userData,
+		title: '[[web-push:profile.label]]',
+		breadcrumbs: helpers.buildBreadcrumbs([{ text: username, url: `/user/${userslug}` }, { text: '[[web-push:profile.label]]' }]),
+		count,
+	};
+
+	res.render('account/web-push', payload);
+};
+
+Controllers.renderAdminPage = function (req, res/* , next */) {
+	res.render('admin/plugins/web-push', {
+		title: 'Quick Start',
+	});
+};

package/lib/subscriptions.js

@@ -0,0 +1,25 @@
+'use strict';
+
+const db = require.main.require('./src/database');
+
+const Subscriptions = module.exports;
+
+Subscriptions.count = async uid => await db.sortedSetCard(`uid:${uid}:web-push:subscriptions`);
+
+Subscriptions.list = async (uids) => {
+	const subscriptions = await db.getSortedSetsMembers(uids.map(uid => `uid:${uid}:web-push:subscriptions`));
+	const response = new Map();
+	subscriptions.forEach((subscriptions, idx) => {
+		response.set(uids[idx], new Set(subscriptions.map(sub => JSON.parse(sub))));
+	});
+
+	return response;
+};
+
+Subscriptions.add = async (uid, subscription) => {
+	await db.sortedSetAdd(`uid:${uid}:web-push:subscriptions`, Date.now(), JSON.stringify(subscription));
+};
+
+Subscriptions.remove = async (uid, subscription) => {
+	await db.sortedSetRemove(`uid:${uid}:web-push:subscriptions`, JSON.stringify(subscription));
+};

package/library.js

@@ -0,0 +1,165 @@
+'use strict';
+
+const nconf = require.main.require('nconf');
+const winston = require.main.require('winston');
+const webPush = require('web-push');
+const validator = require('validator');
+
+const user = require.main.require('./src/user');
+const meta = require.main.require('./src/meta');
+const utils = require.main.require('./src/utils');
+const translator = require.main.require('./src/translator');
+
+const controllers = require('./lib/controllers');
+const subscriptions = require('./lib/subscriptions');
+
+const routeHelpers = require.main.require('./src/routes/helpers');
+
+const plugin = {};
+
+plugin.init = async (params) => {
+	const { router, middleware/* , controllers */ } = params;
+	const accountMiddlewares = [
+		middleware.exposeUid,
+		middleware.ensureLoggedIn,
+		middleware.canViewUsers,
+		middleware.checkAccountPermissions,
+		middleware.buildAccountData,
+	];
+
+	await assertVapidConfiguration();
+
+	routeHelpers.setupPageRoute(router, '/user/:userslug/web-push', accountMiddlewares, controllers.renderSettings);
+
+	routeHelpers.setupAdminPageRoute(router, '/admin/plugins/web-push', controllers.renderAdminPage);
+};
+
+plugin.appendConfig = async (config) => {
+	const { publicKey } = await meta.settings.get('web-push');
+	config['web-push'] = {
+		vapidKey: publicKey,
+	};
+
+	return config;
+};
+
+async function assertVapidConfiguration() {
+	let { publicKey, privateKey } = await meta.settings.get('web-push');
+	if (!publicKey || !privateKey) {
+		winston.warn('[plugins/web-push] VAPID key pair not found or invalid, regenerating.');
+		({ publicKey, privateKey } = webPush.generateVAPIDKeys());
+		await meta.settings.set('web-push', { publicKey, privateKey });
+	} else {
+		winston.info('[plugins/web-push] VAPID keys OK.');
+	}
+
+	webPush.setVapidDetails(
+		nconf.get('url'),
+		publicKey,
+		privateKey
+	);
+}
+
+plugin.addRoutes = async ({ router, middleware, helpers }) => {
+	const middlewares = [
+		middleware.ensureLoggedIn,
+		// middleware.admin.checkPrivileges,
+	];
+
+	routeHelpers.setupApiRoute(router, 'post', '/web-push/subscription', middlewares, async (req, res) => {
+		if (!req.uid) {
+			return helpers.formatApiResponse(204, res);
+		}
+
+		const { subscription } = req.body;
+		await subscriptions.add(req.uid, subscription);
+		helpers.formatApiResponse(200, res);
+	});
+
+	routeHelpers.setupApiRoute(router, 'delete', '/web-push/subscription', middlewares, async (req, res) => {
+		if (!req.uid) {
+			return helpers.notAllowed(req, res);
+		}
+
+		const { subscription } = req.body;
+		await subscriptions.remove(req.uid, subscription);
+		helpers.formatApiResponse(200, res);
+	});
+};
+
+plugin.addAdminNavigation = (header) => {
+	header.plugins.push({
+		route: '/plugins/web-push',
+		icon: 'fa-tint',
+		name: 'Push Notifications (via Push API)',
+	});
+
+	return header;
+};
+
+plugin.onNotificationPush = async ({ notification, uidsNotified: uids }) => {
+	const subs = await subscriptions.list(uids);
+	uids = uids.filter(uid => subs.get(uid).size);
+	const userSettings = await user.getMultipleUserSettings(uids);
+
+	let payloads = await Promise.all(uids.map(async (uid, idx) => {
+		const payload = await constructPayload(notification, userSettings[idx].userLang);
+		return [uid, payload];
+	}));
+	payloads = new Map(payloads);
+
+	payloads.forEach((payload, uid) => {
+		const targets = subs.get(uid);
+		targets.forEach(async (subscription) => {
+			try {
+				await webPush.sendNotification(subscription, JSON.stringify(payload));
+			} catch (e) {
+				// Errored — remove subscription from user
+				subscriptions.remove(uid, subscription);
+			}
+		});
+	});
+};
+
+plugin.addProfileItem = async (data) => {
+	const title = await translator.translate('[[web-push:profile.label]]');
+	data.links.push({
+		id: 'web-push',
+		route: 'web-push',
+		icon: 'fa-bell-o',
+		name: title,
+		visibility: {
+			self: true,
+			other: false,
+			moderator: false,
+			globalMod: false,
+			admin: false,
+		},
+	});
+
+	return data;
+};
+
+async function constructPayload({ bodyShort, bodyLong, path }, language) {
+	if (!language) {
+		language = meta.config.defaultLang || 'en-GB';
+	}
+
+	let [title, body] = await translator.translateKeys([bodyShort, bodyLong], language);
+	([title, body] = [title, body].map(str => validator.unescape(utils.stripHTMLTags(str))));
+	const url = `${nconf.get('url')}${path}`;
+
+	// Handle empty bodyLong
+	if (!bodyLong) {
+		body = title;
+		title = meta.config.title || 'NodeBB';
+	}
+
+	return {
+		title,
+		body,
+		data: { url },
+	};
+}
+
+module.exports = plugin;

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "nodebb-plugin-web-push",
+  "version": "0.1.0",
+  "description": "A starter kit for quickly creating NodeBB plugins",
+  "main": "library.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/nodebb/nodebb-plugin-web-push"
+  },
+  "keywords": [
+    "nodebb",
+    "plugin",
+    "web-push",
+    "shell"
+  ],
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged",
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
+  "lint-staged": {
+    "*.js": [
+      "eslint --fix",
+      "git add"
+    ]
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/nodebb/nodebb-plugin-web-push/issues"
+  },
+  "readmeFilename": "README.md",
+  "nbbpm": {
+    "compatibility": "^4.0.0"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "19.4.1",
+    "@commitlint/config-angular": "19.4.1",
+    "eslint": "8.x",
+    "eslint-config-nodebb": "0.2.1",
+    "eslint-plugin-import": "2.x",
+    "husky": "9.1.5",
+    "lint-staged": "15.2.10"
+  },
+  "dependencies": {
+    "validator": "^13.12.0",
+    "web-push": "^3.6.7"
+  }
+}

package/plugin.json

@@ -0,0 +1,22 @@
+{
+	"id": "nodebb-plugin-web-push",
+	"url": "https://github.com/NodeBB/nodebb-plugin-web-push",
+	"library": "./library.js",
+	"hooks": [
+		{ "hook": "static:app.load", "method": "init" },
+		{ "hook": "static:api.routes", "method": "addRoutes" },
+		{ "hook": "filter:admin.header.build", "method": "addAdminNavigation" },
+		{ "hook": "filter:config.get", "method": "appendConfig" },
+		{ "hook": "action:notification.pushed", "method": "onNotificationPush" },
+		{ "hook": "filter:user.profileMenu", "method": "addProfileItem" }
+	],
+	"languages": "public/languages",
+	"scripts": [
+		"public/lib/main.js"
+	],
+	"modules": {
+		"../client/account/web-push.js": "./public/lib/settings.js",
+		"../admin/plugins/web-push.js": "./public/lib/admin.js"
+	},
+	"templates": "templates"
+}

package/public/languages/en-GB/web-push.json

@@ -0,0 +1,7 @@
+{
+	"profile.label": "Push Notifications",
+	"profile.introduction": "In addition to in-application and email notifications, you may opt-in to receive push notifications as well. This will allow you to be notified even if the app is not open on your device.",
+	"profile.option": "Enable push notifications on this device",
+	"profile.devices": "Currently notifying <strong>%1</strong> device(s).",
+	"profile.permissionBlocked": "Your device is currently disallowing notifications from this site. Please grant the notification permission to continue."
+}

package/public/lib/.eslintrc

@@ -0,0 +1,3 @@
+{
+	"extends": "nodebb/public"
+}

package/public/lib/admin.js

@@ -0,0 +1,21 @@
+'use strict';
+
+/*
+	This file is located in the "modules" block of plugin.json
+	It is only loaded when the user navigates to /admin/plugins/web-push page
+	It is not bundled into the min file that is served on the first load of the page.
+*/
+
+import { save, load } from 'settings';
+
+export function init() {
+	handleSettingsForm();
+};
+
+function handleSettingsForm() {
+	load('web-push', $('.web-push-settings'));
+
+	$('#save').on('click', () => {
+		save('web-push', $('.web-push-settings')); // pass in a function in the 3rd parameter to override the default success/failure handler
+	});
+}

package/public/lib/main.js

@@ -0,0 +1,9 @@
+'use strict';
+
+(async () => {
+	const [hooks, api] = await app.require(['hooks', 'api']);
+
+	hooks.on('action:app.load', async () => {
+		// ...
+	});
+})();

package/public/lib/settings.js

@@ -0,0 +1,90 @@
+'use strict';
+
+import { post, del } from 'api';
+import { success } from 'alerts';
+
+// eslint-disable-next-line import/prefer-default-export
+export async function init() {
+	const containerEl = document.querySelector('.account');
+	const registration = await navigator.serviceWorker.ready;
+	let subscription = await registration.pushManager.getSubscription();
+	const convertedVapidKey = urlBase64ToUint8Array(config['web-push'].vapidKey);
+
+	containerEl.addEventListener('click', async (e) => {
+		const subselector = e.target.closest('[data-action]');
+		if (subselector) {
+			const action = e.target.getAttribute('data-action');
+
+			switch (action) {
+				// case 'test': {
+				// 	await post('/plugins/ntfy/test');
+				// 	success('[[ntfy:toast.test_success]]');
+				// 	break;
+				// }
+
+				case 'toggle': {
+					const countEl = document.querySelector('#deviceCount strong');
+					if (!subscription) {
+						try {
+							subscription = await registration.pushManager.subscribe({
+								userVisibleOnly: true,
+								applicationServerKey: convertedVapidKey,
+							});
+
+							await post('/plugins/web-push/subscription', { subscription: subscription.toJSON() });
+
+							// Update count
+							let count = parseInt(countEl.textContent, 10);
+							count += 1;
+							countEl.innerText = count;
+						} catch (e) {
+							subselector.checked = false;
+						}
+					} else {
+						await subscription.unsubscribe();
+						await del('/plugins/web-push/subscription', { subscription: subscription.toJSON() });
+						let count = parseInt(countEl.textContent, 10);
+						count -= 1;
+						countEl.innerText = count;
+						subscription = null;
+					}
+
+					break;
+				}
+			}
+		}
+	});
+
+	const enabledEl = document.getElementById('enabled');
+	if (subscription) {
+		enabledEl.checked = true;
+	}
+
+	// Show permission warning if applicable
+	const state = await registration.pushManager.permissionState({
+		userVisibleOnly: true,
+		applicationServerKey: convertedVapidKey,
+	});
+	if (state === 'denied') {
+		const warningEl = document.getElementById('permission-warning');
+		warningEl.classList.remove('d-none');
+	}
+}
+
+// This function is needed because Chrome doesn't accept a base64 encoded string
+// as value for applicationServerKey in pushManager.subscribe yet
+// https://bugs.chromium.org/p/chromium/issues/detail?id=802280
+function urlBase64ToUint8Array(base64String) {
+	var padding = '='.repeat((4 - (base64String.length % 4)) % 4);
+	var base64 = (base64String + padding)
+		.replace(/\-/g, '+')
+		.replace(/_/g, '/');
+
+	var rawData = window.atob(base64);
+	var outputArray = new Uint8Array(rawData.length);
+
+	for (var i = 0; i < rawData.length; ++i) {
+		outputArray[i] = rawData.charCodeAt(i);
+	}
+	return outputArray;
+}

package/renovate.json

@@ -0,0 +1,5 @@
+{
+  "extends": [
+    "config:base"
+  ]
+}

package/static/samplefile.html

@@ -0,0 +1,5 @@
+<h1>Hello!</h1>
+
+<p>This file is served by nodebb at domain.com/assets/plugins/nodebb-plugin-web-push/static/samplefile.html</p>
+
+Check plugin.json for the "staticDirs" property if you want to change the path.

package/templates/account/web-push.tpl

@@ -0,0 +1,17 @@
+<!-- IMPORT partials/account/header.tpl -->
+
+<h3 class="fw-semibold fs-5">[[web-push:profile.label]]</h3>
+
+<p>[[web-push:profile.introduction]]</p>
+
+<div class="alert alert-warning d-none" id="permission-warning">[[web-push:profile.permissionBlocked]]</div>
+
+<form role="form">
+	<div class="form-check form-switch">
+		<input type="checkbox" class="form-check-input" id="enabled" name="enabled" autocomplete="off" data-action="toggle">
+		<label for="enabled" class="form-check-label">[[web-push:profile.option]]</label>
+		<p class="form-text" id="deviceCount">[[web-push:profile.devices, {count}]]</p>
+	</div>
+</form>
+
+<!-- IMPORT partials/account/footer.tpl -->

package/templates/admin/plugins/web-push.tpl

@@ -0,0 +1,33 @@
+<div class="acp-page-container">
+	<!-- IMPORT admin/partials/settings/header.tpl -->
+
+	<div class="row m-0">
+		<div id="spy-container" class="col-12 col-md-8 px-0 mb-4" tabindex="0">
+			<form role="form" class="web-push-settings">
+				<div class="mb-4">
+					<h5 class="fw-bold tracking-tight settings-header">General</h5>
+
+					<p class="lead">
+						Adjust these settings. You can then retrieve these settings in code via:
+						<br/><code>await meta.settings.get('web-push');</code>
+					</p>
+					<div class="mb-3">
+						<label class="form-label" for="setting-1">Setting 1</label>
+						<input type="text" id="setting-1" name="setting-1" title="Setting 1" class="form-control" placeholder="Setting 1">
+					</div>
+					<div class="mb-3">
+						<label class="form-label" for="setting-2">Setting 2</label>
+						<input type="text" id="setting-2" name="setting-2" title="Setting 2" class="form-control" placeholder="Setting 2">
+					</div>
+
+					<div class="form-check form-switch">
+						<input type="checkbox" class="form-check-input" id="setting-3" name="setting-3">
+						<label for="setting-3" class="form-check-label">Setting 3</label>
+					</div>
+				</div>
+			</form>
+		</div>
+
+		<!-- IMPORT admin/partials/settings/toc.tpl -->
+	</div>
+</div>

package/test/.eslintrc

@@ -0,0 +1,9 @@
+{
+	"env": {
+		"mocha": true
+	},
+	"rules": {
+		"no-unused-vars": "off"
+	}
+}
+

package/test/index.js

@@ -0,0 +1,41 @@
+/**
+ * You can run these tests by executing `npx mocha test/plugins-installed.js`
+ * from the NodeBB root folder. The regular test runner will also run these
+ * tests.
+ *
+ * Keep in mind tests do not activate all plugins, so if you are testing
+ * hook listeners, socket.io, or mounted routes, you will need to add your
+ * plugin to `config.json`, e.g.
+ *
+ * {
+ *     "test_plugins": [
+ *         "nodebb-plugin-web-push"
+ *     ]
+ * }
+ */
+
+'use strict';
+
+/* globals describe, it, before */
+
+const assert = require('assert');
+
+const db = require.main.require('./test/mocks/databasemock');
+
+describe('nodebb-plugin-web-push', () => {
+	before(() => {
+		// Prepare for tests here
+	});
+
+	it('should pass', (done) => {
+		const actual = 'value';
+		const expected = 'value';
+		assert.strictEqual(actual, expected);
+		done();
+	});
+
+	it('should load config object', async () => {	// Tests can be async functions too
+		const config = await db.getObject('config');
+		assert(config);
+	});
+});