Remove torrent/data confirmation modal

renderer/controllers/torrent-list-controller.js

@@ -112,6 +112,14 @@ module.exports = class TorrentListController {
     ipcRenderer.send('wt-select-files', infoHash, torrentSummary.selections)
   }
 
+  confirmDeleteTorrent (infoHash, deleteData) {
+    this.state.modal = {
+      id: 'remove-torrent-modal',
+      infoHash,
+      deleteData
+    }
+  }
+
   // TODO: use torrentKey, not infoHash
   deleteTorrent (infoHash, deleteData) {
     ipcRenderer.send('wt-stop-torrenting', infoHash)
@@ -151,14 +159,12 @@ module.exports = class TorrentListController {
 
     menu.append(new electron.remote.MenuItem({
       label: 'Remove From List',
-      click: () => this.deleteTorrent(
-        torrentSummary.infoHash, false)
+      click: dispatch('confirmDeleteTorrent', torrentSummary.infoHash, false)
     }))
 
     menu.append(new electron.remote.MenuItem({
       label: 'Remove Data File',
-      click: () => this.deleteTorrent(
-        torrentSummary.infoHash, true)
+      click: dispatch('confirmDeleteTorrent', torrentSummary.infoHash, true)
     }))
 
     menu.append(new electron.remote.MenuItem({

renderer/main.css

@@ -326,7 +326,6 @@ table {
 }
 
 .create-torrent input.torrent-is-private {
-  width: initial;
   margin: 0;
 }
 
@@ -404,7 +403,7 @@ button.button-raised:active {
  * OTHER FORM ELEMENT DEFAULTS
  */
 
-input {
+input[type='text'] {
   background: transparent;
   width: 300px;
   padding: 6px;

renderer/main.js

@@ -178,7 +178,8 @@ const dispatchHandlers = {
   'createTorrent': (options) => controllers.torrentList.createTorrent(options),
   'toggleTorrent': (infoHash) => controllers.torrentList.toggleTorrent(infoHash),
   'toggleTorrentFile': (infoHash, index) => controllers.torrentList.toggleTorrentFile(infoHash, index),
-  'deleteTorrent': (infoHash) => controllers.torrentList.deleteTorrent(infoHash),
+  'confirmDeleteTorrent': (infoHash, deleteData) => controllers.torrentList.confirmDeleteTorrent(infoHash, deleteData),
+  'deleteTorrent': (infoHash, deleteData) => controllers.torrentList.deleteTorrent(infoHash, deleteData),
   'toggleSelectTorrent': (infoHash) => controllers.torrentList.toggleSelectTorrent(infoHash),
   'openTorrentContextMenu': (infoHash) => controllers.torrentList.openTorrentContextMenu(infoHash),
   'startTorrentingSummary': (torrentSummary) =>

renderer/views/app.js

@@ -12,6 +12,7 @@ var Views = {
 
 var Modals = {
   'open-torrent-address-modal': require('./open-torrent-address-modal'),
+  'remove-torrent-modal': require('./remove-torrent-modal'),
   'update-available-modal': require('./update-available-modal'),
   'unsupported-media-modal': require('./unsupported-media-modal')
 }

renderer/views/remove-torrent-modal.js

@@ -0,0 +1,26 @@
+module.exports = RemoveTorrentModal
+
+var {dispatch, dispatcher} = require('../lib/dispatcher')
+var hx = require('../lib/hx')
+
+function RemoveTorrentModal (state) {
+  var message = state.modal.deleteData
+    ? 'Are you sure you want to remove this torrent from the list and delete the data file?'
+    : 'Are you sure you want to remove this torrent from the list?'
+  var buttonText = state.modal.deleteData ? 'Remove Data' : 'Remove'
+
+  return hx`
+    <div>
+      <p><strong>${message}</strong></p>
+      <p class='float-right'>
+        <button class='button button-flat' onclick=${dispatcher('exitModal')}>Cancel</button>
+        <button class='button button-raised' onclick=${handleRemove}>${buttonText}</button>
+      </p>
+    </div>
+  `
+
+  function handleRemove () {
+    dispatch('deleteTorrent', state.modal.infoHash, state.modal.deleteData)
+    dispatch('exitModal')
+  }
+}

renderer/views/torrent-list.js

@@ -172,7 +172,7 @@ function TorrentList (state) {
         <i
           class='icon delete'
           title='Remove torrent'
-          onclick=${dispatcher('deleteTorrent', infoHash)}>
+          onclick=${dispatcher('confirmDeleteTorrent', infoHash, false)}>
           close
         </i>
       </div>