Merge "fix: Decorator style for refactored components"

src/components/FormItem/VolumeSelectTable/index.jsx

@@ -22,9 +22,7 @@ import {
   volumeSortProps,
 } from 'resources/cinder/volume';
 
-@inject('rootStore')
+export class VolumeSelectTable extends Component {
-@observer
-export default class VolumeSelectTable extends Component {
   constructor(props) {
     super(props);
     this.stores = {
@@ -148,3 +146,5 @@ export default class VolumeSelectTable extends Component {
     );
   }
 }
+
+export default inject('rootStore')(observer(VolumeSelectTable));

src/components/Layout/GlobalHeader/AvatarDropdown.jsx

@@ -26,9 +26,7 @@ import styles from './index.less';
 
 const { getLocale, setLocale } = i18n;
 
-@inject('rootStore')
+export class AvatarDropdown extends React.Component {
-@observer
-class AvatarDropdown extends React.Component {
   get rootStore() {
     return this.props.rootStore || {};
   }
@@ -160,4 +158,4 @@ class AvatarDropdown extends React.Component {
   }
 }
 
-export default AvatarDropdown;
+export default inject('rootStore')(observer(AvatarDropdown));

src/components/Layout/GlobalHeader/OpenRc.jsx

@@ -22,9 +22,7 @@ import {
 } from 'resources/keystone/openstack-rc';
 import FileSaver from 'file-saver';
 
-@inject('rootStore')
+export class OpenRc extends ModalAction {
-@observer
-export default class OpenRc extends ModalAction {
   init() {
     this.store = globalAuthCatalogStore;
   }
@@ -129,3 +127,5 @@ export default class OpenRc extends ModalAction {
     });
   };
 }
+
+export default inject('rootStore')(observer(OpenRc));

src/components/Layout/GlobalHeader/Password.jsx

@@ -17,9 +17,7 @@ import { ModalAction } from 'containers/Action';
 import { getPasswordOtherRule } from 'utils/validate';
 import globalUserStore from 'stores/keystone/user';
 
-@inject('rootStore')
+export class Password extends ModalAction {
-@observer
-export default class Password extends ModalAction {
   static id = 'update-user-password';
 
   static title = t('Update User Password');
@@ -84,3 +82,5 @@ export default class Password extends ModalAction {
     });
   };
 }
+
+export default inject('rootStore')(observer(Password));

src/components/Layout/GlobalHeader/ProjectDropdown.jsx

@@ -20,9 +20,7 @@ import ItemActionButtons from 'components/Tables/Base/ItemActionButtons';
 import styles from './index.less';
 import ProjectSelect from './ProjectTable';
 
-@inject('rootStore')
+export class ProjectDropdown extends React.Component {
-@observer
-export default class ProjectDropdown extends React.Component {
   get user() {
     const { user } = this.props.rootStore;
     return user;
@@ -72,3 +70,5 @@ export default class ProjectDropdown extends React.Component {
     );
   }
 }
+
+export default inject('rootStore')(observer(ProjectDropdown));

src/components/Layout/GlobalHeader/ProjectTable.jsx

@@ -17,9 +17,7 @@ import { ModalAction } from 'containers/Action';
 import { allCanReadPolicy } from 'resources/skyline/policy';
 import globalUserStore from 'stores/keystone/user';
 
-@inject('rootStore')
+export class ProjectSelect extends ModalAction {
-@observer
-export default class ProjectSelect extends ModalAction {
   static id = 'project-id';
 
   static title = t('Switch Project');
@@ -165,3 +163,5 @@ export default class ProjectSelect extends ModalAction {
     }
   };
 }
+
+export default inject('rootStore')(observer(ProjectSelect));

src/components/Layout/GlobalHeader/Token.jsx

@@ -22,9 +22,7 @@ import styles from './index.less';
 
 const { Paragraph } = Typography;
 
-@inject('rootStore')
+export class Token extends ModalAction {
-@observer
-export default class Token extends ModalAction {
   static id = 'get-token';
 
   static title = t('Get Token');
@@ -140,3 +138,5 @@ export default class Token extends ModalAction {
 
   onSubmit = () => Promise.resolve();
 }
+
+export default inject('rootStore')(observer(Token));

src/components/Tables/Base/ActionButton/index.jsx

@@ -52,9 +52,7 @@ function getDefaultMsg(action, data) {
   };
 }
 
-@inject('rootStore')
+export class ActionButton extends Component {
-@observer
-class ActionButton extends Component {
   static propTypes() {
     return {
       title: PropTypes.string.isRequired,
@@ -536,4 +534,4 @@ class ActionButton extends Component {
   }
 }
 
-export default ActionButton;
+export default inject('rootStore')(observer(ActionButton));

src/components/Tables/Base/ItemActionButtons/index.jsx

@@ -243,8 +243,7 @@ function getActionList(actions, item, containerProps) {
   };
 }
 
-@inject('rootStore')
+export class ItemActionButtons extends Component {
-export default class ItemActionButtons extends Component {
   constructor(props) {
     super(props);
     this.actionList = [];
@@ -337,3 +336,5 @@ export default class ItemActionButtons extends Component {
     );
   }
 }
+
+export default inject('rootStore')(ItemActionButtons);

src/components/Tables/Base/index.jsx

@@ -55,8 +55,7 @@ import Download from './Download';
 
 import styles from './index.less';
 
-@inject('rootStore')
+export class BaseTable extends React.Component {
-export default class BaseTable extends React.Component {
   static propTypes = {
     data: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).isRequired,
     columns: PropTypes.array.isRequired,
@@ -937,3 +936,5 @@ export default class BaseTable extends React.Component {
     );
   }
 }
+
+export default inject('rootStore')(BaseTable);

src/layouts/Base/Right.jsx

@@ -25,9 +25,7 @@ import styles from './index.less';
 
 const { Content } = Layout;
 
-@inject('rootStore')
+export class Right extends Component {
-@observer
-class Right extends Component {
   constructor(props) {
     super(props);
     this.routes = props.route.routes;
@@ -193,4 +191,4 @@ class Right extends Component {
   }
 }
 
-export default Right;
+export default inject('rootStore')(observer(Right));

src/layouts/Basic/index.jsx

@@ -16,9 +16,7 @@ import { Component } from 'react';
 import { inject, observer } from 'mobx-react';
 import renderRoutes from 'utils/RouterConfig';
 
-@inject('rootStore')
+export class BaseLayout extends Component {
-@observer
-class BaseLayout extends Component {
   constructor(props) {
     super(props);
 
@@ -32,4 +30,4 @@ class BaseLayout extends Component {
   }
 }
 
-export default BaseLayout;
+export default inject('rootStore')(observer(BaseLayout));

src/layouts/Blank/index.jsx

@@ -19,9 +19,7 @@ import i18n from 'core/i18n';
 import DocumentTitle from 'react-document-title';
 import styles from './index.less';
 
-@inject('rootStore')
+export class BlankLayout extends Component {
-@observer
-class BlankLayout extends Component {
   constructor(props) {
     super(props);
     console.log('props', props);
@@ -54,4 +52,4 @@ class BlankLayout extends Component {
   }
 }
 
-export default BlankLayout;
+export default inject('rootStore')(observer(BlankLayout));

src/pages/auth/containers/ChangePassword/index.jsx

@@ -25,9 +25,7 @@ import Notify from 'components/Notify';
 import SimpleForm from 'components/SimpleForm';
 import styles from './index.less';
 
-@inject('rootStore')
+export class Password extends Component {
-@observer
-export default class Password extends Component {
   formRef = null;
 
   constructor(props) {
@@ -215,3 +213,5 @@ export default class Password extends Component {
     );
   }
 }
+
+export default inject('rootStore')(observer(Password));

src/pages/base/containers/AdminOverview/components/ComputeService.jsx

@@ -22,9 +22,7 @@ import {
 } from '@ant-design/icons/lib/icons';
 import styles from '../style.less';
 
-@inject('rootStore')
+export class ComputeService extends Component {
-@observer
-class ComputeService extends Component {
   componentDidMount() {
     this.props.store.getComputeService();
   }
@@ -83,4 +81,4 @@ ComputeService.propTypes = {
   store: PropTypes.object.isRequired,
 };
 
-export default ComputeService;
+export default inject('rootStore')(observer(ComputeService));

src/pages/base/containers/AdminOverview/components/NetworkService.jsx

@@ -22,9 +22,7 @@ import {
 } from '@ant-design/icons/lib/icons';
 import styles from '../style.less';
 
-@inject('rootStore')
+export class NetworkService extends Component {
-@observer
-class NetworkService extends Component {
   componentDidMount() {
     this.props.store.getNetworkService();
   }
@@ -83,4 +81,4 @@ NetworkService.propTypes = {
   store: PropTypes.object.isRequired,
 };
 
-export default NetworkService;
+export default inject('rootStore')(observer(NetworkService));

src/pages/compute/containers/BareMetalNode/Detail/BaseDetail.jsx

@@ -17,9 +17,7 @@ import { inject, observer } from 'mobx-react';
 import Base from 'containers/BaseDetail';
 import SimpleTable from 'components/Tables/SimpleTable';
 
-@inject('rootStore')
+export class BaseDetail extends Base {
-@observer
-export default class BaseDetail extends Base {
   get leftCards() {
     const cards = [
       this.baseInfoCard,
@@ -180,3 +178,5 @@ export default class BaseDetail extends Base {
     };
   }
 }
+
+export default inject('rootStore')(observer(BaseDetail));

src/pages/compute/containers/BareMetalNode/Detail/Port/actions/Create.jsx

@@ -22,9 +22,7 @@ import { isEmpty } from 'lodash';
 import { macAddressValidate } from 'utils/validate';
 import { updateAddSelectValueToObj } from 'utils/index';
 
-@inject('rootStore')
+export class Create extends ModalAction {
-@observer
-export default class Create extends ModalAction {
   static id = 'CreatePort';
 
   static title = t('Create Port');
@@ -171,3 +169,5 @@ export default class Create extends ModalAction {
     return globalIronicPortStore.create(body);
   };
 }
+
+export default inject('rootStore')(observer(Create));

src/pages/compute/containers/BareMetalNode/Detail/Port/actions/Edit.jsx

@@ -23,9 +23,7 @@ import { macAddressValidate } from 'utils/validate';
 import { updateObjToAddSelectArray } from 'utils/index';
 import { getDifFromAddSelectValue } from 'resources/ironic/ironic';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-export default class Edit extends ModalAction {
   static id = 'EditPort';
 
   static title = t('Edit Port');
@@ -231,3 +229,5 @@ export default class Edit extends ModalAction {
     return globalIronicPortStore.edit({ id: this.item.uuid }, body);
   };
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/BareMetalNode/Detail/Port/index.jsx

@@ -17,9 +17,7 @@ import Base from 'containers/List';
 import { IronicPortStore } from 'stores/ironic/port';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class BareMetalNodePort extends Base {
-@observer
-export default class BareMetalNodePort extends Base {
   init() {
     this.store = new IronicPortStore();
   }
@@ -75,3 +73,5 @@ export default class BareMetalNodePort extends Base {
     return rest;
   };
 }
+
+export default inject('rootStore')(observer(BareMetalNodePort));

src/pages/compute/containers/BareMetalNode/Detail/PortGroup/actions/Create.jsx

@@ -21,9 +21,7 @@ import { isEmpty } from 'lodash';
 import { macAddressValidate } from 'utils/validate';
 import { updateAddSelectValueToObj } from 'utils/index';
 
-@inject('rootStore')
+export class Create extends ModalAction {
-@observer
-export default class Create extends ModalAction {
   static id = 'CreatePort';
 
   static title = t('Create Port Group');
@@ -128,3 +126,5 @@ export default class Create extends ModalAction {
     return globalIronicPortGroupStore.create(body);
   };
 }
+
+export default inject('rootStore')(observer(Create));

src/pages/compute/containers/BareMetalNode/Detail/PortGroup/actions/Edit.jsx

@@ -22,9 +22,7 @@ import { macAddressValidate } from 'utils/validate';
 import { updateObjToAddSelectArray } from 'utils/index';
 import { getDifFromAddSelectValue } from 'resources/ironic/ironic';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-export default class Edit extends ModalAction {
   static id = 'EditPortGroup';
 
   static title = t('Edit Port Group');
@@ -193,3 +191,5 @@ export default class Edit extends ModalAction {
     return globalIronicPortGroupStore.edit({ id: this.item.uuid }, body);
   };
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/BareMetalNode/Detail/PortGroup/index.jsx

@@ -17,9 +17,7 @@ import Base from 'containers/List';
 import { IronicPortGroupStore } from 'stores/ironic/port-group';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class BareMetalNodePortGroup extends Base {
-@observer
-export default class BareMetalNodePortGroup extends Base {
   init() {
     this.store = new IronicPortGroupStore();
   }
@@ -75,3 +73,5 @@ export default class BareMetalNodePortGroup extends Base {
     return rest;
   };
 }
+
+export default inject('rootStore')(observer(BareMetalNodePortGroup));

src/pages/compute/containers/BareMetalNode/Detail/index.jsx

@@ -22,9 +22,7 @@ import Port from './Port';
 import PortGroup from './PortGroup';
 import actionConfigs from '../actions';
 
-@inject('rootStore')
+export class Detail extends Base {
-@observer
-export default class Detail extends Base {
   get name() {
     return t('bare metal node');
   }
@@ -109,3 +107,5 @@ export default class Detail extends Base {
     this.store = new IronicStore();
   }
 }
+
+export default inject('rootStore')(observer(Detail));

src/pages/compute/containers/BareMetalNode/actions/Create/DriveInfo.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import Base from 'components/Form';
 import { ImageStore } from 'stores/glance/image';
 
-@inject('rootStore')
+export class NodeInfo extends Base {
-@observer
-export default class NodeInfo extends Base {
   init() {
     this.imageStore = new ImageStore();
     this.getImages();
@@ -164,3 +162,5 @@ export default class NodeInfo extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(NodeInfo));

src/pages/compute/containers/BareMetalNode/actions/Create/DriveInterface.jsx

@@ -15,9 +15,7 @@
 import { inject, observer } from 'mobx-react';
 import Base from 'components/Form';
 
-@inject('rootStore')
+export class NodeInterface extends Base {
-@observer
-export default class NodeInterface extends Base {
   get bootInterfaces() {
     return [
       { value: 'pxe', label: t('PXE') },
@@ -125,3 +123,5 @@ export default class NodeInterface extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(NodeInterface));

src/pages/compute/containers/BareMetalNode/actions/Create/NodeInfo.jsx

@@ -21,9 +21,7 @@ import globalIronicStore from 'stores/ironic/ironic';
 
 const filterCustomTrait = (item) => item.indexOf('CUSTOM_') < 0;
 
-@inject('rootStore')
+export class NodeInfo extends Base {
-@observer
-export default class NodeInfo extends Base {
   init() {
     this.getTraits();
   }
@@ -245,3 +243,5 @@ export default class NodeInfo extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(NodeInfo));

src/pages/compute/containers/BareMetalNode/actions/Create/index.jsx

@@ -26,9 +26,7 @@ import DriveInterface from './DriveInterface';
 import DriveInfo from './DriveInfo';
 import NodeInfo from './NodeInfo';
 
-@inject('rootStore')
+export class Create extends StepAction {
-@observer
-export default class Create extends StepAction {
   static id = 'create';
 
   static title = t('Create Node');
@@ -222,3 +220,5 @@ export default class Create extends StepAction {
     return this.store.edit({ id: this.id }, body);
   };
 }
+
+export default inject('rootStore')(observer(Create));

src/pages/compute/containers/BareMetalNode/actions/Edit.jsx

@@ -15,9 +15,7 @@
 import { inject, observer } from 'mobx-react';
 import Create from './Create';
 
-@inject('rootStore')
+export class Edit extends Create {
-@observer
-export default class Edit extends Create {
   static id = 'edit-node';
 
   static title = t('Edit Bare Metal Node');
@@ -40,3 +38,5 @@ export default class Edit extends Create {
     return Promise.resolve(true);
   }
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/BareMetalNode/actions/ManageState.jsx

@@ -18,9 +18,7 @@ import { ModalAction } from 'containers/Action';
 import { provisioningState, canChangeStatus } from 'resources/ironic/ironic';
 import { getOptions } from 'utils/index';
 
-@inject('rootStore')
+export class ManageState extends ModalAction {
-@observer
-export default class ManageState extends ModalAction {
   static id = 'ManageState';
 
   static title = t('Manage State');
@@ -95,3 +93,5 @@ export default class ManageState extends ModalAction {
     return globalIronicStore.changeProvision(uuid, body);
   };
 }
+
+export default inject('rootStore')(observer(ManageState));

src/pages/compute/containers/BareMetalNode/actions/SetBootDevice.jsx

@@ -17,9 +17,7 @@ import { IronicStore } from 'stores/ironic/ironic';
 import { ModalAction } from 'containers/Action';
 import { yesNoOptions } from 'utils/constants';
 
-@inject('rootStore')
+export class SetBootDevice extends ModalAction {
-@observer
-export default class SetBootDevice extends ModalAction {
   static id = 'SetBootDevice';
 
   static title = t('Set Boot Device');
@@ -107,3 +105,5 @@ export default class SetBootDevice extends ModalAction {
     return this.store.setBootDevice(uuid, body);
   };
 }
+
+export default inject('rootStore')(observer(SetBootDevice));

src/pages/compute/containers/BareMetalNode/actions/SetMaintenance.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalIronicStore from 'stores/ironic/ironic';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class SetMaintenance extends ModalAction {
-@observer
-export default class SetMaintenance extends ModalAction {
   static id = 'SetMaintenance';
 
   static title = t('Enter Maintenance Mode');
@@ -64,3 +62,5 @@ export default class SetMaintenance extends ModalAction {
     return globalIronicStore.setMaintenance(uuid, body);
   };
 }
+
+export default inject('rootStore')(observer(SetMaintenance));

src/pages/compute/containers/BareMetalNode/index.jsx

@@ -20,9 +20,7 @@ import { ironicOriginEndpoint } from 'client/client/constants';
 import { getOptions } from 'utils';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class BareMetalNode extends Base {
-@observer
-export default class BareMetalNode extends Base {
   init() {
     this.store = globalIronicStore;
   }
@@ -123,3 +121,5 @@ export default class BareMetalNode extends Base {
     return rest;
   };
 }
+
+export default inject('rootStore')(observer(BareMetalNode));

src/pages/compute/containers/Flavor/Detail/BaseDetail.jsx

@@ -26,9 +26,7 @@ import {
   isBareMetal,
 } from 'resources/nova/flavor';
 
-@inject('rootStore')
+export class BaseDetail extends Base {
-@observer
-export default class BaseDetail extends Base {
   get leftCards() {
     const { category, disk, usbType } = this.detailData;
     const isGPUType = isGpuCategory(category);
@@ -269,3 +267,5 @@ export default class BaseDetail extends Base {
     };
   }
 }
+
+export default inject('rootStore')(observer(BaseDetail));

src/pages/compute/containers/Flavor/actions/Edit.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalFlavorStore from 'stores/nova/flavor';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-export default class Edit extends ModalAction {
   static id = 'edit-flavor';
 
   static title = t('Edit Flavor');
@@ -33,3 +31,5 @@ export default class Edit extends ModalAction {
 
   static allowed = () => Promise.resolve(true);
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/Flavor/actions/ManageAccess.jsx

@@ -18,9 +18,7 @@ import { ModalAction } from 'containers/Action';
 import { ProjectStore } from 'stores/keystone/project';
 import { projectTableOptions } from 'resources/keystone/project';
 
-@inject('rootStore')
+export class ManageAccess extends ModalAction {
-@observer
-export default class ManageAccess extends ModalAction {
   static id = 'manage-access';
 
   static title = t('Manage Access');
@@ -117,3 +115,5 @@ export default class ManageAccess extends ModalAction {
     return globalFlavorStore.updateAccess(id, adds, dels);
   };
 }
+
+export default inject('rootStore')(observer(ManageAccess));

src/pages/compute/containers/Flavor/actions/ManageMetadata.jsx

@@ -19,9 +19,7 @@ import KeyValueInput from 'components/FormItem/KeyValueInput';
 import { MetadataStore } from 'stores/glance/metadata';
 import { isEmpty, has } from 'lodash';
 
-@inject('rootStore')
+export class ManageMetadata extends ModalAction {
-@observer
-export default class ManageMetadata extends ModalAction {
   static id = 'ManageMetadata';
 
   static title = t('Manage Metadata');
@@ -213,3 +211,5 @@ export default class ManageMetadata extends ModalAction {
     return this.store.updateExtraSpecs(this.item.id, adds, replaces, removes);
   };
 }
+
+export default inject('rootStore')(observer(ManageMetadata));

src/pages/compute/containers/Flavor/actions/StepCreate/AccessTypeSetting.jsx

@@ -17,9 +17,7 @@ import Base from 'components/Form';
 import { ProjectStore } from 'stores/keystone/project';
 import { projectTableOptions } from 'resources/keystone/project';
 
-@inject('rootStore')
+export class AccessTypeSetting extends Base {
-@observer
-export default class AccessTypeSetting extends Base {
   init() {
     this.projectStore = new ProjectStore();
     this.getProjects();
@@ -78,3 +76,5 @@ export default class AccessTypeSetting extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(AccessTypeSetting));

src/pages/compute/containers/Flavor/actions/StepCreate/index.jsx

@@ -27,9 +27,7 @@ import { parse } from 'qs';
 import AccessTypeSetting from './AccessTypeSetting';
 import ParamSetting from './ParamSetting';
 
-@inject('rootStore')
+export class StepCreate extends StepAction {
-@observer
-class StepCreate extends StepAction {
   static id = 'flavor-create';
 
   static title = t('Create Flavor');
@@ -200,4 +198,4 @@ class StepCreate extends StepAction {
   };
 }
 
-export default StepCreate;
+export default inject('rootStore')(observer(StepCreate));

src/pages/compute/containers/Flavor/index.jsx

@@ -22,9 +22,7 @@ import Arm from './Arm';
 import BareMetal from './BareMetal';
 import Other from './Other';
 
-@inject('rootStore')
+export class Flavor extends Base {
-@observer
-export default class Flavor extends Base {
   init() {
     this.settingStore = globalSettingStore;
     this.getSettings();
@@ -54,3 +52,5 @@ export default class Flavor extends Base {
     }));
   }
 }
+
+export default inject('rootStore')(observer(Flavor));

src/pages/compute/containers/HostAggregate/Aggregate/actions/Create.jsx

@@ -18,9 +18,7 @@ import { ModalAction } from 'containers/Action';
 import globalAvailabilityZoneStore from 'stores/nova/zone';
 import { getYesNoList } from 'utils/index';
 
-@inject('rootStore')
+export class Create extends ModalAction {
-@observer
-export default class Create extends ModalAction {
   static id = 'create';
 
   static title = t('Create Host Aggregate');
@@ -110,3 +108,5 @@ export default class Create extends ModalAction {
     return globalAggregateStore.create(data);
   };
 }
+
+export default inject('rootStore')(observer(Create));

src/pages/compute/containers/HostAggregate/Aggregate/actions/Edit.jsx

@@ -18,9 +18,7 @@ import { ModalAction } from 'containers/Action';
 import globalAvailabilityZoneStore from 'stores/nova/zone';
 import { getYesNoList } from 'utils/index';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-export default class Edit extends ModalAction {
   static id = 'edit';
 
   static title = t('Edit Host Aggregate');
@@ -131,3 +129,5 @@ export default class Edit extends ModalAction {
     return globalAggregateStore.edit({ id }, data);
   };
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/HostAggregate/Aggregate/actions/ManageHost.jsx

@@ -18,9 +18,7 @@ import globalComputeHostStore from 'stores/nova/compute-host';
 import { ModalAction } from 'containers/Action';
 import { serviceStatus, serviceState } from 'resources/nova/service';
 
-@inject('rootStore')
+export class ManageHost extends ModalAction {
-@observer
-export default class ManageHost extends ModalAction {
   static id = 'ManageHost';
 
   static title = t('Manage Host');
@@ -149,3 +147,5 @@ export default class ManageHost extends ModalAction {
     return this.store.manageHost({ id, adds, dels });
   };
 }
+
+export default inject('rootStore')(observer(ManageHost));

src/pages/compute/containers/HostAggregate/Aggregate/actions/ManageMetadata.jsx

@@ -19,9 +19,7 @@ import KeyValueInput from 'components/FormItem/KeyValueInput';
 import { MetadataStore } from 'stores/glance/metadata';
 import { isEmpty, has } from 'lodash';
 
-@inject('rootStore')
+export class ManageMetadata extends ModalAction {
-@observer
-export default class ManageMetadata extends ModalAction {
   static id = 'ManageMetadata';
 
   static title = t('Manage Metadata');
@@ -178,3 +176,5 @@ export default class ManageMetadata extends ModalAction {
     return this.store.manageMetadata({ id, metadata });
   };
 }
+
+export default inject('rootStore')(observer(ManageMetadata));

src/pages/compute/containers/HostAggregate/Aggregate/index.jsx

@@ -19,9 +19,7 @@ import { isEmpty } from 'lodash';
 import globalAggregateStore from 'stores/nova/aggregate';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class HostAggregate extends Base {
-@observer
-export default class HostAggregate extends Base {
   init() {
     this.store = globalAggregateStore;
   }
@@ -103,3 +101,5 @@ export default class HostAggregate extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(HostAggregate));

src/pages/compute/containers/HostAggregate/AvailabilityZone/index.jsx

@@ -18,9 +18,7 @@ import Base from 'containers/List';
 import { isEmpty } from 'lodash';
 import globalAvailabilityZoneStore from 'stores/nova/zone';
 
-@inject('rootStore')
+export class AvailabilityZone extends Base {
-@observer
-export default class AvailabilityZone extends Base {
   init() {
     this.store = globalAvailabilityZoneStore;
   }
@@ -80,3 +78,5 @@ export default class AvailabilityZone extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(AvailabilityZone));

src/pages/compute/containers/HostAggregate/index.jsx

@@ -17,9 +17,7 @@ import Base from 'containers/TabList';
 import Aggregate from './Aggregate';
 import AvailabilityZone from './AvailabilityZone';
 
-@inject('rootStore')
+export class HostAggregate extends Base {
-@observer
-export default class Index extends Base {
   get tabs() {
     const tabs = [
       {
@@ -36,3 +34,5 @@ export default class Index extends Base {
     return tabs;
   }
 }
+
+export default inject('rootStore')(observer(HostAggregate));

src/pages/compute/containers/Hypervisors/ComputeHost/actions/Disable.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalComputeHostStore from 'stores/nova/compute-host';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class DisableAction extends ModalAction {
-@observer
-export default class DisableAction extends ModalAction {
   static id = 'disable-host';
 
   static title = t('Disable Compute Host');
@@ -85,3 +83,5 @@ export default class DisableAction extends ModalAction {
     return globalComputeHostStore.disable(body);
   };
 }
+
+export default inject('rootStore')(observer(DisableAction));

src/pages/compute/containers/Hypervisors/ComputeHost/index.jsx

@@ -20,9 +20,7 @@ import { onlyAdminCanReadPolicy } from 'resources/skyline/policy';
 import { getOptions } from 'utils';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class ComputeHost extends Base {
-@observer
-export default class ComputeHost extends Base {
   init() {
     this.store = globalComputeHostStore;
   }
@@ -105,3 +103,5 @@ export default class ComputeHost extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(ComputeHost));

src/pages/compute/containers/Hypervisors/index.jsx

@@ -17,9 +17,7 @@ import Base from 'containers/TabList';
 import Hypervisor from './Hypervisor';
 import ComputeHost from './ComputeHost';
 
-@inject('rootStore')
+export class Hypervisors extends Base {
-@observer
-export default class Index extends Base {
   get tabs() {
     const tabs = [
       {
@@ -36,3 +34,5 @@ export default class Index extends Base {
     return tabs;
   }
 }
+
+export default inject('rootStore')(observer(Hypervisors));

src/pages/compute/containers/Image/actions/CreateInstance.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import CreateInstance from 'pages/compute/containers/Instance/actions/StepCreate';
 import { canImageCreateInstance } from 'resources/glance/image';
 
-@inject('rootStore')
+export class StepCreate extends CreateInstance {
-@observer
-export default class StepCreate extends CreateInstance {
   static id = 'instance-create';
 
   static title = t('Create Instance');
@@ -34,3 +32,5 @@ export default class StepCreate extends CreateInstance {
     return Promise.resolve(!isAdminPage && canImageCreateInstance(item));
   }
 }
+
+export default inject('rootStore')(observer(StepCreate));

src/pages/compute/containers/Image/actions/Edit.jsx

@@ -21,9 +21,7 @@ import { isActive } from 'resources/nova/instance';
 import { NoSetValue, getOptionsWithNoSet } from 'utils/index';
 import { cpuPolicyList, cpuThreadPolicyList } from 'resources/nova/flavor';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-class Edit extends ModalAction {
   init() {
     this.store = globalImageStore;
   }
@@ -254,4 +252,4 @@ class Edit extends ModalAction {
   };
 }
 
-export default Edit;
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/Image/actions/ManageAccess.jsx

@@ -18,9 +18,7 @@ import { ModalAction } from 'containers/Action';
 import { ProjectStore } from 'stores/keystone/project';
 import { projectTableOptions } from 'resources/keystone/project';
 
-@inject('rootStore')
+export class ManageAccess extends ModalAction {
-@observer
-export default class ManageAccess extends ModalAction {
   static id = 'manage-access';
 
   static title = t('Manage Access');
@@ -114,3 +112,5 @@ export default class ManageAccess extends ModalAction {
     return globalImageStore.updateMembers(id, adds, dels);
   };
 }
+
+export default inject('rootStore')(observer(ManageAccess));

src/pages/compute/containers/Image/actions/ManageMetadata.jsx

@@ -20,9 +20,7 @@ import { MetadataStore } from 'stores/glance/metadata';
 import { isEmpty, has } from 'lodash';
 import { isOwner } from 'resources/glance/image';
 
-@inject('rootStore')
+export class ManageMetadata extends ModalAction {
-@observer
-export default class ManageMetadata extends ModalAction {
   static id = 'ManageMetadata';
 
   static title = t('Manage Metadata');
@@ -259,3 +257,5 @@ export default class ManageMetadata extends ModalAction {
     return this.store.update({ id: this.item.id }, changeValues);
   };
 }
+
+export default inject('rootStore')(observer(ManageMetadata));

src/pages/compute/containers/Image/index.jsx

@@ -16,9 +16,7 @@ import { observer, inject } from 'mobx-react';
 import Base from 'containers/TabList';
 import Image from './Image';
 
-@inject('rootStore')
+export class TabImage extends Base {
-@observer
-export default class TabImage extends Base {
   get tabs() {
     const tabs = [
       {
@@ -47,3 +45,5 @@ export default class TabImage extends Base {
     return tabs;
   }
 }
+
+export default inject('rootStore')(observer(TabImage));

src/pages/compute/containers/Instance/Detail/ActionLog/index.jsx

@@ -3,9 +3,7 @@ import Base from 'containers/List';
 import globalActionLogStore from 'stores/nova/action-log';
 import { actionColumn } from 'resources/nova/instance';
 
-@inject('rootStore')
+export class ActionLog extends Base {
-@observer
-export default class ActionLog extends Base {
   init() {
     this.store = globalActionLogStore;
   }
@@ -24,3 +22,5 @@ export default class ActionLog extends Base {
     return true;
   }
 }
+
+export default inject('rootStore')(observer(ActionLog));

src/pages/compute/containers/Instance/actions/AssociateFip.jsx

@@ -24,9 +24,7 @@ import {
 } from 'resources/neutron/floatingip';
 import { getPortsAndReasons } from 'resources/neutron/port';
 
-@inject('rootStore')
+export class AssociateFip extends ModalAction {
-@observer
-export default class AssociateFip extends ModalAction {
   static id = 'AssociateFip';
 
   static title = t('Associate Floating IP');
@@ -194,3 +192,5 @@ export default class AssociateFip extends ModalAction {
     });
   };
 }
+
+export default inject('rootStore')(observer(AssociateFip));

src/pages/compute/containers/Instance/actions/AttachInterface.jsx

@@ -27,9 +27,7 @@ import { ipValidate } from 'utils/validate';
 
 const { isIPv4, isIpv6, isIpInRangeAll } = ipValidate;
 
-@inject('rootStore')
+export class AttachInterface extends ModalAction {
-@observer
-export default class AttachInterface extends ModalAction {
   static id = 'attach-interface';
 
   static title = t('Attach Interface');
@@ -235,3 +233,5 @@ export default class AttachInterface extends ModalAction {
     return this.store.addInterface({ id, body });
   };
 }
+
+export default inject('rootStore')(observer(AttachInterface));

src/pages/compute/containers/Instance/actions/ChangePassword.jsx

@@ -22,9 +22,7 @@ import {
   isIronicInstance,
 } from 'resources/nova/instance';
 
-@inject('rootStore')
+export class ChangePassword extends ModalAction {
-@observer
-export default class ChangePassword extends ModalAction {
   static id = 'change-password';
 
   static title = t('Change Password');
@@ -98,3 +96,5 @@ export default class ChangePassword extends ModalAction {
     return this.store.changePassword({ id, password });
   };
 }
+
+export default inject('rootStore')(observer(ChangePassword));

src/pages/compute/containers/Instance/actions/CreateImage.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalServerStore from 'stores/nova/instance';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class CreateImage extends ModalAction {
-@observer
-export default class CreateImage extends ModalAction {
   static id = 'create-image';
 
   static title = t('Create Image');
@@ -87,3 +85,5 @@ export default class CreateImage extends ModalAction {
     return this.store.createImage({ id, image });
   };
 }
+
+export default inject('rootStore')(observer(CreateImage));

src/pages/compute/containers/Instance/actions/DetachInterface.jsx

@@ -19,9 +19,7 @@ import { ModalAction } from 'containers/Action';
 import { portStatus } from 'resources/neutron/port';
 import { isActiveOrShutOff, isNotLocked } from 'resources/nova/instance';
 
-@inject('rootStore')
+export class DetachInterface extends ModalAction {
-@observer
-export default class DetachInterface extends ModalAction {
   static id = 'detach-interface';
 
   static title = t('Detach Interface');
@@ -139,3 +137,5 @@ export default class DetachInterface extends ModalAction {
     return this.store.detachInterface({ id, ports: selectedRowKeys });
   };
 }
+
+export default inject('rootStore')(observer(DetachInterface));

src/pages/compute/containers/Instance/actions/DisassociateFip.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import { FloatingIpStore } from 'stores/neutron/floatingIp';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class DisassociateFip extends ModalAction {
-@observer
-export default class DisassociateFip extends ModalAction {
   static id = 'DisassociateFip';
 
   static title = t('Disassociate Floating Ip');
@@ -83,3 +81,5 @@ export default class DisassociateFip extends ModalAction {
     return this.store.disassociateFip({ id: results[0].id });
   };
 }
+
+export default inject('rootStore')(observer(DisassociateFip));

src/pages/compute/containers/Instance/actions/Edit.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import { ModalAction } from 'containers/Action';
 import globalServerStore from 'stores/nova/instance';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-export default class Edit extends ModalAction {
   static id = 'edit-server';
 
   static title = t('Edit Instance');
@@ -57,3 +55,5 @@ export default class Edit extends ModalAction {
     return globalServerStore.edit({ id }, body);
   };
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/compute/containers/Instance/actions/LiveMigrate.jsx

@@ -27,9 +27,7 @@ import {
   hypervisorFilters,
 } from 'resources/nova/hypervisor';
 
-@inject('rootStore')
+export class LiveMigrate extends ModalAction {
-@observer
-export default class LiveMigrate extends ModalAction {
   static id = 'LiveMigrate';
 
   static title = t('Live Migrate');
@@ -148,3 +146,5 @@ export default class LiveMigrate extends ModalAction {
     return this.store.migrateLive({ id, body });
   };
 }
+
+export default inject('rootStore')(observer(LiveMigrate));

src/pages/compute/containers/Instance/actions/ManageSecurityGroup.jsx

@@ -26,9 +26,7 @@ import {
 } from 'resources/neutron/security-group';
 import { toJS } from 'mobx';
 
-@inject('rootStore')
+export class ManageSecurityGroup extends ModalAction {
-@observer
-export default class ManageSecurityGroup extends ModalAction {
   static id = 'manage-security-group';
 
   static title = t('Manage Security Group');
@@ -212,3 +210,5 @@ export default class ManageSecurityGroup extends ModalAction {
     return this.securityGroupStore.updatePortSecurityGroup({ id, reqBody });
   };
 }
+
+export default inject('rootStore')(observer(ManageSecurityGroup));

src/pages/compute/containers/Instance/actions/Migrate.jsx

@@ -27,9 +27,7 @@ import {
   hypervisorFilters,
 } from 'resources/nova/hypervisor';
 
-@inject('rootStore')
+export class LiveMigrate extends ModalAction {
-@observer
-export default class LiveMigrate extends ModalAction {
   static id = 'migrate';
 
   static title = t('Migrate');
@@ -138,3 +136,5 @@ export default class LiveMigrate extends ModalAction {
     return this.store.migrate({ id, body });
   };
 }
+
+export default inject('rootStore')(observer(LiveMigrate));

src/pages/compute/containers/Instance/actions/ModifyTags.jsx

@@ -19,9 +19,7 @@ import Tags from 'components/Tags';
 import globalTagStore from 'stores/nova/tag';
 import { isEqual } from 'lodash';
 
-@inject('rootStore')
+export class ModifyTags extends ModalAction {
-@observer
-export default class ModifyTags extends ModalAction {
   static id = 'modify-instance-tags';
 
   static title = t('Modify Instance Tags');
@@ -111,3 +109,5 @@ export default class ModifyTags extends ModalAction {
     ];
   }
 }
+
+export default inject('rootStore')(observer(ModifyTags));

src/pages/compute/containers/Keypair/Detail/BaseDetail.jsx

@@ -15,9 +15,7 @@
 import { inject, observer } from 'mobx-react';
 import Base from 'containers/BaseDetail';
 
-@inject('rootStore')
+export class BaseDetail extends Base {
-@observer
-export default class BaseDetail extends Base {
   get leftCards() {
     return [this.keypairInfoCard];
   }
@@ -44,3 +42,5 @@ export default class BaseDetail extends Base {
     };
   }
 }
+
+export default inject('rootStore')(observer(BaseDetail));

src/pages/compute/containers/Keypair/Detail/index.jsx

@@ -18,9 +18,7 @@ import Base from 'containers/TabDetail';
 import BaseDetail from './BaseDetail';
 import actionConfigs from '../actions';
 
-@inject('rootStore')
+export class KeypairDetail extends Base {
-@observer
-export default class KeypairDetail extends Base {
   get name() {
     return t('keypair');
   }
@@ -70,3 +68,5 @@ export default class KeypairDetail extends Base {
     this.store = new KeypairStore();
   }
 }
+
+export default inject('rootStore')(observer(KeypairDetail));

src/pages/compute/containers/Keypair/actions/Create.jsx

@@ -17,9 +17,7 @@ import { ModalAction } from 'containers/Action';
 import globalKeypairStore from 'stores/nova/keypair';
 import FileSaver from 'file-saver';
 
-@inject('rootStore')
+export class CreateKeypair extends ModalAction {
-@observer
-export default class CreateKeypair extends ModalAction {
   static id = 'create-keypair';
 
   static title = t('Create Keypair');
@@ -93,3 +91,5 @@ export default class CreateKeypair extends ModalAction {
     ];
   }
 }
+
+export default inject('rootStore')(observer(CreateKeypair));

src/pages/compute/containers/Keypair/index.jsx

@@ -17,9 +17,7 @@ import Base from 'containers/List';
 import keypairStore from 'stores/nova/keypair';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class Keypair extends Base {
-@observer
-export default class Keypair extends Base {
   init() {
     this.store = keypairStore;
   }
@@ -66,3 +64,5 @@ export default class Keypair extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(Keypair));

src/pages/compute/containers/ServerGroup/Detail/index.jsx

@@ -19,9 +19,7 @@ import Members from 'pages/compute/containers/Instance';
 import policyType from 'resources/nova/server-group';
 import actionConfigs from '../actions';
 
-@inject('rootStore')
+export class ServerGroupDetail extends Base {
-@observer
-export default class ServerGroupDetail extends Base {
   get name() {
     return t('server group');
   }
@@ -79,3 +77,5 @@ export default class ServerGroupDetail extends Base {
     this.store = new ServerGroupStore();
   }
 }
+
+export default inject('rootStore')(observer(ServerGroupDetail));

src/pages/compute/containers/ServerGroup/actions/Create.jsx

@@ -18,9 +18,7 @@ import globalServerGroupStore from 'stores/nova/server-group';
 import { ModalAction } from 'containers/Action';
 import policyType from 'resources/nova/server-group';
 
-@inject('rootStore')
+export class Create extends ModalAction {
-@observer
-export default class Create extends ModalAction {
   static id = 'create';
 
   static title = t('Create Server Group');
@@ -92,3 +90,5 @@ export default class Create extends ModalAction {
 
   onSubmit = (values) => globalServerGroupStore.create(values);
 }
+
+export default inject('rootStore')(observer(Create));

src/pages/compute/containers/ServerGroup/index.jsx

@@ -19,9 +19,7 @@ import policyType from 'resources/nova/server-group';
 import { getOptions } from 'utils';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class ServerGroup extends Base {
-@observer
-export default class ServerGroup extends Base {
   init() {
     this.store = globalServerGroupStore;
   }
@@ -86,3 +84,5 @@ export default class ServerGroup extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(ServerGroup));

src/pages/configuration/containers/Metadata/Detail/BaseDetail.jsx

@@ -17,9 +17,7 @@ import { inject, observer } from 'mobx-react';
 import Base from 'containers/BaseDetail';
 import styles from './styles.less';
 
-@inject('rootStore')
+export class BaseDetail extends Base {
-@observer
-export default class BaseDetail extends Base {
   get leftCards() {
     return [this.baseInfoCard, this.resourceCard];
   }
@@ -83,3 +81,5 @@ export default class BaseDetail extends Base {
     };
   }
 }
+
+export default inject('rootStore')(observer(BaseDetail));

src/pages/configuration/containers/Metadata/Detail/index.jsx

@@ -18,9 +18,7 @@ import Base from 'containers/TabDetail';
 import BaseDetail from './BaseDetail';
 import actionConfigs from '../actions';
 
-@inject('rootStore')
+export class MetadataDetail extends Base {
-@observer
-export default class MetadataDetail extends Base {
   get name() {
     return t('metadata');
   }
@@ -71,3 +69,5 @@ export default class MetadataDetail extends Base {
     this.store = new MetadataStore();
   }
 }
+
+export default inject('rootStore')(observer(MetadataDetail));

src/pages/configuration/containers/Metadata/actions/Create.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalMetadataStore from 'stores/glance/metadata';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class Create extends ModalAction {
-@observer
-export default class Create extends ModalAction {
   static id = 'create';
 
   static title = t('Import Metadata');
@@ -72,3 +70,5 @@ export default class Create extends ModalAction {
     return this.store.create(body);
   };
 }
+
+export default inject('rootStore')(observer(Create));

src/pages/configuration/containers/Metadata/actions/Edit.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalMetadataStore from 'stores/glance/metadata';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class Edit extends ModalAction {
-@observer
-export default class Edit extends ModalAction {
   static id = 'edit';
 
   static title = t('Edit Metadata');
@@ -86,3 +84,5 @@ export default class Edit extends ModalAction {
     return globalMetadataStore.edit({ id: namespace }, body);
   };
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/configuration/containers/Metadata/actions/Manage.jsx

@@ -19,9 +19,7 @@ import { MetadataStore } from 'stores/glance/metadata';
 import { ModalAction } from 'containers/Action';
 import { Input } from 'antd';
 
-@inject('rootStore')
+export class Manage extends ModalAction {
-@observer
-export default class Manage extends ModalAction {
   static id = 'manage';
 
   static title = t('Manage Resource Types');
@@ -178,3 +176,5 @@ export default class Manage extends ModalAction {
     return this.store.manageResourceTypes(namespace, dels, adds);
   };
 }
+
+export default inject('rootStore')(observer(Manage));

src/pages/configuration/containers/Metadata/index.jsx

@@ -19,9 +19,7 @@ import Base from 'containers/List';
 import globalMetadataStore from 'stores/glance/metadata';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class Metadata extends Base {
-@observer
-export default class Metadata extends Base {
   init() {
     this.store = globalMetadataStore;
   }
@@ -92,3 +90,5 @@ export default class Metadata extends Base {
     },
   ];
 }
+
+export default inject('rootStore')(observer(Metadata));

src/pages/configuration/containers/SystemInfo/Catalog.jsx

@@ -19,9 +19,7 @@ import { generateId } from 'utils/index';
 
 import globalAuthCatalogStore from 'stores/keystone/catalog';
 
-@inject('rootStore')
+export class Catalog extends Base {
-@observer
-export default class Catalog extends Base {
   init() {
     this.store = globalAuthCatalogStore;
   }
@@ -84,3 +82,5 @@ export default class Catalog extends Base {
     return [];
   }
 }
+
+export default inject('rootStore')(observer(Catalog));

src/pages/configuration/containers/SystemInfo/CinderService/actions/Disable.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalServiceStore from 'stores/cinder/service';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class DisableAction extends ModalAction {
-@observer
-export default class DisableAction extends ModalAction {
   static id = 'disable-service';
 
   static title = t('Disable Cinder Service');
@@ -86,3 +84,5 @@ export default class DisableAction extends ModalAction {
     return globalServiceStore.disable(body);
   };
 }
+
+export default inject('rootStore')(observer(DisableAction));

src/pages/configuration/containers/SystemInfo/CinderService/index.jsx

@@ -19,9 +19,7 @@ import globalServiceStore from 'stores/cinder/service';
 import { getOptions } from 'utils';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class CinderService extends Base {
-@observer
-export default class CinderService extends Base {
   init() {
     this.store = globalServiceStore;
   }
@@ -104,3 +102,5 @@ export default class CinderService extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(CinderService));

src/pages/configuration/containers/SystemInfo/ComputeService/actions/Disable.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import globalComputeHostStore from 'stores/nova/compute-host';
 import { ModalAction } from 'containers/Action';
 
-@inject('rootStore')
+export class DisableAction extends ModalAction {
-@observer
-export default class DisableAction extends ModalAction {
   static id = 'disable-host';
 
   static title = t('Disable Compute Service');
@@ -88,3 +86,5 @@ export default class DisableAction extends ModalAction {
     return globalComputeHostStore.disable(body);
   };
 }
+
+export default inject('rootStore')(observer(DisableAction));

src/pages/configuration/containers/SystemInfo/ComputeService/index.jsx

@@ -19,9 +19,7 @@ import { ComputeHostStore } from 'stores/nova/compute-host';
 import { getOptions } from 'utils';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class ComputeService extends Base {
-@observer
-export default class ComputeService extends Base {
   init() {
     this.store = new ComputeHostStore();
   }
@@ -105,3 +103,5 @@ export default class ComputeService extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(ComputeService));

src/pages/configuration/containers/SystemInfo/HeatService.jsx

@@ -18,9 +18,7 @@ import { serviceState } from 'resources/nova/service';
 import { getOptions } from 'utils';
 import globalHeatServiceStore from 'stores/heat/service';
 
-@inject('rootStore')
+export class HeatService extends Base {
-@observer
-export default class HeatService extends Base {
   init() {
     this.store = globalHeatServiceStore;
   }
@@ -79,3 +77,5 @@ export default class HeatService extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(HeatService));

src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/BaseDetail.jsx

@@ -16,9 +16,7 @@ import React from 'react';
 import { inject, observer } from 'mobx-react';
 import Base from 'containers/BaseDetail';
 
-@inject('rootStore')
+export class BaseDetail extends Base {
-@observer
-export default class BaseDetail extends Base {
   get leftCards() {
     return [this.baseCard];
   }
@@ -77,3 +75,5 @@ export default class BaseDetail extends Base {
     };
   }
 }
+
+export default inject('rootStore')(observer(BaseDetail));

src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/Network/actions/Add.jsx

@@ -20,9 +20,7 @@ import { networkColumns, networkSortProps } from 'resources/neutron/network';
 import { yesNoOptions } from 'utils/constants';
 import { projectRender } from 'utils/table';
 
-@inject('rootStore')
+export class AddNetwork extends ModalAction {
-@observer
-export default class AddNetwork extends ModalAction {
   static id = 'add-network';
 
   static title = t('Add Network');
@@ -155,3 +153,5 @@ export default class AddNetwork extends ModalAction {
     return this.store.add({ agentId }, data);
   };
 }
+
+export default inject('rootStore')(observer(AddNetwork));

src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/Network/index.jsx

@@ -19,9 +19,7 @@ import { NeutronAgentNetworkStore } from 'stores/neutron/agent-network';
 import { yesNoOptions } from 'utils/constants';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class Networks extends Base {
-@observer
-export default class Networks extends Base {
   init() {
     this.store = new NeutronAgentNetworkStore();
   }
@@ -79,3 +77,5 @@ export default class Networks extends Base {
     };
   };
 }
+
+export default inject('rootStore')(observer(Networks));

src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/Router/actions/Add.jsx

@@ -23,9 +23,7 @@ import {
 } from 'resources/neutron/router';
 import { projectRender } from 'utils/table';
 
-@inject('rootStore')
+export class AddRouter extends ModalAction {
-@observer
-export default class AddRouter extends ModalAction {
   static id = 'add-router';
 
   static title = t('Add Router');
@@ -141,3 +139,5 @@ export default class AddRouter extends ModalAction {
     return this.store.add({ agentId }, data);
   };
 }
+
+export default inject('rootStore')(observer(AddRouter));

src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/Router/index.jsx

@@ -18,9 +18,7 @@ import { getRouterColumns, routerFilters } from 'resources/neutron/router';
 import { NeutronAgentRouterStore } from 'stores/neutron/agent-router';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class Router extends Base {
-@observer
-export default class Router extends Base {
   init() {
     this.store = new NeutronAgentRouterStore();
   }
@@ -59,3 +57,5 @@ export default class Router extends Base {
     };
   };
 }
+
+export default inject('rootStore')(observer(Router));

src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/index.jsx

@@ -24,9 +24,7 @@ import Router from './Router';
 import Network from './Network';
 import actionConfigs from '../actions';
 
-@inject('rootStore')
+export class KeypairDetail extends Base {
-@observer
-export default class KeypairDetail extends Base {
   get name() {
     return t('neutron agent');
   }
@@ -106,3 +104,5 @@ export default class KeypairDetail extends Base {
     this.store = new NeutronAgentStore();
   }
 }
+
+export default inject('rootStore')(observer(KeypairDetail));

src/pages/configuration/containers/SystemInfo/NeutronAgent/index.jsx

@@ -21,9 +21,7 @@ import {
 import globalNeutronAgentStore from 'stores/neutron/agent';
 import actionConfigs from './actions';
 
-@inject('rootStore')
+export class NeutronAgent extends Base {
-@observer
-export default class NeutronAgent extends Base {
   init() {
     this.store = globalNeutronAgentStore;
   }
@@ -110,3 +108,5 @@ export default class NeutronAgent extends Base {
     ];
   }
 }
+
+export default inject('rootStore')(observer(NeutronAgent));

src/pages/configuration/containers/SystemInfo/index.jsx

@@ -20,9 +20,7 @@ import CinderService from './CinderService';
 import NeutronAgent from './NeutronAgent';
 import HeatService from './HeatService';
 
-@inject('rootStore')
+export class Service extends Base {
-@observer
-export default class Service extends Base {
   get enableCinder() {
     return this.props.rootStore.checkEndpoint('cinder');
   }
@@ -60,3 +58,5 @@ export default class Service extends Base {
     return tabs;
   }
 }
+
+export default inject('rootStore')(observer(Service));

src/pages/heat/containers/Stack/Detail/BaseDetail.jsx

@@ -17,9 +17,7 @@ import { inject, observer } from 'mobx-react';
 import Base from 'containers/BaseDetail';
 import { rollbackTip } from 'resources/heat/stack';
 
-@inject('rootStore')
+export class BaseDetail extends Base {
-@observer
-export default class BaseDetail extends Base {
   get leftCards() {
     return [this.startCard, this.outputCard];
   }
@@ -84,3 +82,5 @@ export default class BaseDetail extends Base {
     };
   }
 }
+
+export default inject('rootStore')(observer(BaseDetail));

src/pages/heat/containers/Stack/Detail/Event.jsx

@@ -18,9 +18,7 @@ import Base from 'containers/List';
 import { StackEventStore } from 'stores/heat/event';
 import { stackStatus } from 'resources/heat/stack';
 
-@inject('rootStore')
+export class Event extends Base {
-@observer
-export default class Event extends Base {
   init() {
     this.store = new StackEventStore();
   }
@@ -76,3 +74,5 @@ export default class Event extends Base {
     },
   ];
 }
+
+export default inject('rootStore')(observer(Event));

src/pages/heat/containers/Stack/Detail/Template.jsx

@@ -19,9 +19,7 @@ import yaml from 'js-yaml';
 import { Card } from 'antd';
 import CodeEditor from 'components/CodeEditor';
 
-@inject('rootStore')
+export class Template extends Component {
-@observer
-export default class Template extends Component {
   constructor(props) {
     super(props);
     this.store = new StackStore();
@@ -61,3 +59,5 @@ export default class Template extends Component {
     );
   }
 }
+
+export default inject('rootStore')(observer(Template));

src/pages/heat/containers/Stack/actions/Edit.jsx

@@ -16,9 +16,7 @@ import { inject, observer } from 'mobx-react';
 import { getPath } from 'utils/route-map';
 import Create from './Create';
 
-@inject('rootStore')
+export class Edit extends Create {
-@observer
-export default class Edit extends Create {
   static id = 'edit-template';
 
   static title = t('Update Template');
@@ -44,3 +42,5 @@ export default class Edit extends Create {
     return Promise.resolve(true);
   }
 }
+
+export default inject('rootStore')(observer(Edit));

src/pages/identity/containers/Domain/Detail/index.jsx

@@ -19,9 +19,7 @@ import { DomainStore } from 'stores/keystone/domain';
 import Base from 'containers/TabDetail';
 import User from '../../User';
 
-@inject('rootStore')
+export class DomainDetail extends Base {
-@observer
-export default class DomainDetail extends Base {
   get name() {
     return t('domain');
   }
@@ -84,3 +82,5 @@ export default class DomainDetail extends Base {
     this.store = new DomainStore();
   }
 }
+
+export default inject('rootStore')(observer(DomainDetail));

src/pages/identity/containers/Domain/actions/Create.jsx

@@ -17,9 +17,7 @@ import globalDomainStore from 'stores/keystone/domain';
 import { FormAction } from 'containers/Action';
 import { statusTypes } from 'utils/constants';
 
-@inject('rootStore')
+export class CreateForm extends FormAction {
-@observer
-class CreateForm extends FormAction {
   init() {
     this.store = globalDomainStore;
   }
@@ -102,4 +100,4 @@ class CreateForm extends FormAction {
   };
 }
 
-export default CreateForm;
+export default inject('rootStore')(observer(CreateForm));