warnings on program start for every TabScene in Tabs (but works correctly)

[nielsmadan]

Version

Tell us which versions you are using:

• react-native-router-flux v4.0.0beta.21
• react-native v0.47.1

Expected behaviour

No warnings on program start

Actual behaviour

Warnings for every Tabscene in my Tabs.

Steps to reproduce

"use strict";

import React, { Component } from "react";

import { Provider } from "react-redux";
import { createStore, applyMiddleware } from "redux";
import thunk from "redux-thunk";

import {
  Details,
  Filter,
  EventList,
  Status,
  EventDetails,
  Splash,
  Select,
} from "eventplanner/src/ui/pages";

import { Router, Stack, Scene, Tabs, TabScene } from "react-native-router-flux";

import initialStore from "app/src/data/initial";
import reducer from "app/src/data/reducers";

import TabIcon from "app/src/TabIcon";

const store = createStore(reducer, initialStore, applyMiddleware(thunk));

const App = () =>
  <Router>
    <Stack key="root">
      <Scene key="splash" component={Splash} title="Splash" />
      <Stack key="eventselectflow">
        <Scene key="eventlist" component={EventList} title="Event List" />
        <Scene key="eventdetails" component={EventDetails} title="Event Details" />
      </Stack>
      <Tabs key="home" hideNavBar lazy>
        <Stack key="selectflow" tabBarLabel="Select" icon={TabIcon}>
          <TabScene key="select" component={Select} title="Select" />
          <TabScene key="filter" component={Filter} title="filter" />
        </Stack>
        <Stack key="statusflow" tabBarLabel="Status" icon={TabIcon}>
          <TabScene key="status" component={Status} title="Status" />
          <TabScene key="details" component={Details} title="Details" />
        </Stack>
      </Tabs>
    </Stack>
  </Router>;

export default class Application extends Component {
  render = () => {
    return (
      <Provider store={store}>
        <App />
      </Provider>
    );
  };
}

Tried to migrate from react-navigation to router-flux. When I start the app I get warning like this:

<Warning>: Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.

	Check your code at index.js:47.
	    in App (at index.js:57)
	    in Provider (at index.js:56)
	    in Application (at renderApplication.js:35)
	    in RCTView (at View.js:113)
	    in View (at AppContainer.js:100)
	    in RCTView (at View.js:113)
	    in View (at AppContainer.js:121)
	    in AppContainer (at renderApplication.js:34)

These directly corresponds to the number of tabs I have (and the lines in the warning correspond those lines). After I dismiss the warning, everything looks and works correctly.

[mcabs3]

Have you tried using just a regular Scene instead of TabScene?

[nielsmadan]

Fixed it. I guess the stack acts as the tabscene in this setup? What was it complaining about, though, when everything looked correct?