feat(host/advanced): install a supplemental pack (#1895)

Fixes #1460

src/common/intl/messages.js

@@ -513,7 +513,14 @@ var messages = {
   hostLicenseSocket: 'Socket',
   hostLicenseExpiry: 'Expiry',
   supplementalPacks: 'Installed supplemental packs',
+  supplementalPackNew: 'Install new supplemental pack',
   supplementalPackTitle: '{name} (by {author})',
+  supplementalPackInstallStartedTitle: 'Installation started',
+  supplementalPackInstallStartedMessage: 'Installing new supplemental pack...',
+  supplementalPackInstallErrorTitle: 'Installation error',
+  supplementalPackInstallErrorMessage: 'The installation of the supplemental pack failed.',
+  supplementalPackInstallSuccessTitle: 'Installation success',
+  supplementalPackInstallSuccessMessage: 'Supplemental pack successfully installed.',
   // ----- Host net tabs -----
   networkCreateButton: 'Add a network',
   networkCreateBondedButton: 'Add a bonded network',

src/common/xo/index.js

@@ -485,6 +485,25 @@ export const installAllPatchesOnPool = pool => (
   _call('pool.installAllPatches', { pool: resolveId(pool) })
 )
 
+export const installSupplementalPack = (host, file) => {
+  info(_('supplementalPackInstallStartedTitle'), _('supplementalPackInstallStartedMessage'))
+
+  return _call('host.installSupplementalPack', { host: resolveId(host) }).then(({ $sendTo: url }) => (
+    request.post(url)
+      .send(file)
+      .then(res => {
+        if (res.status !== 200) {
+          throw new Error('installing supplemental pack failed')
+        }
+
+        success(_('supplementalPackInstallSuccessTitle'), _('supplementalPackInstallSuccessMessage'))
+      }).catch(err => {
+        error(_('supplementalPackInstallErrorTitle'), _('supplementalPackInstallErrorMessage'))
+        throw err
+      })
+  ))
+}
+
 // Containers --------------------------------------------------------
 
 export const pauseContainer = (vm, container) => (

src/xo-app/host/tab-advanced.js

@@ -2,14 +2,17 @@ import _ from 'intl'
 import Copiable from 'copiable'
 import React from 'react'
 import TabButton from 'tab-button'
+import Upgrade from 'xoa-upgrade'
 import { Toggle } from 'form'
-import { enableHost, detachHost, disableHost, restartHost } from 'xo'
+import { enableHost, detachHost, disableHost, restartHost, installSupplementalPack } from 'xo'
 import { FormattedRelative, FormattedTime } from 'react-intl'
 import { Container, Row, Col } from 'grid'
 import {
   map
 } from 'lodash'
 
+const ALLOW_INSTALL_SUPP_PACK = process.env.XOA_PLAN > 1
+
 const forceReboot = host => restartHost(host, true)
 
 const formatPack = (version, pack) => {
@@ -170,8 +173,21 @@ export default ({
       <table className='table'>
         <tbody>
           {map(host.supplementalPacks, formatPack)}
+          {ALLOW_INSTALL_SUPP_PACK && <tr>
+            <th>{_('supplementalPackNew')}</th>
+            <td>
+              <input
+                type='file'
+                onChange={e => installSupplementalPack(host, e.target.files[0])}
+              />
+            </td>
+          </tr>}
         </tbody>
       </table>
+      {!ALLOW_INSTALL_SUPP_PACK && [
+        <h3>{_('supplementalPackNew')}</h3>,
+        <Container><Upgrade place='supplementalPacks' available={2} /></Container>
+      ]}
     </Col>
   </Row>
 </Container>