Improve dialogs:

- Clear dialogs after closing them
- Rename dialog should be filled with File name intiially
- Add a Cancel button to Create dialog (buttons grouped by twos)

src/js/api/files.js

@@ -102,9 +102,10 @@ export async function createDirectory(...args) {
 }
 
 export async function remove(file, deep) {
+  let path = normalize(file);
   let parent = await root();
 
-  return parent[deep ? 'removeDeep' : 'remove'](file);
+  return parent[deep ? 'removeDeep' : 'remove'](path);
 }
 
 export async function move(file, newPath) {
@@ -117,7 +118,7 @@ export async function move(file, newPath) {
 
 export async function copy(file, newPath) {
   let path = normalize(file.path || '').replace(/^\//, '');
-  let oldPath = path + file.name;
+  let oldPath = normalize(path + file.name);
 
   newPath = normalize(newPath);
 

src/js/components/dialog.js

@@ -3,16 +3,31 @@ import { template } from 'utils';
 
 export default class Dialog extends Component {
   render() {
-    let { input, title, description, active } = this.props;
-    let conditionalInput = input ? <input ref='input' /> : '';
+    let { input, title, description, active, value } = this.props;
+    let conditionalInput = input ? <input ref='input' value={value} /> : '';
 
     let buttons = this.props.buttons.map((button, i) => {
-      return <button className={button.className + ' btn'} key={i}
-                     onClick={button.action.bind(this)}>
-                      {button.text}
-            </button>;
+      return (
+        <button className={button.className + ' btn'} key={i}
+                onClick={button.action.bind(this)}>
+          {button.text}
+        </button>
+      )
     });
 
+    let groupButtons = [];
+
+    for (let i = 0; i < buttons.length; i++) {
+      if (i % 2 === 0) {
+        groupButtons.push(
+          <div className='foot'>
+            {buttons[i]}
+            {buttons[i+1]}
+          </div>
+        )
+      }
+    }
+
     let className = active ? 'dialog active' : 'dialog';
 
     return (
@@ -22,9 +37,7 @@ export default class Dialog extends Component {
 
         {conditionalInput}
 
-        <div className='foot'>
-          {buttons}
-        </div>
+        {groupButtons}
       </div>
     )
   }

src/js/dialogs.js

@@ -21,6 +21,7 @@ export default {
           this.props.dispatch(action);
           this.props.dispatch(hideAll());
           this.props.dispatch(active());
+          input.value = '';
         }
       },
       {
@@ -34,6 +35,15 @@ export default {
           this.props.dispatch(action);
           this.props.dispatch(hideAll());
           this.props.dispatch(active());
+          input.value = '';
+        }
+      },
+      {
+        text: 'Cancel',
+        action() {
+          let input = React.findDOMNode(this.refs.input);
+          this.props.dispatch(hideAll());
+          input.value = '';
         }
       }
     ]
@@ -45,7 +55,11 @@ export default {
     buttons: [
       {
         text: 'Cancel',
-        action: bind(hideAll())
+        action() {
+          let input = React.findDOMNode(this.refs.input);
+          this.props.dispatch(hideAll());
+          input.value = '';
+        }
       },
       {
         text: 'Rename',
@@ -56,6 +70,7 @@ export default {
           this.props.dispatch(rename(activeFile, input.value))
           this.props.dispatch(hideAll());
           this.props.dispatch(active());
+          input.value = '';
         },
         className: 'success'
       }
@@ -95,7 +110,11 @@ export default {
     buttons: [
       {
         text: 'Cancel',
-        action: bind(hideAll())
+        action() {
+          let input = React.findDOMNode(this.refs.input);
+          this.props.dispatch(hideAll());
+          input.value = '';
+        }
       },
       {
         text: 'Search',
@@ -105,6 +124,7 @@ export default {
           let action = search(input.value);
           this.props.dispatch(action);
           this.props.dispatch(hideAll());
+          input.value = '';
         },
         className: 'success'
       }

src/js/menus.js

@@ -11,10 +11,11 @@ const entryMenu = {
       action() {
         let files = store.getState().get('files');
         let active = store.getState().get('activeFile');
-        const description = `Enter the new name for ${active[0].name}`;
+        let name = active[0].name;
+        const description = `Enter the new name for ${name}`;
 
         store.dispatch(hideAll());
-        store.dispatch(show('renameDialog', {description}));
+        store.dispatch(show('renameDialog', {description, value: name}));
       }
     },
     {

src/less/components/dialog.less

@@ -48,6 +48,8 @@
 
     justify-content: space-between;
 
+    margin-bottom: 1rem;
+
     button {
       flex: 1;