BrodaNoel

import React from 'react';
import { View, TouchableOpacity } from 'react-native';
import duix from 'duix';

class Login extends React.Component {
  onLoginClick = () => {
    // here you do something to login the user
    // ...
    
    // then redirect to the Home page

BrodaNoel

import React from 'react';
import { View, TouchableOpacity } from 'react-native';
import duix from 'duix';

class Home extends React.Component {
  onLogOutClick = () => {
    // here you do something to logout the user
    // ...
    
    // then redirect to the Login page again

BrodaNoel

import React, { Component } from 'react';
import duix from 'duix';
// Pages
import Loading from './src/pages/Loading';
import Login from './src/pages/Login';
import Home from './src/pages/Home';
import Contact from './src/pages/Contact';
// ...more dependencies...

const DEFAULT_PAGE = 'Loading';

BrodaNoel

const unsubscribe = duix.subscribe('x', (x) => console.log(x));
unsubscribe();

BrodaNoel

duix.subscribe('user', (user) => {
  console.log(user);
});
// or
duix.subscribe('user', (newUserValue, prevUserValue) => {
  console.log('New User value is:', newUserValue);
  console.log('Previous User value was:', prevUserValue);
});

BrodaNoel

const user = duix.get('user');
// or
const isLogged = duix.get('isUserLogged');
// or whatever

BrodaNoel

duix.set('user', { name: 'Noel' });
// or
duix.set('isUserLogged', true);
// or whatever

BrodaNoel

// src/components/Conditional.jsx
const Conditional = (props) => {
  return(
    !!props.if && props.children
  );
}

export default Conditional;

// Implementation:

BrodaNoel

// src/components/Conditional.jsx
const Conditional = (props) => {
  return(
    !!props.if && props.children
  );
}

export default Conditional;

// Implementation:

BrodaNoel

// Option 1
render() {
  return (
    <div className="App">
      <h1>The title</h1>
      {
        this.state.movies.length > 0 && (
          <h1>Movie list</h1>
          <MovieList data={this.state.movies} />
        )