feat: redesign discover command with modern list layout

src/commands/discover.js

@@ -12,8 +12,8 @@
 
 const { Command, Flags } = require('@oclif/core')
 const inquirer = require('inquirer')
+const chalk = require('chalk')
 const { sortValues } = require('../helpers')
-const { printTable } = require('../table')
 
 /*
 This is how cordova does it:
@@ -24,6 +24,12 @@ future: use keywords ecosytem:aio-cli-plugin
 
 class DiscoCommand extends Command {
   async _install (plugins) {
+    const dateOptions = {
+      year: 'numeric',
+      month: 'long',
+      day: 'numeric'
+    }
+
     // get installed plugins
     const installedPlugins = this.config.commands.map(elem => {
       return elem.pluginName
@@ -34,8 +40,10 @@ class DiscoCommand extends Command {
         return !installedPlugins.includes(elem.name)
       })
       .map(elem => { // map to expected inquirer format
+        const date = new Date(elem.date).toLocaleDateString('en', dateOptions)
         return {
-          name: `${elem.name}@${elem.version}`,
+          name: `${chalk.bold(elem.name)} · ${elem.version} · ${date}\n    ${chalk.gray(elem.description)}`,
+          short: elem.name,
           value: elem.name
         }
       })
@@ -61,30 +69,19 @@ class DiscoCommand extends Command {
   }
 
   async _list (plugins) {
-    const options = {
+    const dateOptions = {
       year: 'numeric',
       month: 'long',
       day: 'numeric'
     }
 
-    const columns = {
-      name: {
-        width: 10,
-        get: row => `${row.name}`
-      },
-      version: {
-        minWidth: 10,
-        get: row => `${row.version}`
-      },
-      description: {
-        get: row => `${row.description}`
-      },
-      published: {
-        get: row => `${new Date(row.date).toLocaleDateString('en', options)}`
-      }
+    console.log(chalk.bold(`Discover plugins (${plugins.length})`))
+    console.log()
+    for (const plugin of plugins) {
+      const date = new Date(plugin.date).toLocaleDateString('en', dateOptions)
+      console.log(`  ● ${chalk.bold(plugin.name)} · ${plugin.version} · ${date}`)
+      console.log(`    ${chalk.gray(plugin.description)}`)
     }
-    // skip ones that aren't from us
-    printTable(plugins, columns)
   }
 
   async run () {

src/table.js

@@ -37,12 +37,12 @@ function printTable (data, columns) {
 
   const widths = headers.map((h, i) => {
     const min = Math.max(columns[h].minWidth || 0, columns[h].width || 0)
-    return Math.max(stringWidth(h), min, ...rows.map(r => stringWidth(r[i])))
+    return Math.max(stringWidth(h), min, ...rows.map(r => stringWidth(r[i]))) + 2
   })
 
-  console.log(headers.map((h, i) => padEndVisible(h, widths[i])).join('  '))
-  console.log(widths.map(w => '─'.repeat(w)).join('  '))
-  rows.forEach(row => console.log(row.map((c, i) => padEndVisible(c, widths[i])).join('  ')))
+  console.log(headers.map((h, i) => padEndVisible(h, widths[i])).join(''))
+  console.log(widths.map(w => '─'.repeat(w - 1)).join(' '))
+  rows.forEach(row => console.log(row.map((c, i) => padEndVisible(c, widths[i])).join('')))
 }
 
-module.exports = { printTable }
+module.exports = { printTable, padEndVisible }

test/commands/discover.test.js

@@ -60,31 +60,31 @@ describe('sorting', () => {
     await command.run()
     const splitOutput = stdout.output.split('\n')
     expect(splitOutput[2]).toMatch('@adobe/aio-cli-plugin-a') // @adobe/aio-cli-plugin-a is first
-    expect(splitOutput[3]).toMatch('@adobe/aio-cli-plugin-b') // @adobe/aio-cli-plugin-b is second
+    expect(splitOutput[4]).toMatch('@adobe/aio-cli-plugin-b') // @adobe/aio-cli-plugin-b is second
   })
 
   test('sort-field=name, descending', async () => {
     command.argv = ['--sort-field', 'name', '--sort-order', 'desc']
     await command.run()
     const splitOutput = stdout.output.split('\n')
     expect(splitOutput[2]).toMatch('@adobe/aio-cli-plugin-b') // @adobe/aio-cli-plugin-b is first
-    expect(splitOutput[3]).toMatch('@adobe/aio-cli-plugin-a') // @adobe/aio-cli-plugin-a is second
+    expect(splitOutput[4]).toMatch('@adobe/aio-cli-plugin-a') // @adobe/aio-cli-plugin-a is second
   })
 
   test('sort-field=date, ascending', async () => {
     command.argv = ['--sort-field', 'date', '--sort-order', 'asc']
     await command.run()
     const splitOutput = stdout.output.split('\n')
     expect(splitOutput[2]).toMatch('@adobe/aio-cli-plugin-a') // @adobe/aio-cli-plugin-a is first
-    expect(splitOutput[3]).toMatch('@adobe/aio-cli-plugin-b') // @adobe/aio-cli-plugin-b is second
+    expect(splitOutput[4]).toMatch('@adobe/aio-cli-plugin-b') // @adobe/aio-cli-plugin-b is second
   })
 
   test('sort-field=date, descending', async () => {
     command.argv = ['--sort-field', 'date', '--sort-order', 'desc']
     await command.run()
     const splitOutput = stdout.output.split('\n')
     expect(splitOutput[2]).toMatch('@adobe/aio-cli-plugin-b') // @adobe/aio-cli-plugin-b is first
-    expect(splitOutput[3]).toMatch('@adobe/aio-cli-plugin-a') // @adobe/aio-cli-plugin-a is second
+    expect(splitOutput[4]).toMatch('@adobe/aio-cli-plugin-a') // @adobe/aio-cli-plugin-a is second
   })
 })