Added small web interface with the most vital stats

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