feat: add category selector to analytics page

closes #11878

public/openapi/read/admin/manage/categories/category_id/analytics.yaml

@@ -39,4 +39,6 @@ get:
                         type: array
                         items:
                           type: number
+                  selectedCategory:
+                    $ref: ../../../../../components/schemas/CategoryObject.yaml#/CategoryObject
               - $ref: ../../../../../components/schemas/CommonProps.yaml#/CommonProps

public/src/admin/manage/category-analytics.js

@@ -1,10 +1,20 @@
 'use strict';
 
 
-define('admin/manage/category-analytics', ['Chart'], function (Chart) {
+define('admin/manage/category-analytics', [
+	'Chart', 'categorySelector',
+], function (Chart, categorySelector) {
 	const CategoryAnalytics = {};
 
 	CategoryAnalytics.init = function () {
+		categorySelector.init($('[component="category-selector"]'), {
+			onSelect: function (selectedCategory) {
+				ajaxify.go('admin/manage/categories/' + selectedCategory.cid + '/analytics');
+			},
+			showLinks: true,
+			template: 'admin/partials/category/selector-dropdown-right',
+		});
+
 		const hourlyCanvas = document.getElementById('pageviews:hourly');
 		const dailyCanvas = document.getElementById('pageviews:daily');
 		const topicsCanvas = document.getElementById('topics:daily');

src/controllers/admin/categories.js

@@ -134,12 +134,14 @@ async function buildBreadcrumbs(categoryData, url) {
 categoriesController.buildBreadCrumbs = buildBreadcrumbs;
 
 categoriesController.getAnalytics = async function (req, res) {
-	const [name, analyticsData] = await Promise.all([
+	const [name, analyticsData, selectedData] = await Promise.all([
 		categories.getCategoryField(req.params.category_id, 'name'),
 		analytics.getCategoryAnalytics(req.params.category_id),
+		helpers.getSelectedCategory(req.params.category_id),
 	]);
 	res.render('admin/manage/category-analytics', {
 		name: name,
 		analytics: analyticsData,
+		selectedCategory: selectedData.selectedCategory,
 	});
 };

src/views/admin/manage/category-analytics.tpl

@@ -1,6 +1,14 @@
 
 <div class="px-lg-4">
-	<h5>[[admin/manage/categories:analytics.title, {name}]]</h5>
+
+	<div class="row border-bottom py-2 m-0 sticky-top acp-page-main-header align-items-center">
+		<div class="col-12 px-0 mb-1 mb-md-0 d-flex justify-content-between align-items-center">
+			<h4 class="fw-bold tracking-tight mb-0">[[admin/manage/categories:analytics.title, {name}]]</h4>
+			<!-- IMPORT admin/partials/category/selector-dropdown-right.tpl -->
+		</div>
+	</div>
+
+
 	<hr />
 	<div class="row ">
 		<div class="col-sm-6 text-center">