Merge remote-tracking branch 'origin/v3.4' into dev

interface/src/framework/system/FirmwareFileUpload.tsx

@@ -0,0 +1,32 @@
+import { AxiosPromise } from 'axios';
+import { FC } from 'react';
+
+import { FileUploadConfig } from '../../api/endpoints';
+import { MessageBox, SingleUpload, useFileUpload } from '../../components';
+
+interface UploadFirmwareProps {
+  uploadFirmware: (file: File, config?: FileUploadConfig) => AxiosPromise<void>;
+}
+
+const FirmwareFileUpload: FC<UploadFirmwareProps> = ({ uploadFirmware }) => {
+  const [uploadFile, cancelUpload, uploading, uploadProgress] = useFileUpload({ upload: uploadFirmware });
+
+  return (
+    <>
+      <MessageBox
+        message="Upload a new firmware (.bin) file below to replace the existing firmware"
+        level="warning"
+        my={2}
+      />
+      <SingleUpload
+        accept="application/octet-stream"
+        onDrop={uploadFile}
+        onCancel={cancelUpload}
+        uploading={uploading}
+        progress={uploadProgress}
+      />
+    </>
+  );
+};
+
+export default FirmwareFileUpload;