Can download a copy of storage

central_frontend/src/App.tsx

@@ -16,6 +16,7 @@ import { PendingDevicesRoute } from "./routes/PendingDevicesRoute";
 import { RelaysListRoute } from "./routes/RelaysListRoute";
 import { BaseAuthenticatedPage } from "./widgets/BaseAuthenticatedPage";
 import { OTARoute } from "./routes/OTARoute";
+import { ManagementRoute } from "./routes/ManagementRoute";
 
 export function App() {
   if (!AuthApi.SignedIn && !ServerApi.Config.auth_disabled)
@@ -31,6 +32,7 @@ export function App() {
         <Route path="relays" element={<RelaysListRoute />} />
         <Route path="ota" element={<OTARoute />} />
         <Route path="logs" element={<LogsRoute />} />
+        <Route path="management" element={<ManagementRoute />} />
         <Route path="*" element={<NotFoundRoute />} />
       </Route>
     )

central_frontend/src/routes/ManagementRoute.tsx

@@ -0,0 +1,31 @@
+import { Button } from "@mui/material";
+import { useConfirm } from "../hooks/context_providers/ConfirmDialogProvider";
+import { SolarEnergyRouteContainer } from "../widgets/SolarEnergyRouteContainer";
+import { APIClient } from "../api/ApiClient";
+
+export function ManagementRoute(): React.ReactElement {
+  const confirm = useConfirm();
+
+  const downloadBackup = async () => {
+    try {
+      if (
+        !(await confirm(
+          `Do you really want to download a copy of the storage? It will contain sensitive information!`
+        ))
+      )
+        return;
+
+      location.href = APIClient.backendURL() + "/management/download_storage";
+    } catch (e) {
+      console.error(`Failed to donwload a backup of the storage! Error: ${e}`);
+    }
+  };
+
+  return (
+    <SolarEnergyRouteContainer label="Management">
+      <Button variant="outlined" onClick={downloadBackup}>
+        Download a backup of storage
+      </Button>
+    </SolarEnergyRouteContainer>
+  );
+}

central_frontend/src/widgets/SolarEnergyNavList.tsx

@@ -1,5 +1,6 @@
 import {
   mdiChip,
+  mdiCog,
   mdiElectricSwitch,
   mdiHome,
   mdiMonitorArrowDown,
@@ -54,6 +55,11 @@ export function SolarEnergyNavList(): React.ReactElement {
         uri="/logs"
         icon={<Icon path={mdiNotebookMultiple} size={1} />}
       />
+      <NavLink
+        label="Management"
+        uri="/management"
+        icon={<Icon path={mdiCog} size={1} />}
+      />
       <Typography
         variant="caption"
         component="div"