feat(vm): edition of number of CPUs (#984)

src/common/editable.js

@@ -208,6 +208,15 @@ export class Text extends Editable {
   }
 }
 
+@propTypes({
+  value: propTypes.number.isRequired
+})
+export class Number extends Text {
+  get value () {
+    return +this.refs.input.value
+  }
+}
+
 @propTypes({
   labelProp: propTypes.string.isRequired,
   options: propTypes.oneOfType([

src/xo-app/vm/tab-general.js

@@ -7,7 +7,7 @@ import Tags from 'tags'
 import { addTag, editVm, removeTag } from 'xo'
 import { FormattedRelative } from 'react-intl'
 import { Row, Col } from 'grid'
-import { Size } from 'editable'
+import { Number, Size } from 'editable'
 import {
   BlockLink,
   formatSize,
@@ -29,7 +29,7 @@ export default ({
   <br />
   <Row className='text-xs-center'>
     <Col mediumSize={3}>
-      <h2>{vm.CPUs.number}x <Icon icon='cpu' size='lg' /></h2>
+      <h2><Number value={vm.CPUs.number} onChange={vcpus => editVm(vm, { CPUs: vcpus })} />x <Icon icon='cpu' size='lg' /></h2>
       <BlockLink to={`/vms/${vm.id}/stats`}>{statsOverview && <CpuSparkLines data={statsOverview} />}</BlockLink>
     </Col>
     <Col mediumSize={3}>