fix delete 2 repos in a row (#236)

* fix delete 2 repos in a row * major refactor of modal handling * standard * format
dat-ecosystem-archive · Feb 16, 2017 · 9c5da6a · 9c5da6a
1 parent fcbfe7c
commit 9c5da6a
Show file tree

Hide file tree

Showing 11 changed files with 39 additions and 191 deletions.
diff --git a/app.js b/app.js
@@ -36,15 +36,11 @@ persist(opts, (p) => {
 
   app.router([
     ['/', params({
-      default: require('./pages/main'),
-      crash: require('./pages/main-crash'),
-      error: require('./pages/main-error'),
-      share: require('./pages/main-share'),
-      delete: require('./pages/main-delete')
+      default: require('./pages/main')
     })]
   ])
 
-  mount('body', app.start())
+  mount('body div', app.start())
 })
 
 function onError (action) {

diff --git a/elements/confirm-modal.js b/elements/confirm-modal.js
@@ -34,11 +34,13 @@ module.exports = createWidget
 function createWidget () {
   return Modal({
     render: render,
-    onexit: onexit
+    onexit: onexit,
+    class: 'modal'
   })
 
   function onexit () {
-    window.history.back()
+    const el = document.querySelector('.modal')
+    if (el) el.parentNode.removeChild(el)
   }
 
   function render (cb) {

diff --git a/elements/link-modal.js b/elements/link-modal.js
@@ -120,12 +120,18 @@ function createModal () {
   let link = ''
   let el = ''
 
-  const modal = Modal({ onunload, onexit, render })
+  const modal = Modal({
+    onunload: onunload,
+    onexit: onexit,
+    render: render,
+    class: 'modal'
+  })
 
   return modal
 
   function onexit () {
-    window.history.back()
+    const el = document.querySelector('.modal')
+    if (el) el.parentNode.removeChild(el)
   }
 
   function onunload () {

diff --git a/index.html b/index.html
@@ -5,6 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
   </head>
   <body>  
+    <div></div>
     <script>require('./bundle')</script>
   </body>
 </html>
diff --git a/models/error.js b/models/error.js
@@ -1,6 +1,8 @@
 const version = require('../package.json').version
 const ipc = require('electron').ipcRenderer
 const xhr = require('xhr')
+const CrashModal = require('../elements/crash-modal')
+const ErrorModal = require('../elements/error-modal')
 
 module.exports = model
 
@@ -16,27 +18,13 @@ function model () {
     effects: {
       display: display,
       quit: quit
-    },
-    reducers: {
-      clear: clear,
-      set: set
     }
   }
 }
 
-function set (state, error) {
-  return { message: error }
-}
-
-function clear () {
-  return { message: null }
-}
-
 function display (state, error, send, done) {
-  send('error:set', error, function (err) {
-    if (err) return done(err)
-    send('location:set', '?error=true', done)
-  })
+  const modal = ErrorModal()(error.message)
+  document.body.appendChild(modal)
 }
 
 function onUncaughtException (send, done) {
@@ -59,7 +47,11 @@ function onUncaughtException (send, done) {
     xhr(opts, function (err) {
       if (err) console.error(err)
     })
-    send('location:set', '?crash=true', done)
+
+    const modal = CrashModal()(() => {
+      send('error:quit', done)
+    })
+    document.body.appendChild(modal)
 
     err._thrown = true
     throw err

diff --git a/models/repos.js b/models/repos.js
@@ -11,6 +11,8 @@ const assert = require('assert')
 const mkdirp = require('mkdirp')
 const open = require('open')
 const path = require('path')
+const ConfirmModal = require('../elements/confirm-modal')
+const LinkModal = require('../elements/link-modal')
 
 module.exports = createModel
 
@@ -35,7 +37,6 @@ function createModel () {
       onIpc: handleIpc
     },
     reducers: {
-      setRemovalKey: setRemovalKey,
       ready: multidatReady,
       update: updateDats
     },
@@ -86,10 +87,6 @@ function createModel () {
     waterfall(tasks, done)
   }
 
-  function setRemovalKey (state, key) {
-    return { removalKey: key }
-  }
-
   // share state with external model
   function shareState (state, data, send, done) {
     done(null, state)
@@ -135,31 +132,19 @@ function createModel () {
   }
 
   function removeDat (state, data, send, done) {
-    if (!data.confirmed) {
-      assert.ok(data.key, 'repos-model.deleteDat: data.key should exist')
-      const encodedKey = encoding.encode(data.key)
-      const uri = window.location.href + '?delete=' + encodedKey
-      const key = encoding.toStr(data.key)
-      send('repos:setRemovalKey', key, function (err) {
-        if (err) return done(err)
-        send('location:set', uri, done)
-      })
-    } else {
-      // removalKey is a temporary hack because the callback in the modal is
-      // referencing the wrong onclick event
-      var key = state.removalKey
-      send('repos:setRemovalKey', null, function (err) {
-        if (err) return done(err)
-        manager.close(key, done)
-      })
-    }
+    const key = data.key
+    const modal = ConfirmModal()(function () {
+      manager.close(key, done)
+    })
+    document.body.appendChild(modal)
   }
 
   // copy a dat share link to clipboard and open a modal
   function shareDat (state, data, send, done) {
     assert.ok(data.key, 'repos-model.shareDat: data.key should exist')
     const encodedKey = encoding.encode(data.key)
-    send('location:set', `?share=${encodedKey}`, done)
+    const modal = LinkModal()(encodedKey)
+    document.body.appendChild(modal)
   }
 
   function cloneDat (state, data, send, done) {

diff --git a/pages/main-crash.js b/pages/main-crash.js
diff --git a/pages/main-delete.js b/pages/main-delete.js
diff --git a/pages/main-error.js b/pages/main-error.js
diff --git a/pages/main-share.js b/pages/main-share.js
diff --git a/pages/main.js b/pages/main.js
@@ -86,31 +86,31 @@ function mainView (state, prev, send) {
   if (showWelcomeScreen) {
     document.title = 'Dat Desktop | Welcome'
     return html`
-      <body>
+      <div>
         ${sprite()}
         ${WelcomeScreen({
           onexit: () => send('mainView:toggleWelcomeScreen', { toggle: false })
         })}
-      </body>
+      </div>
     `
   }
 
   if (!dats.length) {
     return html`
-      <body>
+      <div>
         ${sprite()}
         ${header}
         ${EmptyState()}
-      </body>
+      </div>
     `
   }
 
   return html`
-    <body>
+    <div>
       ${sprite()}
       ${header}
       ${Table(dats, send)}
-    </body>
+    </div>
   `
 }