electron: save file to custom location

packages/web/src/modals/SaveFileModal.js

@@ -6,14 +6,52 @@ import ModalHeader from './ModalHeader';
 import ModalContent from './ModalContent';
 import ModalFooter from './ModalFooter';
 import { FormProvider } from '../utility/FormProvider';
+import FormStyledButton from '../widgets/FormStyledButton';
+import getElectron from '../utility/getElectron';
+
+export default function SaveFileModal({
+  data,
+  folder,
+  format,
+  modalState,
+  name,
+  fileExtension,
+  filePath,
+  onSave = undefined,
+}) {
+  const electron = getElectron();
 
-export default function SaveFileModal({ data, folder, format, modalState, name, onSave = undefined }) {
   const handleSubmit = async values => {
     const { name } = values;
     await axios.post('files/save', { folder, file: name, data, format });
     modalState.close();
-    if (onSave) onSave(name);
+    if (onSave) {
+      onSave(name, {
+        savedFile: name,
+        savedFolder: folder,
+        savedFilePath: null,
+      });
+    }
   };
+
+  const handleSaveAs = async filePath => {
+    const path = window.require('path');
+
+    const parsed = path.parse(filePath);
+    if (!parsed.ext) filePath += `.${fileExtension}`;
+
+    await axios.post('files/save-as', { filePath, data, format });
+    modalState.close();
+
+    if (onSave) {
+      onSave(parsed.name, {
+        savedFile: null,
+        savedFolder: null,
+        savedFilePath: filePath,
+      });
+    }
+  };
+
   return (
     <ModalBase modalState={modalState}>
       <ModalHeader modalState={modalState}>Save file</ModalHeader>
@@ -23,6 +61,21 @@ export default function SaveFileModal({ data, folder, format, modalState, name,
         </ModalContent>
         <ModalFooter>
           <FormSubmit value="Save" onClick={handleSubmit} />
+          {electron && (
+            <FormStyledButton
+              type="button"
+              value="Save to disk"
+              onClick={() => {
+                const file = electron.remote.dialog.showSaveDialogSync(electron.remote.getCurrentWindow(), {
+                  filters: { name: `${fileExtension.toUpperCase()} files`, extensions: [fileExtension] },
+                  defaultPath: filePath,
+                });
+                if (file) {
+                  handleSaveAs(file);
+                }
+              }}
+            />
+          )}
         </ModalFooter>
       </FormProvider>
     </ModalBase>