feat: closes #11747, add pagination to tokens page

src/api/utils.js

@@ -10,12 +10,14 @@ const utils = module.exports;
 // internal token management utilities only
 utils.tokens = {};
 
-utils.tokens.list = async () => {
+utils.tokens.list = async (start = 0, stop = -1) => {
 	// Validation handled at higher level
-	const tokens = await db.getSortedSetRange(`tokens:createtime`, 0, -1);
+	const tokens = await db.getSortedSetRange(`tokens:createtime`, start, stop);
 	return await utils.tokens.get(tokens);
 };
 
+utils.tokens.count = async () => await db.sortedSetCard('tokens:createtime');
+
 utils.tokens.get = async (tokens) => {
 	// Validation handled at higher level
 	if (!tokens) {

src/controllers/admin/settings.js

@@ -10,7 +10,7 @@ const languages = require('../../languages');
 const navigationAdmin = require('../../navigation/admin');
 const social = require('../../social');
 const api = require('../../api');
-
+const pagination = require('../../pagination');
 const helpers = require('../helpers');
 const translator = require('../../translator');
 
@@ -104,9 +104,18 @@ settingsController.navigation = async function (req, res) {
 };
 
 settingsController.api = async (req, res) => {
-	const tokens = await api.utils.tokens.list();
+	const page = parseInt(req.query.page, 10) || 1;
+	const resultsPerPage = 50;
+	const start = Math.max(0, page - 1) * resultsPerPage;
+	const stop = start + resultsPerPage - 1;
+	const [tokens, count] = await Promise.all([
+		api.utils.tokens.list(start, stop),
+		api.utils.tokens.count(),
+	]);
+	const pageCount = Math.ceil(count / resultsPerPage);
 	res.render('admin/settings/api', {
 		title: '[[admin/menu:settings/api]]',
 		tokens,
+		pagination: pagination.create(page, pageCount, req.query),
 	});
 };

src/views/admin/settings/api.tpl

@@ -32,8 +32,8 @@
 		</div>
 	</div>
 
-	<div class="table-responsive">
-		<table class="table table-sm mb-5 text-sm" data-component="acp/tokens">
+	<div class="table-responsive mb-3">
+		<table class="table table-sm text-sm" data-component="acp/tokens">
 			<thead>
 				<tr>
 					<th>[[admin/settings/api:token]]</th>
@@ -92,4 +92,5 @@
 			</tbody>
 		</table>
 	</div>
+	<!-- IMPORT admin/partials/paginator.tpl -->
 </form>