chore(xo-web): mutualize chain decoration

2018-10-30 18:40:21 +01:00
parent 63acc7ef32
commit 675763d039
20 changed files with 70 additions and 48 deletions
--- a/packages/xo-web/src/common/apply-decorators.js
+++ b/packages/xo-web/src/common/apply-decorators.js
@@ -0,0 +1,2 @@
+const apply = (value, fn) => fn(value)
+export default fns => fns.reduceRight(apply)
--- a/packages/xo-web/src/common/form/number.js
+++ b/packages/xo-web/src/common/form/number.js
@@ -2,7 +2,9 @@ import PropTypes from 'prop-types'
 import React from 'react'
 import { injectState, provideState } from 'reaclette'

-const Number_ = [
+import decorate from '../apply-decorators'
+
+const Number_ = decorate([
  provideState({
    effects: {
      onChange: (_, { target: { value } }) => (state, props) => {
@@ -30,7 +32,7 @@ const Number_ = [
      value={value === undefined ? '' : String(value)}
    />
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 Number_.propTypes = {
  onChange: PropTypes.func.isRequired,
--- a/packages/xo-web/src/common/modal.js
+++ b/packages/xo-web/src/common/modal.js
@@ -9,6 +9,7 @@ import { Modal as ReactModal } from 'react-bootstrap-4/lib'
 import _, { messages } from './intl'
 import ActionButton from './action-button'
 import Button from './button'
+import decorate from './apply-decorators'
 import getEventValue from './get-event-value'
 import Icon from './icon'
 import Tooltip from './tooltip'
@@ -295,7 +296,7 @@ const getInitialState = () => ({
  size: undefined,
  value: undefined,
 })
-export const FormModal = [
+export const FormModal = decorate([
  provideState({
    initialState: getInitialState,
    effects: {
@@ -381,7 +382,7 @@ export const FormModal = [
      </ReactModal.Footer>
    </ReactModal>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 // -----------------------------------------------------------------------------

--- a/packages/xo-web/src/common/render-xo-item.js
+++ b/packages/xo-web/src/common/render-xo-item.js
@@ -4,6 +4,7 @@ import React from 'react'
 import { get } from '@xen-orchestra/defined'
 import { startsWith } from 'lodash'

+import decorate from './apply-decorators'
 import Icon from './icon'
 import Link from './link'
 import { addSubscriptions, connectStore, formatSize } from './utils'
@@ -49,7 +50,7 @@ const XO_ITEM_PROP_TYPES = {
  id: PropTypes.string.isRequired,
 }

-export const VmItem = [
+export const VmItem = decorate([
  connectStore(() => {
    const getVm = createGetObject()
    return {
@@ -71,11 +72,11 @@ export const VmItem = [
      )}
    </XoItem>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 VmItem.propTypes = XO_ITEM_PROP_TYPES

-export const SrItem = [
+export const SrItem = decorate([
  connectStore(() => {
    const getSr = createGetObject()
    return {
@@ -100,11 +101,11 @@ export const SrItem = [
      )}
    </XoItem>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 SrItem.propTypes = XO_ITEM_PROP_TYPES

-export const RemoteItem = [
+export const RemoteItem = decorate([
  addSubscriptions(({ id }) => ({
    remote: cb =>
      subscribeRemotes(remotes => {
@@ -120,11 +121,11 @@ export const RemoteItem = [
      )}
    </XoItem>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 RemoteItem.propTypes = XO_ITEM_PROP_TYPES

-export const PoolItem = [
+export const PoolItem = decorate([
  connectStore(() => ({
    pool: createGetObject(),
  })),
@@ -137,13 +138,13 @@ export const PoolItem = [
      )}
    </XoItem>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 PoolItem.propTypes = XO_ITEM_PROP_TYPES

 // ===================================================================

-export const SrResourceSetItem = [
+export const SrResourceSetItem = decorate([
  connectStore(() => {
    const getSr = createGetObject()
    return (state, props) => ({
@@ -163,7 +164,7 @@ export const SrResourceSetItem = [
      )}
    </XoItem>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 SrResourceSetItem.propTypes = XO_ITEM_PROP_TYPES

--- a/packages/xo-web/src/common/scheduling.js
+++ b/packages/xo-web/src/common/scheduling.js
@@ -9,6 +9,7 @@ import { flatten, forEach, identity, isArray, map, sortedIndex } from 'lodash'
 import _ from './intl'
 import Button from './button'
 import Component from './base-component'
+import decorate from './apply-decorators'
 import TimezonePicker from './timezone-picker'
 import Tooltip from './tooltip'
 import { Card, CardHeader, CardBlock } from './card'
@@ -189,7 +190,7 @@ class ToggleTd extends Component {

 // ===================================================================

-const TableSelect = [
+const TableSelect = decorate([
  provideState({
    effects: {
      onChange: (_, tdId, add) => (_, { value, onChange, options }) => {
@@ -244,7 +245,7 @@ const TableSelect = [
      </div>
    )
  },
-].reduceRight((value, decorator) => decorator(value))
+])

 TableSelect.propTypes = {
  labelId: PropTypes.string.isRequired,
@@ -256,7 +257,7 @@ TableSelect.propTypes = {

 // ===================================================================

-const TimePicker = [
+const TimePicker = decorate([
  provideState({
    effects: {
      onChange: (_, value) => ({ optionsValues }, { onChange }) => {
@@ -318,7 +319,7 @@ const TimePicker = [
      </CardBlock>
    </Card>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 TimePicker.propTypes = {
  headerAddon: PropTypes.node,
--- a/packages/xo-web/src/common/sorted-table/index.js
+++ b/packages/xo-web/src/common/sorted-table/index.js
@@ -30,6 +30,7 @@ import ActionRowButton from '../action-row-button'
 import Button from '../button'
 import ButtonGroup from '../button-group'
 import Component from '../base-component'
+import decorate from '../apply-decorators'
 import Icon from '../icon'
 import Pagination from '../pagination'
 import SingleLineRow from '../single-line-row'
@@ -210,7 +211,7 @@ const actionsShape = PropTypes.arrayOf(
  })
 )

-const IndividualAction = [
+const IndividualAction = decorate([
  provideState({
    computed: {
      disabled: ({ item }, { disabled, userData }) =>
@@ -239,7 +240,7 @@ const IndividualAction = [
      tooltip={state.label}
    />
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 class GroupedAction extends Component {
  _getIsDisabled = createSelector(
--- a/packages/xo-web/src/xo-app/backup-ng/edit.js
+++ b/packages/xo-web/src/xo-app/backup-ng/edit.js
@@ -1,4 +1,5 @@
 import addSubscriptions from 'add-subscriptions'
+import decorate from 'apply-decorators'
 import React from 'react'
 import { injectState, provideState } from 'reaclette'
 import { subscribeBackupNgJobs, subscribeSchedules } from 'xo'
@@ -6,7 +7,7 @@ import { find, groupBy, keyBy } from 'lodash'

 import New from './new'

-export default [
+export default decorate([
  addSubscriptions({
    jobs: subscribeBackupNgJobs,
    schedulesByJob: cb =>
@@ -23,4 +24,4 @@ export default [
  }),
  injectState,
  ({ state: { job, schedules } }) => <New job={job} schedules={schedules} />,
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/backup-ng/new/index.js
+++ b/packages/xo-web/src/xo-app/backup-ng/new/index.js
@@ -1,5 +1,6 @@
 import _, { messages } from 'intl'
 import ActionButton from 'action-button'
+import decorate from 'apply-decorators'
 import defined, { get } from '@xen-orchestra/defined'
 import Icon from 'icon'
 import Link from 'link'
@@ -182,7 +183,7 @@ const DeleteOldBackupsFirst = ({ handler, handlerParam, value }) => (
  </ActionButton>
 )

-export default [
+export default decorate([
  New => props => (
    <Upgrade place='newBackup' required={2}>
      <New {...props} />
@@ -1022,4 +1023,4 @@ export default [
      </form>
    )
  },
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/backup-ng/new/new-schedule.js
+++ b/packages/xo-web/src/xo-app/backup-ng/new/new-schedule.js
@@ -1,4 +1,5 @@
 import _ from 'intl'
+import decorate from 'apply-decorators'
 import React from 'react'
 import Scheduler, { SchedulePreview } from 'scheduling'
 import { Card, CardBlock } from 'card'
@@ -8,7 +9,7 @@ import { Number } from 'form'

 import { FormGroup, Input } from './../utils'

-export default [
+export default decorate([
  provideState({
    initialState: () => ({
      formId: generateRandomId(),
@@ -117,4 +118,4 @@ export default [
      </CardBlock>
    </Card>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/backup-ng/new/schedules.js
+++ b/packages/xo-web/src/xo-app/backup-ng/new/schedules.js
@@ -1,5 +1,6 @@
 import _ from 'intl'
 import ActionButton from 'action-button'
+import decorate from 'apply-decorators'
 import React from 'react'
 import SortedTable from 'sorted-table'
 import StateButton from 'state-button'
@@ -18,7 +19,7 @@ const FEEDBACK_ERRORS = [
  'missingSnapshotRetention',
 ]

-export default [
+export default decorate([
  injectState,
  provideState({
    computed: {
@@ -148,4 +149,4 @@ export default [
      </FormFeedback>
    </div>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/backup-ng/new/smart-backup.js
+++ b/packages/xo-web/src/xo-app/backup-ng/new/smart-backup.js
@@ -1,4 +1,5 @@
 import _ from 'intl'
+import decorate from 'apply-decorators'
 import Icon from 'icon'
 import React from 'react'
 import SmartBackupPreview from 'smart-backup'
@@ -18,7 +19,7 @@ const VMS_STATUSES_OPTIONS = [
  { value: 'Halted', label: _('vmStateHalted') },
 ]

-export default [
+export default decorate([
  connectStore({
    vms: createGetObjectsOfType('VM'),
  }),
@@ -87,4 +88,4 @@ export default [
      <SmartBackupPreview vms={vms} pattern={state.vmsSmartPattern} />
    </div>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/dashboard/health/index.js
+++ b/packages/xo-web/src/xo-app/dashboard/health/index.js
@@ -1,5 +1,6 @@
 import _ from 'intl'
 import Component from 'base-component'
+import decorate from 'apply-decorators'
 import fromCallback from 'promise-toolbox/fromCallback'
 import Icon from 'icon'
 import Link from 'link'
@@ -184,7 +185,7 @@ const CONTROL_DOMAIN_VDIS_ACTIONS = [
  },
 ]

-const AttachedVdisTable = [
+const AttachedVdisTable = decorate([
  connectStore({
    pools: createGetObjectsOfType('pool'),
    srs: createGetObjectsOfType('SR'),
@@ -270,7 +271,7 @@ const AttachedVdisTable = [
      }
    },
  },
-].reduceRight((value, decorator) => decorator(value))
+])

 const VM_COLUMNS = [
  {
--- a/packages/xo-web/src/xo-app/logs/backup-ng-logs.js
+++ b/packages/xo-web/src/xo-app/logs/backup-ng-logs.js
@@ -1,6 +1,7 @@
 import _, { FormattedDuration } from 'intl'
 import addSubscriptions from 'add-subscriptions'
 import Button from 'button'
+import decorate from 'apply-decorators'
 import defined, { get } from '@xen-orchestra/defined'
 import Icon from 'icon'
 import NoObjects from 'no-objects'
@@ -270,7 +271,7 @@ const TenPerPage = ({ name, handler, value }) => (
  </Button>
 )

-export default [
+export default decorate([
  connectStore({
    srs: createGetObjectsOfType('SR'),
    vms: createGetObjectsOfType('VM'),
@@ -344,4 +345,4 @@ export default [
      </CardBlock>
    </Card>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/logs/index.js
+++ b/packages/xo-web/src/xo-app/logs/index.js
@@ -2,6 +2,7 @@ import _, { FormattedDuration } from 'intl'
 import addSubscriptions from 'add-subscriptions'
 import BaseComponent from 'base-component'
 import classnames from 'classnames'
+import decorate from 'apply-decorators'
 import Icon from 'icon'
 import NoObjects from 'no-objects'
 import PropTypes from 'prop-types'
@@ -427,7 +428,7 @@ const LOG_FILTERS = {
  jobCallSkipped: '!hasErrors? callSkipped?',
 }

-const Logs = [
+const Logs = decorate([
  addSubscriptions(({ jobKeys }) => ({
    logs: cb =>
      subscribeJobsLogs(rawLogs => {
@@ -527,7 +528,7 @@ const Logs = [
      </CardBlock>
    </Card>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 Logs.propTypes = {
  jobKeys: PropTypes.array,
--- a/packages/xo-web/src/xo-app/logs/log-alert-body.js
+++ b/packages/xo-web/src/xo-app/logs/log-alert-body.js
@@ -1,5 +1,6 @@
 import _, { FormattedDuration } from 'intl'
 import ActionButton from 'action-button'
+import decorate from 'apply-decorators'
 import Icon from 'icon'
 import React from 'react'
 import Select from 'form/select'
@@ -72,7 +73,7 @@ const UNHEALTHY_VDI_CHAIN_ERROR = 'unhealthy VDI chain'
 const UNHEALTHY_VDI_CHAIN_LINK =
  'https://xen-orchestra.com/docs/backup_troubleshooting.html#vdi-chain-protection'

-export default [
+export default decorate([
  addSubscriptions(({ id }) => ({
    remotes: cb =>
      subscribeRemotes(remotes => {
@@ -422,4 +423,4 @@ export default [
      </div>
    )
  },
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/logs/log-alert-header.js
+++ b/packages/xo-web/src/xo-app/logs/log-alert-header.js
@@ -4,6 +4,7 @@ import addSubscriptions from 'add-subscriptions'
 import Button from 'button'
 import ButtonGroup from 'button-group'
 import CopyToClipboard from 'react-copy-to-clipboard'
+import decorate from 'apply-decorators'
 import Icon from 'icon'
 import React from 'react'
 import ReportBugButton, { CAN_REPORT_BUG } from 'report-bug-button'
@@ -15,7 +16,7 @@ import { runBackupNgJob, subscribeBackupNgLogs } from 'xo'
 const isFailureTask = ({ status }) =>
  status !== 'success' && status !== 'pending'

-export default [
+export default decorate([
  addSubscriptions(({ id }) => ({
    log: cb =>
      subscribeBackupNgLogs(logs => {
@@ -76,4 +77,4 @@ export default [
      </ButtonGroup>
    </span>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/settings/acls/index.js
+++ b/packages/xo-web/src/xo-app/settings/acls/index.js
@@ -2,6 +2,7 @@ import _ from 'intl'
 import ActionButton from 'action-button'
 import ButtonGroup from 'button-group'
 import Component from 'base-component'
+import decorate from 'apply-decorators'
 import filter from 'lodash/filter'
 import forEach from 'lodash/forEach'
 import isEmpty from 'lodash/isEmpty'
@@ -80,7 +81,7 @@ const ACL_ACTIONS = [
  },
 ]

-const AclTable = [
+const AclTable = decorate([
  connectStore({
    hosts: createGetObjectsOfType('host'),
    networks: createGetObjectsOfType('network'),
@@ -130,7 +131,7 @@ const AclTable = [
      columns={ACL_COLUMNS}
    />
  ),
-].reduceRight((value, decorator) => decorator(value))
+])

 export default class Acls extends Component {
  constructor (props) {
--- a/packages/xo-web/src/xo-app/settings/cloud-configs/index.js
+++ b/packages/xo-web/src/xo-app/settings/cloud-configs/index.js
@@ -1,5 +1,6 @@
 import _ from 'intl'
 import ActionButton from 'action-button'
+import decorate from 'apply-decorators'
 import defined from '@xen-orchestra/defined'
 import React from 'react'
 import SortedTable from 'sorted-table'
@@ -63,7 +64,7 @@ const initialParams = {
  template: undefined,
 }

-export default [
+export default decorate([
  addSubscriptions({
    cloudConfigs: subscribeCloudConfigs,
  }),
@@ -189,4 +190,4 @@ export default [
      </Col>
    </Container>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/settings/remotes/index.js
+++ b/packages/xo-web/src/xo-app/settings/remotes/index.js
@@ -1,5 +1,6 @@
 import _, { messages } from 'intl'
 import ActionButton from 'action-button'
+import decorate from 'apply-decorators'
 import Icon from 'icon'
 import React from 'react'
 import SortedTable from 'sorted-table'
@@ -269,7 +270,7 @@ const FILTERS = {
  filterRemotesOnlyDisconnected: '!enabled?',
 }

-export default [
+export default decorate([
  addSubscriptions({
    remotes: cb =>
      subscribeRemotes(remotes => {
@@ -353,4 +354,4 @@ export default [
      <Remote formatMessage={formatMessage} key={state.formId} />
    </div>
  ),
-].reduceRight((value, decorator) => decorator(value))
+])
--- a/packages/xo-web/src/xo-app/settings/remotes/remote.js
+++ b/packages/xo-web/src/xo-app/settings/remotes/remote.js
@@ -1,5 +1,6 @@
 import _, { messages } from 'intl'
 import ActionButton from 'action-button'
+import decorate from 'apply-decorators'
 import Icon from 'icon'
 import React from 'react'
 import { addSubscriptions, generateRandomId } from 'utils'
@@ -18,7 +19,7 @@ const remoteTypes = {
  smb: 'remoteTypeSmb',
 }

-export default [
+export default decorate([
  addSubscriptions({
    remotes: subscribeRemotes,
  }),
@@ -329,4 +330,4 @@ export default [
      </div>
    )
  },
-].reduceRight((value, decorator) => decorator(value))
+])