Merge pull request #50 from theolazian/update-to-v5

Update to openpgp v5.3.0 🚀

README.md

@@ -25,7 +25,7 @@ A free, light and easy to use client-side tool to generate PGP key pairs, encryp
 
 ## Library 📚
 
-OpenPGP.js (v4.10.10), a JavaScript implementation of the OpenPGP protocol. Find out more on [openpgpjs.org](https://openpgpjs.org/).
+OpenPGP.js (v5.3.0), a JavaScript implementation of the OpenPGP protocol. Find out more on [openpgpjs.org](https://openpgpjs.org/).
 
 ## Contributing 🍰
 

app/assets/stylesheets/index.scss

@@ -251,6 +251,6 @@ select option {
   display: inline-block;
 }
 
-.error, .warning {
+.error {
   font-weight: 300;
 }

app/javascript/controllers/keys_controller.js

@@ -1,5 +1,5 @@
 import { Controller } from "stimulus";
-import { generateKey } from "../model/crypto";
+import { generateMyKeys } from "../model/crypto";
 import { download, copy, showPass } from "../model/index";
 
 export default class extends Controller {
@@ -38,11 +38,11 @@ export default class extends Controller {
     const passphraseParams = this.passphraseParamsTarget.value;
     const curveParams = this.curveParamsTarget.value;
 
-    const key = await generateKey(emailParams, passphraseParams, curveParams).catch((err) => { console.error(err); });
+    const key = await generateMyKeys(emailParams, passphraseParams, curveParams).catch((err) => { console.error(err); });
 
     if (key) {
-      this.privateKeyTarget.innerText = key.privateKeyArmored;
-      this.publicKeyTarget.innerText = key.publicKeyArmored;
+      this.privateKeyTarget.innerText = key.privateKey;
+      this.publicKeyTarget.innerText = key.publicKey;
       this.initialStateTarget.classList.remove("d-none");
       this.errorTarget.classList.add("d-none");
       $([document.documentElement, document.body]).animate({

app/javascript/custom/aos.js

@@ -1,7 +1,6 @@
 import AOS from 'aos';
 
 document.addEventListener('DOMContentLoaded', function() {
-  console.log("Hello from aos.js");
   AOS.init({
     startEvent: 'turbolinks:load'
   });

app/javascript/custom/index.js

@@ -1,6 +1,4 @@
 $( document ).on('turbolinks:load', function() {
-  console.log("Hello from index.js");
-
   // Initiate bootstrap js
   $(function () {
     $('[data-toggle="popover"]').popover()

app/javascript/model/crypto.js

@@ -1,42 +1,44 @@
-export async function loadPGP() {
-  await import("../lib/openpgp");
-}
+import {
+  generateKey,
+  readKeys,
+  encrypt,
+  readMessage,
+  readPrivateKey,
+  decryptKey,
+  decrypt,
+  createMessage
+} from 'openpgp';
 
-export async function generateKey(emailParams, passphraseParams, curveParams) {
-  await loadPGP();
+export async function generateMyKeys(emailParams, passphraseParams, curveParams) {
   const name = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
   const email = emailParams;
   const passphrase = passphraseParams;
   const curve = curveParams;
-  return await openpgp.generateKey({
+  return await generateKey({
     curve: curveParams,
-    userIds: [{ name: name, email: email }],
-    passphrase: passphrase,
+    userIDs: [{ name: name, email: email }],
+    passphrase: passphrase
   });
 }
 
-export async function encryptText(text, key) {
-  await loadPGP();
-  const message = openpgp.message.fromText(text);
-  const publicKeyArmored = key;
+export async function encryptText(text, armoredKeys) {
+  const publicKeys = await readKeys({ armoredKeys });
 
-  const { data: encrypted } = await openpgp.encrypt({
-    message: message,
-    publicKeys: (await openpgp.key.readArmored(publicKeyArmored)).keys
+  const encrypted = await encrypt({
+    message: await createMessage({ text }),
+    encryptionKeys: publicKeys
   });
 
   return encrypted;
 }
 
-export async function decryptText(text, key, passphrase) {
-  await loadPGP();
-  const privateKeyArmored = key;
-  const { keys: [privateKey] } = await openpgp.key.readArmored(privateKeyArmored);
-  await privateKey.decrypt(passphrase);
+export async function decryptText(armoredMessage, armoredKey, passphrase) {
+  const privateKey = await readPrivateKey({ armoredKey });
+  const decryptedPrivateKey = await decryptKey({ privateKey, passphrase });
 
-  const { data: decrypted } = await openpgp.decrypt({
-      message: await openpgp.message.readArmored(text),
-      privateKeys: [privateKey]
+  const { data: decrypted } = await decrypt({
+      message: await readMessage({ armoredMessage }),
+      decryptionKeys: decryptedPrivateKey
   });
 
   return decrypted;

app/javascript/packs/application.js

@@ -27,4 +27,4 @@ import "@fortawesome/fontawesome-free/js/all";
 FontAwesome.config.mutateApproach = 'sync'
 
 // STIMULUS IMPORT
-import('controllers')
+import('controllers');

app/views/online_pgp_tool/_decrypt.html.erb

@@ -3,9 +3,6 @@
   <div class="row d-none error bg-danger rounded p-3 mb-4" data-target="decrypt.error">
     <span>An error has occured. Please verify the submitted data or try again later.</span>
   </div>
-  <div class="row warning bg-warning text-dark rounded p-3 mb-4">
-    <span>This tool will soon migrate to a new version of openPGP.js: the <kbd>brainpool</kbd> and <kbd>secp256k1</kbd> curves will no longer be supported for key generation, encryption and decryption.</span>
-  </div>
   <div class="row mb-3">
     <div class="col-lg-6">
         <label>Text to decrypt</label>

app/views/online_pgp_tool/_encrypt.html.erb

@@ -3,9 +3,6 @@
   <div class="row d-none error bg-danger rounded p-3 mb-4" data-target="encrypt.error">
     <span>An error has occured. Please verify the submitted data or try again later.</span>
   </div>
-  <div class="row warning bg-warning text-dark rounded p-3 mb-4">
-    <span>This tool will soon migrate to a new version of openPGP.js: the <kbd>brainpool</kbd> and <kbd>secp256k1</kbd> curves will no longer be supported for key generation, encryption and decryption.</span>
-  </div>
   <div class="row mb-3">
     <div class="col-lg-6">
       <label>Text to encrypt</label>

app/views/online_pgp_tool/_footer.html.erb

@@ -14,10 +14,13 @@
     </a>
   </div>
   <div class="row">
-    <div class="col-md-6">
-      Proudly based on <a href="https://openpgpjs.org/"target="_blank">Openpgp.js</a> 🚀
+    <div class="col-md-4 mb-3">
+      Proudly based on <a href="https://openpgpjs.org/" target="_blank">Openpgp.js</a> 🚀
     </div>
-    <div class="col-md-6">
+    <div class="col-md-4 mb-3">
+      ⚖️ Under <a href="https://github.com/aliceandbob-io/aliceandbob/blob/master/LICENSE" target="_blank">MIT License</a>
+    </div>
+    <div class="col-md-4 mb-3">
       Coded with ❤️ and ☕
     </div>
   </div>

app/views/online_pgp_tool/_generate.html.erb

@@ -3,9 +3,6 @@
   <div class="row d-none error bg-danger rounded p-3 mb-4" data-target="keys.error">
     <span>An error has occured. Please verify the submitted data or try again later.</span>
   </div>
-  <div class="row warning bg-warning text-dark rounded p-3 mb-4">
-    <span>This tool will soon migrate to a new version of openPGP.js: the <kbd>brainpool</kbd> and <kbd>secp256k1</kbd> curves will no longer be supported for key generation, encryption and decryption.</span>
-  </div>
   <div class="row mb-3">
     <div class="col">
       <div class="form-group mb-3">
@@ -28,17 +25,24 @@
       </div>
       <div class="form-group mb-3">
         <label>Curve encryption</label>
-        <div class="mb-2"><small class="text-muted">Choose the type of encryption for your key pair.</small></div>
+        <div class="mb-2">
+          <div><small class="text-muted">Choose the type of encryption for your key pair.</small></div>
+          <div><small class="text-muted">Brainpool and secp256k1 curves are no longer supported. <a href="https://github.com/openpgpjs/openpgpjs/pull/1395" target="_blank">See more</a></small></div>
+        </div>
         <select class="form-control" data-target="keys.curveParams">
           <option value="curve25519">curve25519</option>
           <option value="ed25519">ed25519</option>
           <option value="p256">p256</option>
           <option value="p384">p384</option>
           <option value="p521">p521</option>
-          <option value="brainpoolP256r1">brainpoolP256r1</option>
-          <option value="brainpoolP384r1">brainpoolP384r1</option>
-          <option value="brainpoolP512r1">brainpoolP512r1</option>
-          <option value="secp256k1">secp256k1</option>
+          <!-- Curves deprecated with openpgp.js v.5.0.0 -->
+          <!-- See https://github.com/openpgpjs/openpgpjs/pull/1395 -->
+          <!--
+            <option value="brainpoolP256r1">brainpoolP256r1</option>
+            <option value="brainpoolP384r1">brainpoolP384r1</option>
+            <option value="brainpoolP512r1">brainpoolP512r1</option>
+            <option value="secp256k1">secp256k1</option>
+          -->
         </select>
       </div>
     </div>

app/views/pages/_footer.html.erb

@@ -15,10 +15,13 @@
   </div>
 
   <div class="row">
-    <div class="col-md-6">
-      Proudly based on <a href="https://openpgpjs.org/"target="_blank">Openpgp.js</a> 🚀
+    <div class="col-md-4 mb-3">
+      Proudly based on <a href="https://openpgpjs.org/" target="_blank">Openpgp.js</a> 🚀
     </div>
-    <div class="col-md-6">
+    <div class="col-md-4 mb-3">
+      ⚖️ Under <a href="https://github.com/aliceandbob-io/aliceandbob/blob/master/LICENSE" target="_blank">MIT License</a>
+    </div>
+    <div class="col-md-4 mb-3">
       Coded with ❤️ and ☕
     </div>
   </div>

package.json

@@ -20,6 +20,7 @@
     "node": "12.x"
   },
   "devDependencies": {
+    "openpgp": "^5.3.0",
     "webpack-dev-server": "^3.11.0"
   }
 }

yarn.lock

@@ -1289,7 +1289,7 @@ array-unique@^0.3.2:
   resolved "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz"
   integrity sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=
 
-asn1.js@^5.2.0:
+asn1.js@^5.0.0, asn1.js@^5.2.0:
   version "5.4.1"
   resolved "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz"
   integrity sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==
@@ -4956,6 +4956,13 @@ once@^1.3.0, once@^1.3.1, once@^1.4.0:
   dependencies:
     wrappy "1"
 
+openpgp@^5.3.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/openpgp/-/openpgp-5.3.0.tgz#e8fc97e538865b8c095dbd91c7be4203bd1dd1df"
+  integrity sha512-qjCj0vYpV3dmmkE+vURiJ5kVAJwrMk8BPukvpWJiHcTNWKwPVsRS810plIe4klIcHVf1ScgUQwqtBbv99ff+kQ==
+  dependencies:
+    asn1.js "^5.0.0"
+
 opn@^5.5.0:
   version "5.5.0"
   resolved "https://registry.npmjs.org/opn/-/opn-5.5.0.tgz"