fix(package-order): fix package memoization issue when searching

Author: jaebradley

.babelrc

@@ -5,7 +5,7 @@
   "plugins": [
     "@babel/transform-runtime",
     "@babel/transform-async-to-generator",
-    "@babel/plugin-proposal-object-rest-spread",
+    "@babel/plugin-proposal-object-rest-spread"
   ],
   "env": {
     "production": {

package-lock.json

@@ -43,6 +43,7 @@
     "@babel/runtime": "^7.0.0-beta.46",
     "axios": "^0.18.0",
     "chalk": "^2.3.2",
+    "child-process-promise": "^2.2.1",
     "commander": "^2.15.1",
     "inquirer": "^6.0.0",
     "inquirer-autocomplete-prompt": "^0.12.2",

package.json

@@ -11,26 +11,22 @@ class PackageSearchPrompter {
   constructor() {
     // goddamn hacky memoization
     this.packageDetailsMapping = {};
+    this.searchTerm = null;
   }
 
-  async getPackageDetails(searchTerm) {
-    const packageResults = await getSuggestions({ terms: [searchTerm] });
-
-    const packageDetailsMapping = {};
+  getPackageDetails(results) {
+    const choices = [];
     this.packageDetailsMapping = {};
-    // ensures that done searching option is selectable
-    const formattedPackageDetails = [DONE_SEARCHING];
-    this.packageDetailsMapping[DONE_SEARCHING] = DONE_SEARCHING;
 
-    packageResults.forEach((result) => {
+    results.forEach((result) => {
       const {
         name,
         version,
         description,
         publisher,
       } = result.package;
 
-      const author = publisher ? publisher.username : '';
+      const author = publisher && publisher.username ? publisher.username : '';
       const score = result && result.score ? result.score.final : null;
 
       const formattedDetails = formatPackageDetails({
@@ -41,13 +37,14 @@ class PackageSearchPrompter {
         score,
       });
 
-      formattedPackageDetails.push(formattedDetails);
-
-      packageDetailsMapping[formattedDetails] = { name, version };
+      this.packageDetailsMapping[formattedDetails] = { name, version };
+      choices.push(formattedDetails);
     });
 
-    this.packageDetailsMapping = packageDetailsMapping;
-    return formattedPackageDetails;
+    choices.push(DONE_SEARCHING);
+    this.packageDetailsMapping[DONE_SEARCHING] = DONE_SEARCHING;
+
+    return choices;
   }
 
   async prompt() {
@@ -56,14 +53,18 @@ class PackageSearchPrompter {
         type: 'autocomplete',
         name: 'npmPackage',
         message: 'Search for npm package',
-        source: async (answersSoFar, searchTerm) => {
-          if (!searchTerm) {
-            // ensures that done searching option is selectable
-            this.packageDetailsMapping[DONE_SEARCHING] = DONE_SEARCHING;
-            return [DONE_SEARCHING];
-          }
+        // eslint-disable-next-line consistent-return
+        source: async (_, searchTerm) => {
+          this.searchTerm = searchTerm;
+          const suggestions = searchTerm ? await getSuggestions({ terms: [searchTerm], size: 10 }) : [];
 
-          return this.getPackageDetails(searchTerm);
+          // first search will often return last
+          // so in order for memoization to work correctly, need to make sure
+          // only update package details when latest search term is equal to to searchTerm
+          // variable in the Promise
+          if (this.searchTerm === searchTerm) {
+            return Promise.resolve(this.getPackageDetails(suggestions));
+          }
         },
       },
     ]);

src/PackageSearchPrompter.js

@@ -1,4 +1,4 @@
-import { spawn } from 'child_process';
+import { spawn } from 'child-process-promise';
 
 const install = ({
   packages,