Left and Right Drawers with React Navigation

App.js

import React, { Component } from 'react';
import { Text } from 'react-native';
import { DrawerNavigator } from 'react-navigation';

const ContentScreen = ({ navigation }) => (
  <Text>Content Hello World</Text>
);

const LeftDrawerScreen = ({ navigation }) => (
  <Text>Left Drawer</Text>
);

const RightDrawerScreen = ({ navigation }) => (
  <Text>Right Drawer</Text>
);

const ContentNavigator = DrawerNavigator({
  Content: {
    screen: ContentScreen,
  }
}, {
  contentComponent: RightDrawerScreen,
  drawerPosition: 'right'
});

const RootNavigator = DrawerNavigator({
  Child: {
    screen: ContentNavigator,
  }
}, {
  contentComponent: LeftDrawerScreen
});

export default class App extends Component {
  render() {
    return (<RootNavigator />);
  }
}

I have solved the problem by using react-native-reanimated and an overlay View on the top of other components :). I thought this is going to put me in trouble while I'm going to have a deep nested navigation