feat: basic federation analytics with filtering by host

public/language/en-GB/admin/menu.json

@@ -55,6 +55,7 @@
 	"federation/relays": "Relays",
 	"federation/pruning": "Storage",
 	"federation/safety": "Trust & Safety",
+	"federation/analytics": "Analytics",
 
 	"section-appearance": "Appearance",
 	"appearance/themes": "Themes",

public/language/en-GB/admin/settings/activitypub.json

@@ -63,5 +63,8 @@
 	"content.summary-limit-help": "When content is federated out that exceeds this character count, a <code>summary</code> is generated, comprising of all complete sentences prior to this limit. (Default: 500)",
 	"content.break-string": "Note/Article Delimiter",
 	"content.break-string-help": "This delimiter can be manually inserted by power users when composing new topics. It instructs NodeBB to use content up until that point as part of the <code>summary</code>. If this string is not used, then the character count fallback applies. (Default: <code>[...]</code>)",
-	"content.world-default-cid": "Default category ID for &quot;World&quot; page composer"
+	"content.world-default-cid": "Default category ID for &quot;World&quot; page composer",
+
+	"analytics.intro": "From this page you can view the state of your instance's federation with other servers",
+	"analytics.activities": "Received Activities"
 }

public/src/admin/federation/analytics.js

@@ -0,0 +1,158 @@
+import {
+	Chart,
+	LineController,
+	CategoryScale,
+	LinearScale,
+	LineElement,
+	PointElement,
+	Tooltip,
+	Filler,
+} from 'chart.js';
+
+import { get } from 'api';
+
+Chart.register(
+	LineController,
+	CategoryScale,
+	LinearScale,
+	LineElement,
+	PointElement,
+	Tooltip,
+	Filler
+);
+
+export function init() {
+	const charts = initializeCharts();
+
+	const hostFilterEl = document.getElementById('hostFilter');
+	if (hostFilterEl) {
+		hostFilterEl.addEventListener('change', async function () {
+			const { activities } = await get(`/api${ajaxify.data.url}?host=${this.value}`);
+			const chart = charts.get('activities');
+			chart.data.datasets[0].data = activities;
+			chart.update();
+		});
+	}
+}
+
+function initializeCharts() {
+	const activitiesCanvas = document.getElementById('activities');
+	// const dailyCanvas = document.getElementById('pageviews:daily');
+	// const topicsCanvas = document.getElementById('topics:daily');
+	// const postsCanvas = document.getElementById('posts:daily');
+	const hourlyLabels = utils.getHoursArray().map(function (text, idx) {
+		return idx % 3 ? '' : text;
+	});
+	// const dailyLabels = utils.getDaysArray().map(function (text, idx) {
+	// 	return idx % 3 ? '' : text;
+	// });
+
+	if (utils.isMobile()) {
+		Chart.defaults.plugins.tooltip.enabled = false;
+	}
+
+	const commonDataSetOpts = {
+		label: '',
+		fill: true,
+		tension: 0.25,
+		pointHoverBackgroundColor: '#fff',
+		pointBorderColor: '#fff',
+	};
+
+	const data = {
+		'activities': {
+			labels: hourlyLabels,
+			datasets: [
+				{
+					...commonDataSetOpts,
+					backgroundColor: 'rgba(186,139,175,0.2)',
+					borderColor: 'rgba(186,139,175,1)',
+					pointBackgroundColor: 'rgba(186,139,175,1)',
+					pointHoverBorderColor: 'rgba(186,139,175,1)',
+					data: ajaxify.data.activities,
+				},
+			],
+		},
+		// 'pageviews:daily': {
+		// 	labels: dailyLabels,
+		// 	datasets: [
+		// 		{
+		// 			...commonDataSetOpts,
+		// 			backgroundColor: 'rgba(151,187,205,0.2)',
+		// 			borderColor: 'rgba(151,187,205,1)',
+		// 			pointBackgroundColor: 'rgba(151,187,205,1)',
+		// 			pointHoverBorderColor: 'rgba(151,187,205,1)',
+		// 			data: ajaxify.data.analytics['pageviews:daily'],
+		// 		},
+		// 	],
+		// },
+		// 'topics:daily': {
+		// 	labels: dailyLabels.slice(-7),
+		// 	datasets: [
+		// 		{
+		// 			...commonDataSetOpts,
+		// 			backgroundColor: 'rgba(171,70,66,0.2)',
+		// 			borderColor: 'rgba(171,70,66,1)',
+		// 			pointBackgroundColor: 'rgba(171,70,66,1)',
+		// 			pointHoverBorderColor: 'rgba(171,70,66,1)',
+		// 			data: ajaxify.data.analytics['topics:daily'],
+		// 		},
+		// 	],
+		// },
+		// 'posts:daily': {
+		// 	labels: dailyLabels.slice(-7),
+		// 	datasets: [
+		// 		{
+		// 			...commonDataSetOpts,
+		// 			backgroundColor: 'rgba(161,181,108,0.2)',
+		// 			borderColor: 'rgba(161,181,108,1)',
+		// 			pointBackgroundColor: 'rgba(161,181,108,1)',
+		// 			pointHoverBorderColor: 'rgba(161,181,108,1)',
+		// 			data: ajaxify.data.analytics['posts:daily'],
+		// 		},
+		// 	],
+		// },
+	};
+
+	activitiesCanvas.width = $(activitiesCanvas).parent().width();
+	// dailyCanvas.width = $(dailyCanvas).parent().width();
+	// topicsCanvas.width = $(topicsCanvas).parent().width();
+	// postsCanvas.width = $(postsCanvas).parent().width();
+
+	const chartOpts = {
+		responsive: true,
+		animation: false,
+		scales: {
+			y: {
+				beginAtZero: true,
+			},
+		},
+	};
+
+	return new Map([
+		['activities', new Chart(activitiesCanvas.getContext('2d'), {
+			type: 'line',
+			data: data.activities,
+			options: chartOpts,
+		})],
+	]);
+
+	// new Chart(dailyCanvas.getContext('2d'), {
+	// 	type: 'line',
+	// 	data: data['pageviews:daily'],
+	// 	options: chartOpts,
+	// });
+
+	// new Chart(topicsCanvas.getContext('2d'), {
+	// 	type: 'line',
+	// 	data: data['topics:daily'],
+	// 	options: chartOpts,
+	// });
+
+	// new Chart(postsCanvas.getContext('2d'), {
+	// 	type: 'line',
+	// 	data: data['posts:daily'],
+	// 	options: chartOpts,
+	// });
+}
+

src/activitypub/instances.js

@@ -12,6 +12,8 @@ Instances.log = async (domain) => {
 
 Instances.getCount = async () => db.sortedSetCard('instances:lastSeen');
 
+Instances.list = async () => db.getSortedSetMembers('instances:lastSeen');
+
 Instances.isAllowed = async (domain) => {
 	const allowed = await activitypub.blocklists.check(domain);
 	let { activitypubFilter: type, activitypubFilterList: list } = meta.config;

src/controllers/admin/federation.js

@@ -1,6 +1,7 @@
 'use strict';
 
 const activitypub = require('../../activitypub');
+const analytics = require('../../analytics');
 
 const federationController = module.exports;
 
@@ -52,3 +53,19 @@ federationController.safety = async function (req, res) {
 		instanceCount,
 	});
 };
+
+federationController.analytics = async function (req, res) {
+	const instances = await activitypub.instances.list();
+	let { host } = req.query;
+	if (!instances.includes(host)) {
+		host = undefined;
+	}
+	const set = host ? `activities:byHost:${host}` : 'activities';
+	const activities = await analytics.getHourlyStatsForSet(set, Date.now(), 24);
+
+	res.render('admin/federation/analytics', {
+		title: '[[admin/menu:federation/analytics]]',
+		instances,
+		activities,
+	});
+};

src/routes/admin.js

@@ -57,6 +57,7 @@ module.exports = function (app, name, middleware, controllers) {
 	helpers.setupAdminPageRoute(app, `/${name}/federation/relays`, middlewares, controllers.admin.federation.relays);
 	helpers.setupAdminPageRoute(app, `/${name}/federation/pruning`, middlewares, controllers.admin.federation.pruning);
 	helpers.setupAdminPageRoute(app, `/${name}/federation/safety`, middlewares, controllers.admin.federation.safety);
+	helpers.setupAdminPageRoute(app, `/${name}/federation/analytics`, middlewares, controllers.admin.federation.analytics);
 
 	helpers.setupAdminPageRoute(app, `/${name}/appearance/themes`, middlewares, controllers.admin.appearance.themes);
 	helpers.setupAdminPageRoute(app, `/${name}/appearance/skins`, middlewares, controllers.admin.appearance.skins);

src/views/admin/federation/analytics.tpl

@@ -0,0 +1,33 @@
+<div class="acp-page-container">
+	<!-- IMPORT admin/partials/settings/header.tpl -->
+
+	<div class="row settings m-0">
+		<div id="spy-container" class="col-12 col-md-8 px-0 mb-4" tabindex="0">
+			<div id="relays" class="mb-4">
+				<p class="lead">[[admin/settings/activitypub:analytics.intro]]</p>
+			</div>
+
+			<div class="mb-4">
+				<label class="fs-5 fw-bold tracking-tight settings-header mb-3">[[admin/settings/activitypub:analytics.activities]]</label>
+				<div class="mb-3">
+					<select class="form-select" autocomplete="off" id="hostFilter">
+						<option value="">All instances</option>
+						{{{ each instances }}}
+						<option value="{@value}">{@value}</option>
+						{{{ end }}}
+					</select>
+				</div>
+
+				<div class="card">
+					<div class="card-body">
+						<div class="position-relative" style="aspect-ratio: 2;">
+							<canvas id="activities" height="250"></canvas>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<!-- IMPORT admin/partials/settings/toc.tpl -->
+	</div>
+</div>

src/views/admin/partials/navigation.tpl

@@ -109,6 +109,7 @@
 				<a class="btn btn-ghost btn-sm text-start" id="federation-relays" href="{relative_path}/admin/federation/relays">[[admin/menu:federation/relays]]</a>
 				<a class="btn btn-ghost btn-sm text-start" id="federation-pruning" href="{relative_path}/admin/federation/pruning">[[admin/menu:federation/pruning]]</a>
 				<a class="btn btn-ghost btn-sm text-start" id="federation-safety" href="{relative_path}/admin/federation/safety">[[admin/menu:federation/safety]]</a>
+				<a class="btn btn-ghost btn-sm text-start" id="federation-analytics" href="{relative_path}/admin/federation/analytics">[[admin/menu:federation/analytics]]</a>
 			</div>
 		</div>
 	</div>