mobx-react#Provider JavaScript Examples

The following examples show how to use mobx-react#Provider. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: Root.js    From surveillance-forms with MIT License 6 votes vote down vote up
Root = () => {
  return (
    <MuiThemeProvider theme={theme}>
      <Provider
        languageStore={languageStore}
        notificationStore={notificationStore}
      >
        <Router basename="/">
          <Switch>
            <Route
              path=""
              component={App}
            />
          </Switch>
        </Router>
      </Provider>
    </MuiThemeProvider>
  );
}
Example #2
Source File: index.js    From discern with BSD 3-Clause "New" or "Revised" License 6 votes vote down vote up
//打包时,用的HashRouter并加上了basename,因为放在服务器的二级目录下
ReactDOM.render(
  <HashRouter>
    <LocaleProvider locale={zh_CN}>
      <Provider {...store}>
        <App />
      </Provider>
    </LocaleProvider>
  </HashRouter>,
  document.getElementById('root'));
Example #3
Source File: App.js    From dm2 with Apache License 2.0 6 votes vote down vote up
AppComponent = ({ app }) => {
  return (
    <ErrorBoundary>
      <Provider store={app}>
        <SDKProvider sdk={app.SDK}>
          <Block name="root" mod={{ mode: app.SDK.mode }}>
            {app.crashed ? (
              <Block name="crash">
                <Elem name="header">Oops...</Elem>
                <Elem name="description">
                  Project has been deleted or not yet created.
                </Elem>
              </Block>
            ) : app.loading ? (
              <Block name="app-loader">
                <Spinner size="large" />
              </Block>
            ) : app.isLabeling ? (
              <Labeling />
            ) : (
              <DataManager />
            )}
            <Block name={"offscreen-lsf"} />
          </Block>
        </SDKProvider>
      </Provider>
    </ErrorBoundary>
  );
}
Example #4
Source File: index.js    From aircon with GNU General Public License v3.0 6 votes vote down vote up
//打包时,用的HashRouter并加上了basename,因为放在服务器的二级目录下
ReactDOM.render(
  <Router history={history}>
    <LocaleProvider locale={zh_CN}>
      <Provider {...store}>
        <App />
      </Provider>
    </LocaleProvider>
  </Router>,
  document.getElementById('root')
);
Example #5
Source File: App.js    From front-app with MIT License 6 votes vote down vote up
App = () => {
  const [storeLoaded, setStoreLoaded] = useState(false)

  useEffect(() => {
    const hydrate = create()
    async function hydrateStore() {
      await hydrate('userStore', stores.userStore)
      await hydrate('chatStore', stores.chatStore)
      await hydrate('luckyStore', stores.luckyStore)
    }
    hydrateStore().then(() => setStoreLoaded(true))
  }, [])

  return (
    <Provider {...stores}>
      <Router history={browserHistory}>
        <Route path={'/adminLogin'} component={AdminLoginPage} />
        <Route path={'/admin'} render={() => (getTokenVerification().length > 0 ? <AdminMainPage /> : <Redirect to={'/adminLogin'} />)} />
        {storeLoaded ? (
          <Switch>
            <Route exact path={'/'} component={MainPage} />
            <Route path={'/login'} component={LoginPage} />
            <Route path={'/loginSuccess'} component={LoginSuccessPage} />
            <Route path={'/signup'} component={SignupPage} />
          </Switch>
        ) : null}
      </Router>
    </Provider>
  )
}
Example #6
Source File: index.js    From hzero-front with Apache License 2.0 6 votes vote down vote up
render() {
    const { level = 'site' } = getCurrentRole();
    const { tenantId = 0, tenantName } = getCurrentTenant();
    const language = getCurrentLanguage();
    const currentLanguage = language.replace('-', '_');
    const AppState = {
      currentLanguage,
      currentMenuType: {
        type: level,
        organizationId: tenantId,
        id: tenantId,
        name: tenantName,
      },
    };

    return (
      <Provider AppState={AppState}>
        <LowCodeSharedComponent componentCode="ModelProvider" componentProps={this.props} />
      </Provider>
    );
  }
Example #7
Source File: App.js    From label-studio-frontend with Apache License 2.0 5 votes vote down vote up
render() {
    const { store } = this.props;
    const as = store.annotationStore;
    const root = as.selected && as.selected.root;
    const { settings } = store;

    if (store.isLoading) return this.renderLoader();

    if (store.noTask) return this.renderNothingToLabel(store);

    if (store.noAccess) return this.renderNoAccess();

    if (store.labeledSuccess) return this.renderSuccess();

    if (!root) return this.renderNoAnnotation();

    const viewingAll = as.viewingAllAnnotations || as.viewingAllPredictions;

    const mainContent = (
      <Block name="main-content">
        {as.validation === null
          ? this._renderUI(as.selectedHistory?.root ?? root, as)
          : this.renderConfigValidationException(store)}
      </Block>
    );

    const newUIEnabled = isFF(FF_DEV_1170);

    return (
      <Block name="editor" mod={{ fullscreen: settings.fullscreen }}>
        <Settings store={store} />
        <Provider store={store}>
          {store.showingDescription && (
            <Segment>
              <div dangerouslySetInnerHTML={{ __html: store.description }} />
            </Segment>
          )}

          {isDefined(store) && store.hasInterface('topbar') && <TopBar store={store}/>}
          <Block name="wrapper" mod={{ viewAll: viewingAll, bsp: settings.bottomSidePanel || newUIEnabled }}>
            {newUIEnabled ? (
              <SidePanels
                panelsHidden={viewingAll}
                currentEntity={as.selected}
                regions={as.selected.regionStore}
              >
                {mainContent}
              </SidePanels>
            ) : (
              <>
                {mainContent}
 
                {(viewingAll === false) && (
                  <Block name="menu" mod={{ bsp: settings.bottomSidePanel }}>
                    {store.hasInterface("side-column") && (
                      <SidebarTabs active="annotation">
                        <SidebarPage name="annotation" title="Annotation">
                          <AnnotationTab store={store}/>
                        </SidebarPage>
 
                        {this.props.panels.map(({ name, title, Component }) => (
                          <SidebarPage key={name} name={name} title={title}>
                            <Component/>
                          </SidebarPage>
                        ))}
                      </SidebarTabs>
                    )}
                  </Block>
                )}
              </>
            )}
 
          </Block>
        </Provider>
        {store.hasInterface("debug") && <Debug store={store} />}
      </Block>
    );
  }