Merge pull request #264 from parallaxinc/overwriteOverlay

adds confirm dialog on overwrite

Author: phated

src/constants/action-types.js

@@ -25,6 +25,7 @@ const actionTypes = {
   UPDATE_DOWNLOAD_PROGRESS: 'UPDATE_DOWNLOAD_PROGRESS',
   QUEUE_NEW_FILE: 'QUEUE_NEW_FILE',
   QUEUE_CHANGE_FILE: 'QUEUE_CHANGE_FILE',
+  QUEUE_OVERWRITE_FILE: 'QUEUE_OVERWRITE_FILE',
   RESET_ACTION_QUEUE: 'RESET_ACTION_QUEUE'
 };
 

src/constants/overlay-states.js

@@ -6,6 +6,7 @@ const overlayStates = {
   SAVE_OVERLAY: 'SAVE_OVERLAY',
   DOWNLOAD_OVERLAY: 'DOWNLOAD_OVERLAY',
   PROJECTS_OVERLAY: 'PROJECTS_OVERLAY',
+  OVERWRITE_OVERLAY: 'OVERWRITE_OVERLAY',
   DELETE_FILE_OVERLAY: 'DELETE_FILE_OVERLAY',
   DELETE_PROJECT_OVERLAY: 'DELETE_PROJECT_OVERLAY'
 };

src/constants/queued-action-types.js

@@ -2,7 +2,8 @@
 
 const queuedActionTypes = {
   NEW_FILE: 'NEW_FILE',
-  CHANGE_FILE: 'CHANGE_FILE'
+  CHANGE_FILE: 'CHANGE_FILE',
+  OVERWRITE_FILE: 'OVERWRITE_FILE'
 };
 
 module.exports = queuedActionTypes;

src/creators/index.js

@@ -7,6 +7,7 @@ const creators = {
   showDeleteProjectOverlay: require('./show-delete-project-overlay'),
   showDownloadOverlay: require('./show-download-overlay'),
   showProjectsOverlay: require('./show-projects-overlay'),
+  showOverwriteOverlay: require('./show-overwrite-overlay'),
   showSaveOverlay: require('./show-save-overlay'),
   showHelpOverlay: require('./show-help-overlay'),
   hideOverlay: require('./hide-overlay'),
@@ -34,6 +35,7 @@ const creators = {
   // action queue creators
   queueNewFile: require('./queue-new-file'),
   queueChangeFile: require('./queue-change-file'),
+  queueOverwriteFile: require('./queue-overwrite-file'),
   resetActionQueue: require('./reset-action-queue')
 };
 

src/creators/queue-overwrite-file.js

@@ -0,0 +1,16 @@
+'use strict';
+
+const {
+  QUEUE_OVERWRITE_FILE
+} = require('../constants/action-types');
+
+function queueOverwriteFile(filename){
+  return {
+    type: QUEUE_OVERWRITE_FILE,
+    payload: {
+      filename
+    }
+  };
+}
+
+module.exports = queueOverwriteFile;

src/creators/show-overwrite-overlay.js

@@ -0,0 +1,20 @@
+'use strict';
+
+const {
+  SHOW_OVERLAY
+} = require('../constants/action-types');
+
+const {
+  OVERWRITE_OVERLAY
+} = require('../constants/overlay-states');
+
+function showOverwriteOverlay(){
+  return {
+    type: SHOW_OVERLAY,
+    payload: {
+      state: OVERWRITE_OVERLAY
+    }
+  };
+}
+
+module.exports = showOverwriteOverlay;

src/lib/documents.js

@@ -47,6 +47,10 @@ class Documents {
     this._editor.swapDoc(doc);
     return doc;
   }
+
+  replace(filename){
+    this._documents[filename] = this._editor.getDoc();
+  }
 }
 
 module.exports = Documents;

src/plugins/handlers.js

@@ -15,7 +15,8 @@ const highlighter = require('../lib/highlighter');
 
 const {
   NEW_FILE,
-  CHANGE_FILE
+  CHANGE_FILE,
+  OVERWRITE_FILE
 } = require('../constants/queued-action-types');
 
 // TODO: move somewhere else?
@@ -71,6 +72,8 @@ function handlers(app, opts, done){
         return newFile();
       case CHANGE_FILE:
         return changeFile(nextFile);
+      case OVERWRITE_FILE:
+        return saveFileAs(nextFile, true);
     }
   }
 
@@ -117,23 +120,32 @@ function handlers(app, opts, done){
         .then(function(){
           documents.swap(path.join(cwd, filename));
         });
+      store.dispatch(creators.hideOverlay());
     }
   }
 
-  function saveFileAs(filename){
+  function saveFileAs(filename, overwrite){
     if(!filename){
       return;
     }
 
-    const { cwd, content } = workspace.getState();
+    const { cwd, content, directory } = workspace.getState();
+    if(!overwrite && _.filter(directory, {name: filename}).length){
+      return showOverwriteOverlay(filename);
+    }
 
     workspace.updateFilename(filename)
       .then(() => workspace.saveFile(filename, content))
       .then(() => userConfig.set('last-file', filename))
       .then(function(){
-        documents.swap(path.join(cwd, filename));
+        documents.replace(path.join(cwd, filename));
         handleActionQueue();
       });
+    store.dispatch(creators.hideOverlay());
+  }
+
+  function overwriteFile(){
+    handleActionQueue();
   }
 
   function dontSaveFile(){
@@ -233,6 +245,11 @@ function handlers(app, opts, done){
     store.dispatch(creators.showSaveOverlay());
   }
 
+  function showOverwriteOverlay(name){
+    store.dispatch(creators.queueOverwriteFile(name));
+    store.dispatch(creators.showOverwriteOverlay());
+  }
+
   function showDownloadOverlay(){
     store.dispatch(creators.showDownloadOverlay());
     // TODO: is there ever a time when show download overlay doesn't reload devices?
@@ -571,6 +588,7 @@ function handlers(app, opts, done){
     deleteFile,
     changeFile,
     dontSaveFile,
+    overwriteFile,
     // project methods
     changeProject,
     deleteProject,

src/plugins/overlays.js

@@ -6,6 +6,7 @@ const HelpOverlay = require('../views/help-overlay');
 const SaveOverlay = require('../views/save-overlay');
 const ProjectOverlay = require('../views/project-overlay');
 const DownloadOverlay = require('../views/download-overlay');
+const OverwriteOverlay = require('../views/overwrite-overlay');
 const DeleteFileOverlay = require('../views/delete-file-overlay');
 const DeleteProjectOverlay = require('../views/delete-project-overlay');
 
@@ -17,6 +18,7 @@ const {
   SAVE_OVERLAY,
   DOWNLOAD_OVERLAY,
   PROJECTS_OVERLAY,
+  OVERWRITE_OVERLAY,
   DELETE_FILE_OVERLAY,
   DELETE_PROJECT_OVERLAY
 } = require('../constants/overlay-states');
@@ -43,6 +45,9 @@ function overlays(app, opts, done){
       case SAVE_OVERLAY:
         renderOverlay(<SaveOverlay workspace={workspace} handlers={handlers} />);
         break;
+      case OVERWRITE_OVERLAY:
+        renderOverlay(<OverwriteOverlay store={store} handlers={handlers} />);
+        break;
       case DOWNLOAD_OVERLAY:
         renderOverlay(<DownloadOverlay store={store} handlers={handlers} />);
         break;

src/reducers/next-action.js

@@ -3,12 +3,14 @@
 const {
   QUEUE_NEW_FILE,
   QUEUE_CHANGE_FILE,
+  QUEUE_OVERWRITE_FILE,
   RESET_ACTION_QUEUE
 } = require('../constants/action-types');
 
 const {
   NEW_FILE,
-  CHANGE_FILE
+  CHANGE_FILE,
+  OVERWRITE_FILE
 } = require('../constants/queued-action-types');
 
 const initial = '';
@@ -19,6 +21,8 @@ function nextAction(state = initial, { type }){
       return NEW_FILE;
     case QUEUE_CHANGE_FILE:
       return CHANGE_FILE;
+    case QUEUE_OVERWRITE_FILE:
+      return OVERWRITE_FILE;
     case RESET_ACTION_QUEUE:
       return initial;
     default:

src/reducers/next-file.js

@@ -2,6 +2,7 @@
 
 const {
   QUEUE_CHANGE_FILE,
+  QUEUE_OVERWRITE_FILE,
   RESET_ACTION_QUEUE
 } = require('../constants/action-types');
 
@@ -11,6 +12,8 @@ function nextFile(state = initial, { type, payload }){
   switch(type){
     case QUEUE_CHANGE_FILE:
       return payload.filename;
+    case QUEUE_OVERWRITE_FILE:
+      return payload.filename;
     case RESET_ACTION_QUEUE:
       return initial;
     default:

src/views/overwrite-overlay.js

@@ -0,0 +1,67 @@
+'use strict';
+
+const React = require('react');
+const { createContainer } = require('sovereign');
+const Button = require('react-material/components/Button');
+
+const Overlay = require('../components/overlay');
+const OverlayTitle = require('../components/overlay-title');
+const OverlayFooter = require('../components/overlay-footer');
+
+class OverwriteOverlay extends React.Component {
+
+  constructor(...args){
+    super(...args);
+
+    this.overwrite = this.overwrite.bind(this);
+  }
+
+  overwrite(){
+    const {
+      handlers
+    } = this.props;
+
+    const {
+      overwriteFile
+    } = handlers;
+
+    overwriteFile();
+  }
+
+  render(){
+    const {
+      filename,
+      handlers
+    } = this.props;
+
+    const {
+      showSaveOverlay
+    } = handlers;
+
+    return (
+      <Overlay>
+        <OverlayTitle>File '{filename}' already exists. Overwrite anyway?</OverlayTitle>
+        <OverlayFooter>
+          <Button onClick={this.overwrite}>Overwrite</Button>
+          <Button onClick={showSaveOverlay}>Cancel</Button>
+        </OverlayFooter>
+      </Overlay>
+    );
+  }
+}
+
+module.exports = createContainer(OverwriteOverlay, {
+  getStores({ store }){
+    return {
+      store
+    };
+  },
+
+  getPropsFromStores({ store }){
+    const { nextFile } = store.getState();
+
+    return {
+      filename: nextFile
+    };
+  }
+});

src/views/save-overlay.js

@@ -60,7 +60,6 @@ class SaveOverlay extends React.Component {
     } = this.props.handlers;
 
     saveFileAs(filename);
-    hideOverlay();
     this.clearName();
   }