Merge pull request #128 from rjwats/status-improvements2

Status improvements - add file system

interface/src/system/SystemStatusForm.tsx

@@ -7,6 +7,7 @@ import DevicesIcon from '@material-ui/icons/Devices';
 import MemoryIcon from '@material-ui/icons/Memory';
 import ShowChartIcon from '@material-ui/icons/ShowChart';
 import SdStorageIcon from '@material-ui/icons/SdStorage';
+import FolderIcon from '@material-ui/icons/Folder';
 import DataUsageIcon from '@material-ui/icons/DataUsage';
 import PowerSettingsNewIcon from '@material-ui/icons/PowerSettingsNew';
 import RefreshIcon from '@material-ui/icons/Refresh';
@@ -26,6 +27,11 @@ interface SystemStatusFormState {
 
 type SystemStatusFormProps = AuthenticatedContextProps & RestFormProps<SystemStatus>;
 
+function formatNumber(num: number) {
+  return new Intl.NumberFormat().format(num);
+}
+
+
 class SystemStatusForm extends Component<SystemStatusFormProps, SystemStatusFormState> {
 
   state: SystemStatusFormState = {
@@ -67,7 +73,7 @@ class SystemStatusForm extends Component<SystemStatusFormProps, SystemStatusForm
               <MemoryIcon />
             </Avatar>
           </ListItemAvatar>
-          <ListItemText primary="Heap (Free / Max Alloc)" secondary={data.free_heap + ' / ' + data.max_alloc_heap + ' bytes (~' + this.approxHeapFragmentation() + '% fragmentation)'} />
+          <ListItemText primary="Heap (Free / Max Alloc)" secondary={formatNumber(data.free_heap) + ' / ' + formatNumber(data.max_alloc_heap) + ' bytes (~' + this.approxHeapFragmentation() + '%\xa0fragmentation)'} />
         </ListItem>
         <Divider variant="inset" component="li" />
         <ListItem >
@@ -76,7 +82,7 @@ class SystemStatusForm extends Component<SystemStatusFormProps, SystemStatusForm
               <DataUsageIcon />
             </Avatar>
           </ListItemAvatar>
-          <ListItemText primary="Sketch (Size / Free)" secondary={data.sketch_size + ' / ' + data.free_sketch_space + ' bytes'} />
+          <ListItemText primary="Sketch (Size / Free)" secondary={formatNumber(data.sketch_size) + ' / ' + formatNumber(data.free_sketch_space) + ' bytes'} />
         </ListItem>
         <Divider variant="inset" component="li" />
         <ListItem >
@@ -85,7 +91,16 @@ class SystemStatusForm extends Component<SystemStatusFormProps, SystemStatusForm
               <SdStorageIcon />
             </Avatar>
           </ListItemAvatar>
-          <ListItemText primary="Flash Chip (Size / Speed)" secondary={data.flash_chip_size + ' bytes / ' + (data.flash_chip_speed / 1000000).toFixed(0) + ' MHz'} />
+          <ListItemText primary="Flash Chip (Size / Speed)" secondary={formatNumber(data.flash_chip_size) + ' bytes / ' + (data.flash_chip_speed / 1000000).toFixed(0) + ' MHz'} />
+        </ListItem>
+        <Divider variant="inset" component="li" />
+        <ListItem >
+          <ListItemAvatar>
+            <Avatar>
+              <FolderIcon />
+            </Avatar>
+          </ListItemAvatar>
+          <ListItemText primary="File System (Used / Total)" secondary={formatNumber(data.fs_used) + ' / ' + formatNumber(data.fs_total) + ' bytes (' + formatNumber(data.fs_total - data.fs_used) + '\xa0bytes free)'} />
         </ListItem>
         <Divider variant="inset" component="li" />
       </Fragment>

interface/src/system/types.ts

@@ -8,6 +8,8 @@ export interface SystemStatus {
   sdk_version: string;
   flash_chip_size: number;
   flash_chip_speed: number;
+  fs_used: number;
+  fs_total: number;
 }
 
 export interface OTASettings {

lib/framework/ESP8266React.cpp

@@ -42,11 +42,11 @@ ESP8266React::ESP8266React(AsyncWebServer* server, FS* fs) :
       });
 #else
   // Serve static resources from /www/
-  server->serveStatic("/js/", SPIFFS, "/www/js/");
-  server->serveStatic("/css/", SPIFFS, "/www/css/");
-  server->serveStatic("/fonts/", SPIFFS, "/www/fonts/");
-  server->serveStatic("/app/", SPIFFS, "/www/app/");
-  server->serveStatic("/favicon.ico", SPIFFS, "/www/favicon.ico");
+  server->serveStatic("/js/", *fs, "/www/js/");
+  server->serveStatic("/css/", *fs, "/www/css/");
+  server->serveStatic("/fonts/", *fs, "/www/fonts/");
+  server->serveStatic("/app/", *fs, "/www/app/");
+  server->serveStatic("/favicon.ico", *fs, "/www/favicon.ico");
   // Serving all other get requests with "/www/index.htm"
   // OPTIONS get a straight up 200 response
   server->onNotFound([](AsyncWebServerRequest* request) {

lib/framework/ESP8266React.h

@@ -5,12 +5,10 @@
 
 #ifdef ESP32
 #include <AsyncTCP.h>
-#include <SPIFFS.h>
 #include <WiFi.h>
 #elif defined(ESP8266)
 #include <ESP8266WiFi.h>
 #include <ESPAsyncTCP.h>
-#include <FS.h>
 #endif
 
 #include <APSettingsService.h>

lib/framework/SystemStatus.cpp

@@ -1,29 +1,42 @@
-#include <SystemStatus.h>
-
-SystemStatus::SystemStatus(AsyncWebServer* server, SecurityManager* securityManager) {
-  server->on(SYSTEM_STATUS_SERVICE_PATH,
-             HTTP_GET,
-             securityManager->wrapRequest(std::bind(&SystemStatus::systemStatus, this, std::placeholders::_1),
-                                          AuthenticationPredicates::IS_AUTHENTICATED));
-}
-
-void SystemStatus::systemStatus(AsyncWebServerRequest* request) {
-  AsyncJsonResponse* response = new AsyncJsonResponse(false, MAX_ESP_STATUS_SIZE);
-  JsonObject root = response->getRoot();
-#ifdef ESP32
-  root["esp_platform"] = "esp32";
-  root["max_alloc_heap"] = ESP.getMaxAllocHeap();
-#elif defined(ESP8266)
-  root["esp_platform"] = "esp8266";
-  root["max_alloc_heap"] = ESP.getMaxFreeBlockSize();
-#endif
-  root["cpu_freq_mhz"] = ESP.getCpuFreqMHz();
-  root["free_heap"] = ESP.getFreeHeap();
-  root["sketch_size"] = ESP.getSketchSize();
-  root["free_sketch_space"] = ESP.getFreeSketchSpace();
-  root["sdk_version"] = ESP.getSdkVersion();
-  root["flash_chip_size"] = ESP.getFlashChipSize();
-  root["flash_chip_speed"] = ESP.getFlashChipSpeed();
-  response->setLength();
-  request->send(response);
-}
+#include <SystemStatus.h>
+
+SystemStatus::SystemStatus(AsyncWebServer* server, SecurityManager* securityManager) {
+  server->on(SYSTEM_STATUS_SERVICE_PATH,
+             HTTP_GET,
+             securityManager->wrapRequest(std::bind(&SystemStatus::systemStatus, this, std::placeholders::_1),
+                                          AuthenticationPredicates::IS_AUTHENTICATED));
+}
+
+void SystemStatus::systemStatus(AsyncWebServerRequest* request) {
+  AsyncJsonResponse* response = new AsyncJsonResponse(false, MAX_ESP_STATUS_SIZE);
+  JsonObject root = response->getRoot();
+#ifdef ESP32
+  root["esp_platform"] = "esp32";
+  root["max_alloc_heap"] = ESP.getMaxAllocHeap();
+#elif defined(ESP8266)
+  root["esp_platform"] = "esp8266";
+  root["max_alloc_heap"] = ESP.getMaxFreeBlockSize();
+#endif
+  root["cpu_freq_mhz"] = ESP.getCpuFreqMHz();
+  root["free_heap"] = ESP.getFreeHeap();
+  root["sketch_size"] = ESP.getSketchSize();
+  root["free_sketch_space"] = ESP.getFreeSketchSpace();
+  root["sdk_version"] = ESP.getSdkVersion();
+  root["flash_chip_size"] = ESP.getFlashChipSize();
+  root["flash_chip_speed"] = ESP.getFlashChipSpeed();
+
+// TODO - Ideally this class will take an *FS and extract the file system information from there.
+// ESP8266 and ESP32 do not have feature parity in FS.h which currently makes that difficult.
+#ifdef ESP32
+  root["fs_total"] = SPIFFS.totalBytes();
+  root["fs_used"] = SPIFFS.usedBytes();
+#elif defined(ESP8266)
+  FSInfo fs_info;
+  SPIFFS.info(fs_info);
+  root["fs_total"] = fs_info.totalBytes;
+  root["fs_used"] = fs_info.usedBytes;
+#endif
+
+  response->setLength();
+  request->send(response);
+}

lib/framework/SystemStatus.h

@@ -4,9 +4,11 @@
 #ifdef ESP32
 #include <WiFi.h>
 #include <AsyncTCP.h>
+#include <SPIFFS.h>
 #elif defined(ESP8266)
 #include <ESP8266WiFi.h>
 #include <ESPAsyncTCP.h>
+#include <FS.h>
 #endif
 
 #include <ArduinoJson.h>