Cannot open screen in tab scene

[tomexa]

Hi,
I've encountered a problem and been banging my head against the walls to figure it out.
Initially I had this setup:

<Scene key='root'>
  <Scene key='splash' initial hideNavBar component={SplashScreen} />
  <Scene key='login' hideNavBar component={Login} title='Login' />
</Scene>

My splashscreen simply displays an animation and I call NavigationActions.login() and it works perfectly.

Once my login and signup logic implemented, I wanted to add the core of the app, which will have a tab navigation, so I modified my navigation to this:

  <Scene key='root'>
    <Scene key='splash' initial hideNavBar component={SplashScreen} />
    <Scene key='login' hideNavBar component={Login} title='Login' />
    <Scene key='tabbar' tabs={true} tabBarStyle={{ backgroundColor: '#CCCCCC', borderTopWidth:0 }} tabBarSelectedItemStyle={{backgroundColor: '#ffffff'}}> 
      <Scene key="dashtab" title="dash" icon={TabIcon}>
        <Scene key="dashboard" hideNavBar={true} component={Dashboard}/> 
      </Scene>
      <Scene key="messtab" title="mess" icon={TabIcon}>
        <Scene key="messages" hideNavBar={true} component={Messages}/> 
      </Scene>
    </Scene>
  </Scene>

In my LoginSaga, if the login is a succes I call NavigatorActions.dashboard() but NOTHING happens, no error, no log, nothing.
At first I thought it was because I was in a saga, so to be sure, I replaced the NavigationActions.login() in my splashscreen by NavigationActions.dashboard(), and after the animation, the splashscreen stays on, nothing happens.
I also tried this setup with no success:

  <Scene key='root'>
    <Scene key='tabbar' tabs={true} tabBarStyle={{ backgroundColor: '#CCCCCC', borderTopWidth:0 }} tabBarSelectedItemStyle={{backgroundColor: '#ffffff'}}> 
      <Scene key='splash' hideNavBar component={SplashScreen} />
      <Scene key='login' hideNavBar component={Login} title='Login' />
      <Scene key="dashtab" title="dash" icon={TabIcon}>
        <Scene key="dashboard" hideNavBar={true} component={Dashboard}/> 
      </Scene>
      <Scene key="messtab" title="mess" icon={TabIcon}>
        <Scene key="messages" hideNavBar={true} component={Messages}/> 
      </Scene>
    </Scene>
  </Scene>

But if I remove the splash and login scenes, the app displays the dashboard screen with no problem!...

What am I missing???

Full files:

NavigationRouter.js

import React, { Component } from 'react'
import { Actions, Scene, Router } from 'react-native-router-flux'
import Icon from 'react-native-vector-icons/Ionicons'
// screens identified by the router
import SplashScreen from '../Containers/SplashScreen'
import Login from '../Containers/LoginScreen'
import Dashboard from '../Containers/DashboardScreen'
import Messages from '../Containers/MessagesScreen'

const getIconName = (title) => {
  switch (title) {
    case 'dash':
      return 'ios-clipboard';
    case 'mess':
      return 'ios-list-box';
  }
}

const TabIcon = ({ selected, title }) => {
  return (
    <Icon name={getIconName(title)} size={30} color={selected ? '#6fa3f2' : '#444'} />
  );
}

const scenes = Actions.create(
  <Scene key='root'>
    <Scene key='splash' hideNavBar component={SplashScreen} />
    <Scene key='login' hideNavBar component={Login} title='Login' />
    <Scene key='tabbar' tabs={true} tabBarStyle={{ backgroundColor: '#CCCCCC', borderTopWidth:0 }} tabBarSelectedItemStyle={{backgroundColor: '#ffffff'}}> 
      <Scene key="dashtab" title="dash" icon={TabIcon}>
        <Scene key="dashboard" hideNavBar={true} component={Dashboard}/> 
      </Scene>
      <Scene key="messtab" title="mess" icon={TabIcon}>
        <Scene key="messages" hideNavBar={true} component={Messages}/> 
      </Scene>
    </Scene>
  </Scene>
);

class NavigationRouter extends Component {
  render () {
    return (
      <Router scenes={scenes}/>
    )
  }
}


export default NavigationRouter

SplashScreen.js:

import React from 'react';
import {
  Image,
  View,
  StatusBar,
  Animated,
  StyleSheet,
  Text
} from 'react-native';
import { Actions as NavigationActions } from 'react-native-router-flux'
import { Images } from '../Themes'
import LinearGradient from 'react-native-linear-gradient';

var styles = StyleSheet.create({
  linearGradient: {
    flex: 1,
    justifyContent:'center', 
    alignItems: 'center',
    width:'100%'
  }
});

export default class SplashScreen extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      logoOpacity: new Animated.Value(0)
    }
  }

  componentDidMount() {
    StatusBar.setHidden(true, 'none');
    Animated.timing(
      this.state.logoOpacity,
      {
        toValue: 1,
        duration: 4000,
        useNativeDriver: true,
      }
    ).start(() => setTimeout(() =>{
      StatusBar.setHidden(false, 'slide');  
      NavigationActions.dashboard()
      },1000));
  }

  render() {
    return (
      
          <LinearGradient colors={['#444444', '#000000']} style={styles.linearGradient}>
            <Animated.Image style={{width:'70%', opacity:this.state.logoOpacity}} resizeMode='contain' source={Images.splashLogo}/>
          </LinearGradient>
      
    )
  }
}

Dashboard.js:

import React from 'react'
import { ScrollView, Text, Image, View } from 'react-native'
import { Button, Text as NBText } from 'native-base'
import { Images } from '../Themes'

// Styles
import styles from './Styles/LaunchScreenStyles'

export default class DashboardScreen extends React.Component {

  render () {
    return (
      <View style={styles.mainContainer}>
        <Image source={Images.background} style={styles.backgroundImage} resizeMode='stretch' />
        <ScrollView style={styles.container}>
          <View style={styles.centered}>
            <Image source={Images.launch} style={styles.logo} />
          </View>

          <View style={styles.section} >
            <Image source={Images.ready} />
            <Text style={styles.sectionText}>
              {"Dashboard"}
            </Text>
          </View>
          <Button style={{alignSelf: 'center'}} onPress={()=> this.context.drawer.open()}>
            <NBText>Explore!</NBText>
          </Button>
        </ScrollView>
      </View>
    )
  }
}

[tomexa]

Damn! It works if call NavigatorActions.tabbar() !
I thought it was kind of an 'abstract' scene that couldn't be navigated to...