How to use the mobx-react.PropTypes.objectOrObservableObject function in mobx-react

To help you get started, we’ve selected a few mobx-react examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github binary-com / binary-static / src / javascript / app_2 / App / Containers / Routes / routes.jsx View on Github external
import React                          from 'react';
import { withRouter }                 from 'react-router';
import { connect }                    from 'Stores/connect';
import ErrorComponent                 from '../../Components/Elements/Errors';
import BinaryRoutes                   from '../../Components/Routes';

const Routes = (props) => {
    if (props.has_error) {
        return ;
    }

    return ;
};

Routes.propTypes = {
    error    : MobxPropTypes.objectOrObservableObject,
    has_error: PropTypes.bool,
};

// need to wrap withRouter around connect
// to prevent updates on  from being blocked
export default withRouter(connect(
    ({ common }) => ({
        error    : common.error,
        has_error: common.has_error,
    })
)(Routes));
github Alethio / ui / src / control / accordion / AccordionHorizontal.tsx View on Github external
* 
 * ```
 */
@observer
export class AccordionHorizontal
extends React.Component> {
    static defaultProps: Pick, "contentAnimSeconds"> = {
        contentAnimSeconds: .2
    };

    // We use legacy context because the accordion and the children
    // may be instantiated from different apps library instances and the createContext API won't work in this case
    /** @internal */
    static childContextTypes = {
        // Just so we don't have to import react prop-types. We don't care about the shape anyway
        accordionState: PropTypes.objectOrObservableObject
    };
    /** @internal */
    private accordionState: AccordionState;

    @observable
    private expanderEls = new Map();
    private containerOffsetLeft: number | undefined;

    constructor(props: IAccordionHorizontalProps) {
        super(props);

        this.accordionState = new AccordionState(this.props.onContentError);
    }

    /** @internal */
    getChildContext() {
github caicloud / cyclone / web / src / components / workflow / component / list / ListLayout.js View on Github external
const { Content, Sider } = Layout;

@inject('workflow', 'project')
@observer
// TODO(qme): remove useless file
class List extends React.Component {
  static propTypes = {
    workflow: PropTypes.shape({
      workflowList: PropTypes.object,
      listWorklow: PropTypes.func,
    }),
    history: PropTypes.object,
    match: PropTypes.object,
    project: PropTypes.shape({
      listProjects: PropTypes.func,
      projectList: MobxPropTypes.objectOrObservableObject,
    }),
  };

  componentDidMount() {
    const {
      history: { location },
    } = this.props;
    const query = qs.parse(location.search);
    this.props.project.listProjects({ sort: true, ascending: false }, list => {
      const firstProject =
        query.project || _.get(list, 'items.[0].metadata.name');
      this.props.workflow.listWorklow(firstProject, {
        sort: true,
        ascending: false,
      });
      this.props.history.replace(`/workflow?project=${firstProject}`);
github Alethio / ui / src / control / accordion / AccordionVertical.tsx View on Github external
* 
 * ```
 */
@observer
export class AccordionVertical
extends React.Component> {
    static defaultProps: Pick, "contentAnimSeconds"> = {
        contentAnimSeconds: .2
    };

    // We use legacy context because the accordion and the children
    // may be instantiated from different apps library instances and the createContext API won't work in this case
    /** @internal */
    static childContextTypes = {
        // Just so we don't have to import react prop-types. We don't care about the shape anyway
        accordionState: PropTypes.objectOrObservableObject
    };
    /** @internal */
    private accordionState: AccordionState;

    @observable
    private expanderEls = new Map();
    @observable
    private fixedExpanderWidth: number | undefined;
    private containerOffsetLeft: number | undefined;
    private widthWatchDisposer: IReactionDisposer | undefined;
    private refreshDisposer: IReactionDisposer | undefined;

    constructor(props: IAccordionVerticalProps) {
        super(props);

        this.accordionState = new AccordionState(this.props.onContentError);
github Alethio / ui / src / control / accordion / AccordionItem.tsx View on Github external
import * as React from "react";
import { IAccordionItemConfig } from "./IAccordionItemConfig";
import { PropTypes } from "mobx-react";
import { AccordionState } from "./internal/AccordionState";

/**
 * Component that can be passed as a child to AccordionHorizontal and AccordionVertical instances.
 *
 * The props that it receives depends on the `TAccordionItemConfig` generic type parameter and are also accessible
 * by the Accordion* instance in it's render* callback props.
 */
export class AccordionItem
extends React.Component {
    static contextTypes = {
        accordionState: PropTypes.objectOrObservableObject
    };

    /** @internal */
    context: {
        accordionState: AccordionState;
    };

    private itemConfig: TAccordionItemConfig;

    componentDidMount() {
        this.itemConfig = this.props;
        this.context.accordionState.addItem(this.itemConfig);
    }

    componentDidUpdate() {
        let oldItemConfig = this.itemConfig;
github communicode / communikey-frontend / src / BaseLayout.js View on Github external
*/
  userStore: MobXPropTypes.observableArray,

  /**
   * @type {ObservableArray} userStore - The injected user group store
   */
  userGroupStore: MobXPropTypes.observableArray,

  /**
   * @type {ObservableArray} invocationHelper - The injected invocation helper instance
   */
  invocationHelper: MobXPropTypes.observableArray,
  /**
   * @type {ObservableArray} encryptionJobStore - The injected encryption job store
   */
  encryptionJobStore: MobXPropTypes.objectOrObservableObject,

  /**
   * @type {ObservableArray} tagStore - The injected tag store
   */
  tagStore: MobXPropTypes.observableArray,

  /**
   * @type {object} passphraseNeeded - The state object that invokes a passphrase modal
   */
  passphraseNeeded: PropTypes.bool,

  /**
   * @type {object} passphraseNeededResolve - The state object that resolves the passphraseNeeded promise
   */
  passphraseNeededResolve: PropTypes.func,
github binary-com / binary-static / src / javascript / app_2 / Modules / Trading / Components / Form / ContractType / contract-type-list.jsx View on Github external
contracts={list[key]}
                            name={name}
                            value={value}
                            handleSelect={handleSelect}
                            handleInfoClick={handleInfoClick}
                        />
                    
                
            
        ))
    );

ContractTypeList.propTypes = {
    handleInfoClick: PropTypes.func,
    handleSelect   : PropTypes.func,
    list           : MobxPropTypes.objectOrObservableObject,
    name           : PropTypes.string,
    value          : PropTypes.string,
};

export default ContractTypeList;
github tomitrescak / apollo-redux-tools / src / mobx.tsx View on Github external
return function provideFromContext<p>(WrappedComponent: React.ComponentClass</p><p> | React.StatelessComponent</p><p>): React.StatelessComponent {
    const func = (props: any, context: any) =&gt; {
      const extraProps = {};
      for (let name of names) {
        extraProps[name] = context.mobxStores[name];
      }
      return ;
    };
    func.displayName = `Connect(${WrappedComponent.displayName || 'Component'})`;
    func.contextTypes = {
      mobxStores: PropTypes.objectOrObservableObject
    };
    return observer(func) as any;
  };
}</p>