updated password input UI

app/templates/setPasswordSection/index.js

@@ -3,10 +3,13 @@ const passwordInput = require('../passwordInput');
 
 module.exports = function(state, emit) {
   const file = state.storage.getFileById(state.params.id);
-  const div = html`
+
+  return html`
   <div class="setPasswordSection">
     <div class="checkbox">
       <input
+        ${file.hasPassword ? 'disabled' : ''}
+        ${file.hasPassword ? 'checked' : ''}
         class="checkbox__input"
         id="add-password"
         type="checkbox"
@@ -16,22 +19,9 @@ module.exports = function(state, emit) {
         ${state.translate('requirePasswordCheckbox')}
       </label>
     </div>
-    ${passwordInput(
-      state.translate('unlockInputPlaceholder'),
-      state.translate('addPasswordButton'),
-      addPassword
-    )}
+    ${passwordInput(file, state, emit)}
   </div>`;
 
-  function addPassword(event) {
-    event.preventDefault();
-    const password = document.getElementById('password-input').value;
-    if (password.length > 0) {
-      emit('password', { password, file });
-    }
-    return false;
-  }
-
   function togglePasswordInput(e) {
     const unlockInput = document.getElementById('password-input');
     const boxChecked = e.target.checked;
@@ -44,6 +34,4 @@ module.exports = function(state, emit) {
       unlockInput.value = '';
     }
   }
-
-  return div;
 };