Added small web interface with the most vital stats

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,

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>;
 }
 

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 },
 			},
 		}),
 	],