From 8a85cfc8da8913255f6f7eb491bbadfe63f4ff62 Mon Sep 17 00:00:00 2001
From: Daniel <danielv@danielv.no>
Date: Wed, 9 Jun 2021 18:00:35 +0200
Subject: [PATCH] Added small web interface with the most vital stats

---
 plugins/inventory_sync/master.js         |  2 +-
 plugins/inventory_sync/web/index.jsx     | 23 +++++++++++++++++------
 plugins/inventory_sync/webpack.config.js |  3 +++
 3 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/plugins/inventory_sync/master.js b/plugins/inventory_sync/master.js
index 71889dcc..29f080b9 100644
--- a/plugins/inventory_sync/master.js
+++ b/plugins/inventory_sync/master.js
@@ -63,7 +63,7 @@ class MasterPlugin extends libPlugin.BaseMasterPlugin {
 			}))
 			.sort((a, b) => a.stringified.length - b.stringified.length)
 		return {
-			database_size: inventories.reduce((a, b) => b - a, 0),
+			database_size: inventories.map(x => x.length).reduce((a, b) => b - a, 0),
 			database_entries: inventories.length,
 			largest_entry: {
 				name: inventories[0].name,
diff --git a/plugins/inventory_sync/web/index.jsx b/plugins/inventory_sync/web/index.jsx
index 3cd384d2..2229428e 100644
--- a/plugins/inventory_sync/web/index.jsx
+++ b/plugins/inventory_sync/web/index.jsx
@@ -1,19 +1,30 @@
-import React, { useContext } from "react";
-import { Typography } from "antd";
+import React, { useContext, useEffect, useState } from "react";
 
 import libPlugin from "@clusterio/lib/plugin";
-import { notifyErrorHandler, PageLayout, ControlContext } from "@clusterio/web_ui";
+import { PageLayout, ControlContext } from "@clusterio/web_ui";
 import info from "../info";
 
 import "./index.css";
 
-const { Paragraph } = Typography;
-
 function InventoryPage() {
-    // let control = useContext(ControlContext);
+    let control = useContext(ControlContext);
+
+    let [statsData, updateStatsData] = useState()
+
+    useEffect(() => {
+        (async () => {
+            // Get statistics
+            updateStatsData(await info.messages.databaseStats.send(control, {}))
+        })()
+    }, [])
 
     return <PageLayout nav={[{ name: "Inventory sync" }]}>
         <h2>Inventory sync</h2>
+        {statsData && <>
+            <p>Database size: {Math.round(statsData.database_size / 1000)}kB</p>
+            <p>Database entries: {statsData.database_entries}</p>
+            <p>Largest entry is {statsData.largest_entry.name} with {(statsData.largest_entry.size / 1000)}kB</p>
+        </>}
     </PageLayout>;
 }
 
diff --git a/plugins/inventory_sync/webpack.config.js b/plugins/inventory_sync/webpack.config.js
index 1dd85e59..32df7fbf 100644
--- a/plugins/inventory_sync/webpack.config.js
+++ b/plugins/inventory_sync/webpack.config.js
@@ -28,6 +28,9 @@ module.exports = (env = {}) => merge(common(env), {
 				"@clusterio/lib/link": { import: false },
 				"@clusterio/web_ui": { import: false },
 				"ajv": { import: false },
+				"antd": { import: false },
+				"react": { import: false },
+				"react-dom": { import: false },
 			},
 		}),
 	],