fix(packages): Show version numbr of 3rd party plugins

internal_packages/plugins/lib/package-set.jsx

@@ -9,13 +9,14 @@ class PackageSet extends React.Component {
     title: React.PropTypes.string.isRequired,
     packages: React.PropTypes.array,
     emptyText: React.PropTypes.element,
+    showVersions: React.PropTypes.bool,
   }
 
   render() {
     if (!this.props.packages) return false;
 
     const packages = this.props.packages.map((pkg) =>
-      <Package key={pkg.name} package={pkg} />
+      <Package key={pkg.name} package={pkg} showVersions={this.props.showVersions} />
     );
     let count = <span>({this.props.packages.length})</span>
 

internal_packages/plugins/lib/package.jsx

@@ -9,7 +9,8 @@ class Package extends React.Component {
   static displayName = 'Package';
 
   static propTypes = {
-    'package': React.PropTypes.object.isRequired,
+    "package": React.PropTypes.object.isRequired,
+    "showVersions": React.PropTypes.bool,
   }
 
   _onDisablePackage = () => {
@@ -68,7 +69,7 @@ class Package extends React.Component {
       actions.push(<div key="install" className="btn" onClick={this._onInstallPackage}>Install</div>);
     }
 
-    const {name, description, title} = this.props.package;
+    const {name, description, title, version} = this.props.package;
 
     if (this.props.package.newerVersionAvailable) {
       extras.push(
@@ -79,6 +80,8 @@ class Package extends React.Component {
       )
     }
 
+    const versionLabel = this.props.showVersions ? `v${version}` : null;
+
     return (
       <Flexbox className="package" direction="row">
         <div className="icon-container">
@@ -86,7 +89,7 @@ class Package extends React.Component {
         </div>
         <div className="info">
           <div style={{display: "flex", flexDirection: "row"}}>
-            <div className="title">{title || name}</div>
+            <div className="title">{title || name} <span className="version">{versionLabel}</span></div>
             {uninstallButton}
           </div>
           <div className="description">{description}</div>

internal_packages/plugins/lib/tab-installed.jsx

@@ -90,6 +90,7 @@ class TabInstalled extends React.Component {
           </Flexbox>
           <PackageSet
             packages={this.state.packages.user}
+            showVersions
             title="Installed plugins"
             emptyText={searchEmpty || <span>{`You don't have any plugins installed in ~/.nylas/packages.`}</span>}
           />

internal_packages/plugins/stylesheets/plugins.less

@@ -94,6 +94,12 @@
         overflow: hidden;
         text-overflow: ellipsis;
       }
+      .version {
+        font-size: @font-size-small;
+        font-weight: @font-weight-normal;
+        margin-left: 10px;
+        margin-top: 4px;
+      }
       .uninstall-plugin {
         color: @text-color-link;
         margin-left: 10px;