nodebb-plugin-link-preview 1.0.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,17 @@
+# Link Preview Plugin for NodeBB
+
+This plugin adds in additional post parsing capability to NodeBB so that any external links are automatically expanded into an interactive box containing any available metadata (e.g. photo, title, description, etc.)
+
+The content shown in the box is powered by [Open Graph tags](https://ogp.me), and this plugin uses [link-preview-js](https://www.npmjs.com/package/link-preview-js) in the backend.
+
+## Installation
+
+This plugin comes bundled with NodeBB installs as of v3.1.0. If you wish to use it in older versions, or wish to install it manually, run either of the two commands below:
+
+    npm install nodebb-plugin-link-preview
+
+    yarn add nodebb-plugin-link-preview
+
+## Screenshots
+
+![A NodeBB post with an embedded link to a GitHub issue — it looks great!](./screenshots/embed.png)

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,9 @@
+'use strict';
+
+const Controllers = module.exports;
+
+Controllers.renderAdminPage = function (req, res/* , next */) {
+	res.render('admin/plugins/link-preview', {
+		title: 'Link Preview',
+	});
+};

package/library.js

@@ -0,0 +1,162 @@
+'use strict';
+
+const winston = require.main.require('winston');
+const dns = require('dns');
+
+const { getLinkPreview } = require('link-preview-js');
+
+const meta = require.main.require('./src/meta');
+const cache = require.main.require('./src/cache');
+
+const controllers = require('./lib/controllers');
+
+const routeHelpers = require.main.require('./src/routes/helpers');
+
+const plugin = {};
+
+plugin.init = async (params) => {
+	const { router /* , middleware , controllers */ } = params;
+
+	routeHelpers.setupAdminPageRoute(router, '/admin/plugins/link-preview', [], controllers.renderAdminPage);
+};
+
+plugin.applyDefaults = async (data) => {
+	const { plugin, values } = data;
+
+	if (plugin === 'link-preview') {
+		['embedHtml', 'embedImage', 'embedAudio', 'embedVideo'].forEach((prop) => {
+			if (!values.hasOwnProperty(prop)) {
+				values[prop] = 'on';
+			}
+		});
+	}
+
+	return data;
+};
+
+async function process(content) {
+	const anchorRegex = /<a\s+(?:[^>]*?\s+)?href=["']([^"']*)["'][^>]*>(.*?)<\/a>/g;
+	const matches = [];
+	let match;
+
+	const { embedHtml, embedImage, embedAudio, embedVideo } = await meta.settings.get('link-preview');
+	if (![embedHtml, embedImage, embedAudio, embedVideo].some(prop => prop === 'on')) {
+		return content;
+	}
+
+	// eslint-disable-next-line no-cond-assign
+	while ((match = anchorRegex.exec(content)) !== null) {
+		matches.push(match);
+	}
+
+	const previews = await Promise.all(matches.map(async (match) => {
+		const anchor = match[1];
+
+		const cached = cache.get(`link-preview:${anchor}`);
+		if (cached) {
+			return await render(cached);
+		}
+
+		// Generate the preview, but return false for now so as to not block response
+		getLinkPreview(anchor, {
+			resolveDNSHost: async url => new Promise((resolve, reject) => {
+				const { hostname } = new URL(url);
+				dns.lookup(hostname, (err, address) => {
+					if (err) {
+						reject(err);
+						return;
+					}
+
+					resolve(address); // if address resolves to localhost or '127.0.0.1' library will throw an error
+				});
+			}),
+			followRedirects: `manual`,
+			handleRedirects: (baseURL, forwardedURL) => {
+				const urlObj = new URL(baseURL);
+				const forwardedURLObj = new URL(forwardedURL);
+				if (
+					forwardedURLObj.hostname === urlObj.hostname ||
+					forwardedURLObj.hostname === `www.${urlObj.hostname}` ||
+					`www.${forwardedURLObj.hostname}` === urlObj.hostname
+				) {
+					return true;
+				}
+
+				return false;
+			},
+		}).then((preview) => {
+			const parsedUrl = new URL(anchor);
+			preview.hostname = parsedUrl.hostname;
+
+			winston.verbose(`[link-preview] ${preview.url} (${preview.contentType}, cache: miss)`);
+			cache.set(`link-preview:${anchor}`, preview);
+		}).catch(() => {
+			winston.verbose(`[link-preview] ${anchor} (invalid, cache: miss)`);
+			cache.set(`link-preview:${anchor}`, {
+				url: anchor,
+			});
+		});
+
+		return false;
+	}));
+
+	// Replace match with embed
+	previews.forEach((preview, idx) => {
+		if (preview) {
+			const match = matches[idx];
+			const { index } = match;
+			const { length } = match[0];
+
+			content = `${content.substring(0, index)}${preview}${content.substring(index + length)}`;
+		}
+	});
+
+	return content;
+}
+
+async function render(preview) {
+	const { app } = require.main.require('./src/webserver');
+	const { embedHtml, embedImage, embedAudio, embedVideo } = await meta.settings.get('link-preview');
+
+	winston.verbose(`[link-preview] ${preview.url} (${preview.contentType || 'invalid'}, cache: hit)`);
+
+	if (embedHtml && preview.contentType.startsWith('text/html')) {
+		return await app.renderAsync('partials/link-preview/html', preview);
+	}
+
+	if (embedImage && preview.contentType.startsWith('image/')) {
+		return await app.renderAsync('partials/link-preview/image', preview);
+	}
+
+	if (embedAudio && preview.contentType.startsWith('audio/')) {
+		return await app.renderAsync('partials/link-preview/audio', preview);
+	}
+
+	if (embedVideo && preview.contentType.startsWith('video/')) {
+		return await app.renderAsync('partials/link-preview/video', preview);
+	}
+
+	return false;
+}
+
+plugin.onParse = async (payload) => {
+	if (typeof payload === 'string') { // raw
+		payload = await process(payload);
+	} else if (payload && payload.postData && payload.postData.content) { // post
+		payload.postData.content = await process(payload.postData.content);
+	}
+
+	return payload;
+};
+
+plugin.addAdminNavigation = (header) => {
+	header.plugins.push({
+		route: '/plugins/link-preview',
+		icon: 'fa-tint',
+		name: 'Link Preview',
+	});
+
+	return header;
+};
+
+module.exports = plugin;

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "nodebb-plugin-link-preview",
+  "version": "1.0.0",
+  "description": "A starter kit for quickly creating NodeBB plugins",
+  "main": "library.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/nodebb/nodebb-plugin-link-preview"
+  },
+  "keywords": [
+    "nodebb",
+    "plugin",
+    "link-preview",
+    "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-link-preview/issues"
+  },
+  "readmeFilename": "README.md",
+  "nbbpm": {
+    "compatibility": "^3.0.0"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "17.6.5",
+    "@commitlint/config-angular": "17.6.5",
+    "eslint": "8.42.0",
+    "eslint-config-nodebb": "0.2.1",
+    "eslint-plugin-import": "2.27.5",
+    "husky": "8.0.3",
+    "lint-staged": "13.2.2"
+  },
+  "dependencies": {
+    "link-preview-js": "^3.0.4"
+  }
+}

package/plugin.json

@@ -0,0 +1,19 @@
+{
+	"id": "nodebb-plugin-link-preview",
+	"url": "https://github.com/NodeBB/nodebb-plugin-link-preview",
+	"library": "./library.js",
+	"hooks": [
+		{ "hook": "static:app.load", "method": "init" },
+		{ "hook": "filter:admin.header.build", "method": "addAdminNavigation" },
+		{ "hook": "filter:settings.get", "method": "applyDefaults" },
+		{ "hook": "filter:parse.post", "method": "onParse" },
+		{ "hook": "filter:parse.raw", "method": "onParse" }
+	],
+	"scss": [
+		"static/scss/link-preview.scss"
+	],
+	"modules": {
+		"../admin/plugins/link-preview.js": "./static/lib/admin.js"
+	},
+	"templates": "static/templates"
+}

package/renovate.json

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

package/static/lib/.eslintrc

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

package/static/lib/admin.js

@@ -0,0 +1,16 @@
+'use strict';
+
+define('admin/plugins/link-preview', ['settings'], function (settings) {
+	var ACP = {};
+
+	ACP.init = function () {
+		settings.load('link-preview', $('.link-preview-settings'));
+		$('#save').on('click', saveSettings);
+	};
+
+	function saveSettings() {
+		settings.save('link-preview', $('.link-preview-settings'));
+	}
+
+	return ACP;
+});

package/static/scss/link-preview.scss

@@ -0,0 +1,5 @@
+.link-preview {
+	.card-img-top {
+		object-fit: cover;
+	}
+}

package/static/templates/admin/plugins/link-preview.tpl

@@ -0,0 +1,36 @@
+<form role="form" class="link-preview-settings">
+	<div class="row mb-4">
+		<div class="col-sm-2 col-12 settings-header">Media Types</div>
+		<div class="col-sm-10 col-12">
+			<p>
+				If enabled, URLs of those types will be converted to preview boxes.
+			</p>
+
+			<div class="form-check form-switch mb-3">
+				<input type="checkbox" class="form-check-input" id="embedHtml" name="embedHtml">
+				<label for="embedHtml" class="form-check-label">Websites</label>
+			</div>
+
+			<div class="form-check form-switch mb-3">
+				<input type="checkbox" class="form-check-input" id="embedImage" name="embedImage">
+				<label for="embedImage" class="form-check-label">Images</label>
+			</div>
+
+			<div class="form-check form-switch mb-3">
+				<input type="checkbox" class="form-check-input" id="embedAudio" name="embedAudio">
+				<label for="embedAudio" class="form-check-label">Audio</label>
+			</div>
+
+			<div class="form-check form-switch mb-3">
+				<input type="checkbox" class="form-check-input" id="embedVideo" name="embedVideo">
+				<label for="embedVideo" class="form-check-label">Video</label>
+			</div>
+
+			<p class="help-text">
+				Please note that the "audio" and "video" formats only apply if the URL is a direct link to the audio/video file. Links to video hosting sites (e.g. YouTube) would fall under the "websites" category.
+			</p>
+		</div>
+	</div>
+</form>
+
+<!-- IMPORT admin/partials/save_button.tpl -->

package/static/templates/partials/link-preview/audio.tpl

@@ -0,0 +1 @@
+<audio controls src="{url}"></audio>

package/static/templates/partials/link-preview/html.tpl

@@ -0,0 +1,27 @@
+<div class="card col-6 position-relative link-preview">
+	{{{ if images.length }}}
+	{{{ each images }}}
+	{{{ if @first }}}
+	<img src="{@value}" class="card-img-top" style="max-height: 15rem;" />
+	{{{ end }}}
+	{{{ end }}}
+	{{{ end }}}
+	<div class="card-body">
+		<h5 class="card-title">
+			<a href="{url}">
+				{title}
+			</a>
+		</h5>
+		<p class="card-text line-clamp-3">{description}</p>
+	</div>
+	<a href="{url}" class="card-footer text-body-secondary small d-flex gap-2 align-items-center lh-2">
+		{{{ if favicons.length }}}
+		{{{ each favicons }}}
+		{{{ if @first }}}
+		<img src="{@value}" alt="favicon" style="max-width: 21px; max-height: 21px;" />
+		{{{ end }}}
+		{{{ end }}}
+		{{{ end }}}
+		<p class="d-inline-block text-truncate mb-0">{siteName} <span class="text-secondary">({hostname})</span></p>
+	</a>
+</div>

package/static/templates/partials/link-preview/image.tpl

@@ -0,0 +1 @@
+<img class="img-thumbnail" src="{url}" />

package/static/templates/partials/link-preview/video.tpl

@@ -0,0 +1,3 @@
+<video controls>
+	<source src="{url}" type="{contentType}">
+</video>

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-link-preview"
+ *     ]
+ * }
+ */
+
+'use strict';
+
+/* globals describe, it, before */
+
+const assert = require('assert');
+
+const db = require.main.require('./test/mocks/databasemock');
+
+describe('nodebb-plugin-link-preview', () => {
+	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);
+	});
+});