Implement full functionality of Sardonyx as per PR #6

Merge dev into master.

.babelrc

@@ -1,8 +1,3 @@
 {
-  "presets": ["babel-preset-expo"],
-  "env": {
-    "development": {
-      "plugins": ["transform-react-jsx-source"]
-    }
-  }
+  "presets": ["babel-preset-expo", "module:metro-react-native-babel-preset", "module:react-native-dotenv"]
 }

.expo-shared/assets.json

@@ -0,0 +1,8 @@
+{
+  "bd6748ac5be7f1a5c1522781d1f33af864708b0081df5baab0887af4d4a5c2f7": true,
+  "e6e9651290bbacde07ee6c5b4c2a8c0d1c7fa70d0e5b76c9b4c4ec6d4f450bf6": true,
+  "a98715892a6e79ca196309d93447ccf112297e4406f20d053339a30a02362791": true,
+  "9d3d899886d1cfd87d7e836918c29ec6fd85d9e70420e3b480bef982dd1affd7": true,
+  "e523d02520fef1d6098f3a03e63e7a77f1591fdd36c9711c57eebf2280ecf9ef": true,
+  "fb6af41a39e818259990a31edaf9abf2bbe8a122466aea288bdf0514967aa5df": true
+}

.gitignore

@@ -11,10 +11,7 @@
 /node_modules
 
 # misc
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
+env.json
 
 npm-debug.log*
 yarn-debug.log*

App.js

@@ -1,63 +1,143 @@
+import React from 'react';
+
 import {
   createSwitchNavigator,
-  createStackNavigator,
-} from "react-navigation";
-
+  createAppContainer,
+  createStackNavigator
+} from 'react-navigation';
+import { useScreens } from 'react-native-screens';
 import { createMaterialBottomTabNavigator } from 'react-navigation-material-bottom-tabs';
+import * as Font from 'expo-font';
+import { Provider } from 'react-redux';
+import configureStore from './configureStore';
+import { PersistGate } from 'redux-persist/integration/react';
 
 import ManagebacStack from './src/ManagebacStack';
-import ChatStack from './src/ChatStack';
-import ProfileStack from './src/ProfileStack';
+import ManagebacMessageEditorScreen from './src/screens/ManagebacMessageEditorScreen';
+import ManagebacEditCASReflectionScreen from './src/screens/ManagebacEditCASReflectionScreen';
+import ManagebacAddCASReflectionScreen from './src/screens/ManagebacAddCASReflectionScreen';
+import TasksStack from './src/TasksStack';
+import TasksLabelsFilterScreen from './src/screens/TasksLabelsFilterScreen';
+import SettingsStack from './src/SettingsStack';
 import LoginCheckScreen from './src/screens/LoginCheckScreen';
 import LoginScreen from './src/screens/LoginScreen';
-import LogoutScreen from './src/screens/LogoutScreen';
 
-import { colors } from './src/styles';
+import { colors, fonts } from './src/styles';
+
+const { store, persistor } = configureStore();
+
+// Use native screens for faster performance in Navigators
+useScreens();
 
 // The main app navigation stack.
 // Screens made later on (individual message screens, feed, or whatever) will be added here
-const AppStack = createMaterialBottomTabNavigator(
+const AppMaterialBottomBar = createMaterialBottomTabNavigator(
   {
     ManagebacTabs: ManagebacStack,
-    ChatTabs: ChatStack,
-    ProfileTabs: ProfileStack
+    TasksTabs: TasksStack,
+    SettingsTabs: SettingsStack
   },
   {
-    initialRouteName: 'ChatTabs',
+    initialRouteName: 'ManagebacTabs',
     shifting: true,
     activeColor: colors.primary,
     inactiveColor: colors.inactive,
-    barStyle: { backgroundColor: colors.white }
+    barStyle: {
+      backgroundColor: colors.white
+    },
+    navigationOptions: {
+      header: null
+    }
   }
 );
 
-// The login navigation stack
-// Login authentication is an entirely different process and should be treated with a different
-// navigation stack using a switchNavigator
-const LoginStack = createStackNavigator(
+// Here we define some screens that will go over the tab bar, such as Message Editors.
+// We could also manually hide the tab bar in specific screens inside ManagebacTabs, but it leads
+// to undesired glitchy keyboard effects
+const AppStack = createStackNavigator(
   {
-    Login: LoginScreen,
-    Logout: LogoutScreen
+    AppMaterialBottomBar,
+    MessageEditor: ManagebacMessageEditorScreen,
+    EditCASReflection: ManagebacEditCASReflectionScreen,
+    AddCASReflection: ManagebacAddCASReflectionScreen,
+    LabelsFilter: TasksLabelsFilterScreen, // Choose labels for filtering the tasklist
   },
   {
-    navigationOptions: {
-      header: null // Hide the default empty header bar for all child elements
+    initialRouteName: 'AppMaterialBottomBar',
+    defaultNavigationOptions: {
+      headerStyle: {
+        backgroundColor: colors.blue
+      },
+      headerTintColor: colors.white,
+      headerTitleStyle: {
+        fontWeight: 'normal',
+        ...fonts.jost400
+      }
     }
   }
 );
 
 // https://reactnavigation.org/docs/en/auth-flow.html
 // Switch navigators make sure the app nav stack and auth nav stack are two different things
 // and that you can't back-button into one another
-export default createSwitchNavigator(
-  {
-    // Make sure no names for screens overlap (e.g. LoginStack and Login), since they are unique
-    //  identifiers that can be navigated to from anywhere in the app
-    LoginCheck: LoginCheckScreen,
-    AppStack: AppStack, // navigators can contain navigators
-    LoginStack: LoginStack
-  },
-  {
-    initialRouteName: 'LoginCheck'
+const AppContainer = createAppContainer(
+  createSwitchNavigator(
+    {
+      // Make sure no names for screens overlap (e.g. LoginStack and Login), since they are unique
+      //  identifiers that can be navigated to from anywhere in the app
+      LoginCheck: LoginCheckScreen,
+      AppStack: AppStack,
+      Login: LoginScreen
+    },
+    {
+      initialRouteName: 'LoginCheck'
+    }
+  )
+);
+
+export default class Root extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      fontLoaded: false
+    };
   }
-);
+
+  componentDidMount() {
+    Font.loadAsync({
+      'Jost-200': require('./src/assets/Jost-200-Thin.otf'),
+      'Jost-300': require('./src/assets/Jost-300-Light.otf'),
+      'Jost-400': require('./src/assets/Jost-400-Book.otf'),
+      'Jost-500': require('./src/assets/Jost-500-Medium.otf'),
+      'Jost-800': require('./src/assets/Jost-800-Heavy.otf')
+    }).then(() => {
+      this.setState({
+        fontLoaded: true
+      });
+    });
+  }
+  // I'm sure we're going to have to use state managers like Redux, and when that happens,
+  // wrap this AppContainer in a Store Provider.
+  render() {
+    return (
+      this.state.fontLoaded && (
+        <Provider store={store}>
+          <PersistGate loading={null} persistor={persistor}>
+            <AppContainer />
+          </PersistGate>
+        </Provider>
+      )
+    );
+  }
+}
+
+Expo.registerRootComponent(Root);
+
+// To ignore warnings for WebSocket, which is completely fine to use.
+// See this page: https://stackoverflow.com/questions/53638667/unrecognized-websocket-connection-options-agent-permessagedeflate-pfx
+console.ignoredYellowBox = ['Remote debugger'];
+import { YellowBox } from 'react-native';
+YellowBox.ignoreWarnings([
+  'Unrecognized WebSocket connection option(s) `agent`, `perMessageDeflate`, `pfx`, `key`, `passphrase`, `cert`, `ca`, `ciphers`, `rejectUnauthorized`. Did you mean to put these under `headers`?'
+]);