Add a very primitive new sidebar tab for the module

module/Apps/StatSidebar.mjs

@@ -0,0 +1,47 @@
+import { filePath } from "../consts.mjs";
+import { StatsViewer } from "./StatsViewer.mjs";
+
+const { HandlebarsApplicationMixin } = foundry.applications.api;
+const { AbstractSidebarTab } = foundry.applications.sidebar;
+
+export class StatSidebar extends HandlebarsApplicationMixin(AbstractSidebarTab) {
+	/** @override */
+	static DEFAULT_OPTIONS = {
+		classes: [
+			__ID__,
+			`StatsSidebar`,
+		],
+		window: {
+			title: `SIDEBAR.TabSettings`,
+		},
+		actions: {
+			openStats: this.#openStats,
+		},
+	};
+
+	/** @override */
+	static tabName = `stats`;
+
+	/** @override */
+	static PARTS = {
+		stats: {
+			template: filePath(`templates/Apps/StatSidebar/main.hbs`),
+			root: true,
+		},
+	};
+
+	async _prepareContext(options) {
+		const ctx = await super._prepareContext(options);
+		const db = CONFIG.StatsDatabase;
+
+		ctx.tableCount = db.getTables().length;
+
+		return ctx;
+	};
+
+	/** @this {StatSidebar} */
+	static async #openStats() {
+		const app = new StatsViewer();
+		app.render({ force: true });
+	};
+};

module/hooks/init.mjs

@@ -3,11 +3,26 @@ import { Logger } from "../utils/Logger.mjs";
 import { MemoryDatabase } from "../utils/databases/Memory.mjs";
 import { registerCustomComponents } from "../Apps/elements/_index.mjs";
 import { registerMetaSettings } from "../settings/meta.mjs";
+import { StatSidebar } from "../Apps/StatSidebar.mjs";
 import { UserFlagDatabase } from "../utils/databases/UserFlag.mjs";
 
 Hooks.on(`init`, () => {
 	Logger.debug(`Initializing`);
 
+	// Add a custom sidebar tab for the module
+	CONFIG.ui.sidebar.TABS.stats = {
+		active: false,
+		icon: `fa-solid fa-chart-line`,
+		tooltip: `Stats!`,
+	};
+	CONFIG.ui.stats = StatSidebar;
+
+	// Inject the tab right before settings;
+	const temp = CONFIG.ui.sidebar.TABS.settings;
+	delete CONFIG.ui.sidebar.TABS.settings;
+	CONFIG.ui.sidebar.TABS.settings = temp;
+
+
 	registerMetaSettings();
 
 	if (import.meta.env.PROD) {

public/styles/Apps/StatsSidebar.css

@@ -0,0 +1,21 @@
+.stats-sidebar {
+	display: flex;
+	flex-direction: column;
+	gap: 2rem;
+	padding: 1rem;
+
+	h4 {
+		margin: 0;
+	}
+
+	section {
+		display: flex;
+		flex-direction: column;
+		gap: 0.5rem;
+	}
+
+	.info {
+		display: flex;
+		justify-content: space-between;
+	}
+}

public/styles/main.css

@@ -3,3 +3,4 @@
 @import url("./elements/custom-multi-select.css") layer(elements);
 
 @import url("./Apps/StatsViewer.css") layer(apps);
+@import url("./Apps/StatsSidebar.css") layer(apps);

public/templates/Apps/StatSidebar/main.hbs

@@ -0,0 +1,31 @@
+<section>
+	<h4 class="divider">Summary</h4>
+	<div class="info">
+		<span>Count of Tables</span>
+		<span>{{ tableCount }}</span>
+	</div>
+	{{!-- <div class="info">
+		<span>Your Total Rows</span>
+		<span>{{ userRowCount }}</span>
+	</div>
+	<div class="info">
+		<span>Your Private Rows</span>
+		<span>{{ userPrivateRowCount }}</span>
+	</div>
+	<div class="info">
+		<span>Global Row Count</span>
+		<span>{{ globalRowCount }}</span>
+	</div> --}}
+</section>
+
+<section>
+	<h4 class="divider">Apps</h4>
+	<button
+		type="button"
+		data-action="openStats"
+	>
+		View Statistics
+	</button>
+	<button type="button">Manage Tables</button>
+	<button type="button">Manage Rows</button>
+</section>