⬆️ ☁️ Upload Service -- rewrite and testing

www/__mocks__/cordovaMocks.ts

@@ -24,6 +24,11 @@ export const mockGetAppVersion = () => {
   window['cordova'].getAppVersion = mockGetAppVersion;
 }
 
+export const mockFile = () => {
+  window['cordova'].file = { "dataDirectory" : "../path/to/data/directory", 
+                              "applicationStorageDirectory" : "../path/to/app/storage/directory"};
+}
+
 export const mockBEMUserCache = () => {
   const _cache = {};
   const messages = [];

www/__mocks__/fileSystemMocks.ts

@@ -0,0 +1,23 @@
+export const mockFileSystem = () => {
+  window['resolveLocalFileSystemURL'] = function (parentDir, handleFS) {
+    const fs = {
+      filesystem:
+      {
+        root:
+        {
+          getFile: (path, options, onSuccess) => {
+            let fileEntry = {
+              file: (handleFile) => {
+                let file = new File(["this is a mock"], "loggerDB");
+                handleFile(file);
+              }
+            }
+            onSuccess(fileEntry);
+          }
+        }
+      }
+    }
+    console.log("in mock, fs is ", fs, " get File is ", fs.filesystem.root.getFile);
+    handleFS(fs);
+  }
+}

www/__tests__/uploadService.test.ts

@@ -0,0 +1,52 @@
+//this is never used in production right now
+//however, tests are still important to make sure the code works
+//at some point we hope to restore this functionality
+
+import {uploadFile} from "../js/control/uploadService";
+import { mockLogger } from '../__mocks__/globalMocks';
+import { mockDevice, mockGetAppVersion, mockCordova, mockFile } from "../__mocks__/cordovaMocks";
+import { mockFileSystem } from "../__mocks__/fileSystemMocks";
+
+mockDevice();
+mockGetAppVersion();
+mockCordova();
+
+mockLogger();
+mockFile(); //mocks the base directory 
+mockFileSystem(); //comnplex mock, allows the readDBFile to work in testing
+
+//use this message to verify that the post went through
+let message = "";
+
+//each have a slight delay to mimic a real fetch request
+global.fetch = (url: string, options: { method: string, headers: {}, body: string }) => new Promise((rs, rj) => {
+  //if there's options, that means there is a post request
+  if (options) {
+    message = "sent " + options.method + options.body + " for " + url;
+    setTimeout(() => {
+      rs('sent ' + options.method + options.body + ' to ' + url);
+    }, 100);
+  }
+  //else it is a get request
+  else {
+    setTimeout(() => rs({
+      json: () => new Promise((rs, rj) => {
+        setTimeout(() => rs('mock data for ' + url), 100);
+      })
+    }));
+  }
+}) as any;
+
+window.alert = (message) => {
+  console.log(message);
+}
+
+//very basic tests - difficult to do too much since there's a lot of mocking involved
+it('posts the logs to the configured database', async () => {
+  let posted = await uploadFile("loggerDB", "HelloWorld");
+  expect(message).toEqual(expect.stringContaining("HelloWorld"));
+  expect(message).toEqual(expect.stringContaining("POST"));
+  posted = await uploadFile("loggerDB", "second test");
+  expect(message).toEqual(expect.stringContaining("second test"));
+  expect(message).toEqual(expect.stringContaining("POST"));
+}, 10000);

www/index.js

@@ -24,7 +24,6 @@ import './js/survey/enketo/answer.js';
 import './js/survey/enketo/enketo-trip-button.js';
 import './js/survey/enketo/enketo-add-note-button.js';
 import './js/control/emailService.js';
-import './js/control/uploadService.js';
 import './js/metrics-factory.js';
 import './js/metrics-mappings.js';
 import './js/plugin/logger.ts';

www/js/control/ProfileSettings.jsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useContext, useRef } from "react";
 import { Modal, StyleSheet, ScrollView } from "react-native";
-import { Dialog, Button, useTheme, Text, Appbar, IconButton } from "react-native-paper";
+import { Dialog, Button, useTheme, Text, Appbar, IconButton, TextInput } from "react-native-paper";
 import { getAngularService } from "../angular-react-helper";
 import { useTranslation } from "react-i18next";
 import ExpansionSection from "./ExpandMenu";
@@ -12,8 +12,9 @@ import ReminderTime from "./ReminderTime"
 import useAppConfig from "../useAppConfig";
 import AlertBar from "./AlertBar";
 import DataDatePicker from "./DataDatePicker";
-import AppStatusModal from "./AppStatusModal";
 import PrivacyPolicyModal from "./PrivacyPolicyModal";
+
+import {uploadFile} from "./uploadService";
 import ActionMenu from "../components/ActionMenu";
 import SensedPage from "./SensedPage"
 import LogPage from "./LogPage";
@@ -35,7 +36,6 @@ const ProfileSettings = () => {
 
     //angular services needed
     const CarbonDatasetHelper = getAngularService('CarbonDatasetHelper');
-    const UploadHelper = getAngularService('UploadHelper');
     const EmailHelper = getAngularService('EmailHelper');
     const NotificationScheduler = getAngularService('NotificationScheduler');
     const ControlHelper = getAngularService('ControlHelper');
@@ -57,6 +57,7 @@ const ProfileSettings = () => {
     const [consentVis, setConsentVis] = useState(false);
     const [dateDumpVis, setDateDumpVis] = useState(false);
     const [privacyVis, setPrivacyVis] = useState(false);
+    const [uploadVis, setUploadVis] = useState(false);
     const [showingSensed, setShowingSensed] = useState(false);
     const [showingLog, setShowingLog] = useState(false);
     const [editSync, setEditSync] = useState(false);
@@ -72,6 +73,7 @@ const ProfileSettings = () => {
     const [uiConfig, setUiConfig] = useState({});
     const [consentDoc, setConsentDoc] = useState({});
     const [dumpDate, setDumpDate] = useState(new Date());
+    const [uploadReason, setUploadReason] = useState("");
     const appVersion = useRef();
 
     let carbonDatasetString = t('general-settings.carbon-dataset') + ": " + CarbonDatasetHelper.getCurrentCarbonDatasetCode();
@@ -219,8 +221,12 @@ const ProfileSettings = () => {
 
     //methods that control the settings
     const uploadLog = function () {
-        UploadHelper.uploadFile("loggerDB")
-    };
+        if(uploadReason != "") {
+            let reason = uploadReason;
+            uploadFile("loggerDB", reason);
+            setUploadVis(false);
+        }
+    }
 
     const emailLog = function () {
         // Passing true, we want to send logs
@@ -329,7 +335,7 @@ const ProfileSettings = () => {
     let logUploadSection;
     console.debug("appConfg: support_upload:", appConfig?.profile_controls?.support_upload);
     if (appConfig?.profile_controls?.support_upload) {
-        logUploadSection = <SettingRow textKey="control.upload-log" iconName="cloud" action={uploadLog}></SettingRow>;
+        logUploadSection = <SettingRow textKey="control.upload-log" iconName="cloud" action={() => setUploadVis(true)}></SettingRow>;
     }
 
     let timePicker;
@@ -414,6 +420,27 @@ const ProfileSettings = () => {
             {/* force state sheet */}
             <ActionMenu vis={forceStateVis} setVis={setForceStateVis} title={"Force State"} actionSet={stateActions} onAction={onSelectState} onExit={() => {}}></ActionMenu>
 
+            {/* upload reason input */}
+            <Modal visible={uploadVis} onDismiss={() => setUploadVis(false)}
+            transparent={true}>
+                <Dialog visible={uploadVis}
+                onDismiss={() => setUploadVis(false)}
+                style={settingStyles.dialog(colors.elevation.level3)}>
+                    <Dialog.Title>{t('upload-service.upload-database', {db: "loggerDB"})}</Dialog.Title>
+                    <Dialog.Content>
+                        <TextInput label="Reason"
+                                value={uploadReason}
+                                onChangeText={uploadReason => setUploadReason(uploadReason)}
+                                placeholder={t('upload-service.please-fill-in-what-is-wrong')}>
+                            </TextInput>
+                    </Dialog.Content>
+                    <Dialog.Actions>
+                        <Button onPress={() => setUploadVis(false)}>{t('general-settings.cancel')}</Button>
+                        <Button onPress={() => uploadLog()}>Upload</Button>
+                    </Dialog.Actions>
+                </Dialog>
+            </Modal>
+
             {/* opcode viewing popup */}
             <PopOpCode visibilityValue = {opCodeVis} setVis = {setOpCodeVis} tokenURL = {"emission://login_token?token="+authSettings.opcode} action={() => shareQR(authSettings.opcode)}></PopOpCode>