upgrade root navigation

This commit is contained in:
ammarahm-ed
2020-05-06 01:55:05 +05:00
parent 41354fdf7c
commit 8fee81dc79
21 changed files with 120 additions and 298 deletions

View File

@@ -1,9 +1,13 @@
import "react-native-gesture-handler";
import 'react-native-get-random-values'
import { enableScreens } from 'react-native-screens';
import { AppRegistry } from 'react-native';
import App from './App';
import { name as appName } from './app.json';
import React from 'react';
import { Provider } from './src/provider';
enableScreens();
const AppProvider = () => {
return (
<Provider>

View File

@@ -1,17 +1,15 @@
import React, { useEffect, createRef } from 'react';
import React, {createRef, useEffect} from 'react';
import {Platform, StatusBar, View} from 'react-native';
import * as Animatable from 'react-native-animatable';
import Animated from 'react-native-reanimated';
import {Menu} from './src/components/Menu';
import * as Animatable from 'react-native-animatable';
import SideMenu from './src/components/SideMenu';
import { EditorPosition, EditorOpacity } from './src/utils/animations';
import {useTracked} from './src/provider';
import {EditorOpacity, EditorPosition} from './src/utils/animations';
import {sideMenuRef} from './src/utils/refs';
import {DDS, w} from './src/utils/utils';
import Editor from './src/views/Editor';
import { useTracked } from './src/provider';
import { StatusBar, Platform } from 'react-native';
import { AppContainer } from './src/services/AppContainer';
import NavigationService from './src/services/NavigationService';
import { useSafeArea } from 'react-native-safe-area-context';
import {NavigationStack} from './src/services/Navigator';
const editorRef = createRef();
export const Initialize = () => {
@@ -52,16 +50,14 @@ export const Initialize = () => {
/>
}
openMenuOffset={w / 1.5}>
<AppContainer
<View
style={{
width: DDS.isTab ? '70%' : '100%',
height: '100%',
backgroundColor: colors.bg,
}}
ref={navigatorRef => {
NavigationService.setTopLevelNavigator(navigatorRef);
}}
/>
}}>
<NavigationStack />
</View>
</SideMenu>
<Animated.View

View File

@@ -4,16 +4,11 @@ import * as Animatable from 'react-native-animatable';
import { Menu } from './src/components/Menu';
import { ModalMenu } from './src/components/ModalMenu';
import { useTracked } from './src/provider';
import { eSendEvent, eSubscribeEvent } from './src/services/eventManager';
import { eCloseFullscreenEditor, eOnLoadNote, eOpenFullscreenEditor } from './src/services/events';
import { NavigationStack } from './src/services/Navigator';
import Editor from './src/views/Editor';
import { eSubscribeEvent, eSendEvent } from './src/services/eventManager';
import {
eOpenFullscreenEditor,
eCloseFullscreenEditor,
eOnLoadNote,
} from './src/services/events';
import { AppContainer } from './src/services/AppContainer';
import NavigationService from './src/services/NavigationService';
const editorRef = createRef();
let outColors;
@@ -104,15 +99,7 @@ export const Initialize = () => {
borderRightColor: colors.nav,
borderRightWidth: 2,
}}>
<AppContainer
style={{
width: '100%',
height: '100%',
}}
ref={navigatorRef => {
NavigationService.setTopLevelNavigator(navigatorRef);
}}
/>
<NavigationStack />
</Animatable.View>
<View
ref={editorRef}

View File

@@ -1,37 +1,17 @@
import React, { Component } from 'react';
import {
eSubscribeEvent,
eUnSubscribeEvent,
openVault,
} from '../../services/eventManager';
import {
eCloseActionSheet,
eCloseAddNotebookDialog,
eCloseAddTopicDialog,
eCloseLoginDialog,
eCloseMoveNoteDialog,
eCloseSimpleDialog,
eOnLoadNote,
eOpenActionSheet,
eOpenAddNotebookDialog,
eOpenAddTopicDialog,
eOpenLoginDialog,
eOpenMoveNoteDialog,
eOpenSimpleDialog,
} from '../../services/events';
import { Platform } from 'react-native';
import { eSubscribeEvent, eUnSubscribeEvent, openVault } from '../../services/eventManager';
import { eCloseActionSheet, eCloseAddNotebookDialog, eCloseAddTopicDialog, eCloseLoginDialog, eCloseMoveNoteDialog, eCloseSimpleDialog, eOnLoadNote, eOpenActionSheet, eOpenAddNotebookDialog, eOpenAddTopicDialog, eOpenLoginDialog, eOpenMoveNoteDialog, eOpenSimpleDialog } from '../../services/events';
import { DDS, hexToRGBA } from '../../utils/utils';
import ActionSheet from '../ActionSheet';
import { ActionSheetComponent } from '../ActionSheetComponent';
import { AddNotebookDialog } from '../AddNotebookDialog';
import { AddTopicDialog } from '../AddTopicDialog';
import { Dialog } from '../Dialog';
import LoginDialog from '../LoginDialog';
import MoveNoteDialog from '../MoveNoteDialog';
import {VaultDialog} from '../VaultDialog';
import {hexToRGBA, DDS} from '../../utils/utils';
import {Platform} from 'react-native';
import {TEMPLATE_DELETE, TEMPLATE_PERMANANT_DELETE} from './templates';
import {moveNoteEvent} from './recievers';
import MergeEditor from '../MergeEditor';
import { VaultDialog } from '../VaultDialog';
import { moveNoteEvent } from './recievers';
import { TEMPLATE_DELETE, TEMPLATE_PERMANANT_DELETE } from './templates';
export class DialogManager extends Component {
constructor(props) {
@@ -307,11 +287,11 @@ export class DialogManager extends Component {
/>
<VaultDialog colors={colors} />
{/*
<MoveNoteDialog
ref={ref => (this.moveNoteDialog = ref)}
colors={colors}
/>
/> */}
<AddTopicDialog
ref={ref => (this.addTopicsDialog = ref)}
@@ -329,7 +309,7 @@ export class DialogManager extends Component {
colors={colors}
/>
<LoginDialog colors={colors} ref={ref => (this.loginDialog = ref)} />
{/* <LoginDialog colors={colors} ref={ref => (this.loginDialog = ref)} /> */}
<MergeEditor />
</>

View File

@@ -1,4 +1,4 @@
import React from 'react';
/* import React from 'react';
import {Modal, TouchableOpacity, View} from 'react-native';
import * as Animatable from 'react-native-animatable';
import {createAppContainer} from 'react-navigation';
@@ -169,3 +169,4 @@ class LoginDialog extends React.Component {
}
export default LoginDialog;
*/

View File

@@ -1,4 +1,4 @@
import React from 'react';
/* import React from 'react';
import {Modal, TouchableOpacity, View} from 'react-native';
import * as Animatable from 'react-native-animatable';
import {createAppContainer} from 'react-navigation';
@@ -175,3 +175,4 @@ class MoveNoteDialog extends React.Component {
}
export default MoveNoteDialog;
*/

View File

@@ -1,6 +0,0 @@
import { TopLevelNavigator } from "./Navigator";
import {
createAppContainer,
} from 'react-navigation';
export const AppContainer = createAppContainer(TopLevelNavigator);

View File

@@ -1,43 +1,19 @@
import {
NavigationActions,
StackActions,
} from 'react-navigation';
import { StackActions } from '@react-navigation/routers';
import { rootNavigatorRef } from '../utils/refs';
let _navigator;
function setTopLevelNavigator(navigatorRef) {
_navigator = navigatorRef;
function navigate(name, params) {
rootNavigatorRef .current?.navigate(name, params);
}
function navigate(routeName, params) {
_navigator.dispatch(
NavigationActions.navigate({
routeName,
params,
}),
);
}
function push(routeName, params) {
_navigator.dispatch(
StackActions.push({
routeName,
params,
}),
);
}
function goBack() {
_navigator.dispatch(NavigationActions.back());
rootNavigatorRef.current?.goBack();
}
// add other navigation functions that you need and export them
function push(...args) {
rootNavigatorRef.current?.dispatch(StackActions.push(...args));
}
export default {
navigate,
push,
goBack,
setTopLevelNavigator,
push,
};

View File

@@ -1,105 +1,44 @@
import Editor from '../views/Editor';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import * as React from 'react';
import Favorites from '../views/Favorites';
import Folders from '../views/Folders';
import ForgotPassword from '../views/ForgotPassword';
import Home from '../views/Home/index';
import Lists from '../views/Lists';
import ListsEditor from '../views/ListsEditor';
import Login from '../views/Login';
import Notebook from '../views/Notebook';
import Notes from '../views/Notes';
import ReminderEditor from '../views/ReminderEditor';
import Reminders from '../views/Reminders';
import Settings from '../views/Settings';
import Signup from '../views/Signup';
import Tags from '../views/Tags';
import Trash from '../views/Trash';
import {createStackNavigator} from 'react-navigation-stack';
import {Animated} from 'react-native';
const fade = props => {
const {position, scene} = props;
const index = scene.index;
const translateX = 0;
const translateY = 0;
import {rootNavigatorRef} from '../utils/refs';
const opacity = position.interpolate({
inputRange: [index - 0.7, index, index + 0.7],
outputRange: [0.7, 1, 0.7],
});
const Stack = createStackNavigator();
return {
opacity,
transform: [{translateX}, {translateY}],
};
};
export const TopLevelNavigator = createStackNavigator(
{
Home: {
screen: Home,
},
Editor: {
screen: Editor,
navigationOptions: {
gesturesEnabled: false,
},
},
Lists: {
screen: Lists,
},
Folders: {
screen: Folders,
},
Favorites: {
screen: Favorites,
},
ListsEditor: {
screen: ListsEditor,
},
Login: {
screen: Login,
},
Signup: {
screen: Signup,
},
ForgotPassword: {
screen: ForgotPassword,
},
Settings: {
screen: Settings,
},
Trash: {
screen: Trash,
},
Notes: {
screen: Notes,
},
Tags: {
screen: Tags,
},
Notebook: {
screen: Notebook,
},
},
{
initialRouteName: 'Home',
defaultNavigationOptions: {
export const NavigationStack = () => {
return (
<NavigationContainer independent={true} ref={rootNavigatorRef}>
<Stack.Navigator
initialRouteName="Home"
screenOptions={{
headerShown:false,
animationEnabled: false,
gestureEnabled: false,
headerStyle: {
backgroundColor: 'transparent',
borderBottomWidth: 0,
height: 0,
},
},
animationEnabled: false,
transitionConfig: () => ({
transitionSpec: {
duration: 0,
timing: Animated.timing,
},
}),
cardOverlayEnabled: true,
cardShadowEnabled: true,
animationEnabled: false,
},
cardOverlayEnabled: false,
cardShadowEnabled: false,
}}>
<Stack.Screen name="Home" component={Home} />
<Stack.Screen name="Folders" component={Folders} />
<Stack.Screen name="Favorites" component={Favorites} />
<Stack.Screen name="Trash" component={Trash} />
<Stack.Screen name="Notes" component={Notes} />
<Stack.Screen name="Tags" component={Tags} />
<Stack.Screen name="Notebook" component={Notebook} />
<Stack.Screen name="Login" component={Login} />
<Stack.Screen name="Signup" component={Signup} />
<Stack.Screen name="Settings" component={Settings} />
</Stack.Navigator>
</NavigationContainer>
);
};

View File

@@ -3,3 +3,4 @@ import {createRef} from 'react';
export const sideMenuRef = createRef();
export const inputRef = createRef();
export const sideMenuOverlayRef = createRef();
export const rootNavigatorRef = createRef();

View File

@@ -1,5 +1,4 @@
import React, {useEffect, useState} from 'react';
import {useIsFocused} from 'react-navigation-hooks';
import Container from '../../components/Container';
import {FavoritesPlaceHolder} from '../../components/ListPlaceholders';
import {NotebookItem} from '../../components/NotebookItem';
@@ -9,7 +8,7 @@ import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions';
import {ToastEvent, w, db} from '../../utils/utils';
import SimpleList from '../../components/SimpleList';
import { useIsFocused } from '@react-navigation/native';
export const Favorites = ({navigation}) => {
const [state, dispatch] = useTracked();
const {colors, selectionMode, favorites} = state;
@@ -118,8 +117,5 @@ export const Favorites = ({navigation}) => {
);
};
Favorites.navigationOptions = {
header: null,
};
export default Favorites;

View File

@@ -1,7 +1,8 @@
import React, {useEffect, useState} from 'react';
import {useIsFocused} from '@react-navigation/native';
import React, {useEffect} from 'react';
import {BackHandler} from 'react-native';
import {useIsFocused} from 'react-navigation-hooks';
import Container from '../../components/Container';
import {AddNotebookEvent} from '../../components/DialogManager/recievers';
import {NotebookPlaceHolder} from '../../components/ListPlaceholders';
import {NotebookItem} from '../../components/NotebookItem';
import SelectionWrapper from '../../components/SelectionWrapper';
@@ -10,12 +11,10 @@ import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions';
import {eSendEvent} from '../../services/eventManager';
import {eScrollEvent} from '../../services/events';
import {slideLeft, slideRight} from '../../utils/animations';
import {ToastEvent, w, db} from '../../utils/utils';
import {AddNotebookEvent} from '../../components/DialogManager/recievers';
import NavigationService from '../../services/NavigationService';
export const Folders = ({navigation}) => {
import {slideRight} from '../../utils/animations';
import {w} from '../../utils/utils';
export const Folders = ({route, navigation}) => {
const [state, dispatch] = useTracked();
const {
colors,
@@ -27,7 +26,7 @@ export const Folders = ({navigation}) => {
let isFocused = useIsFocused();
const handleBackPress = () => {
if (navigation.state.params.isMove) {
if (route.params.isMove) {
return true;
} else {
NavigationService.goBack();
@@ -62,7 +61,7 @@ export const Folders = ({navigation}) => {
};
}, []);
const params = navigation.state.params;
const params = route.params;
const _renderItem = ({item, index}) => (
<SelectionWrapper item={item}>
@@ -129,8 +128,4 @@ export const Folders = ({navigation}) => {
);
};
Folders.navigationOptions = {
header: null,
};
export default Folders;

View File

@@ -1,13 +1,12 @@
import React, {createRef, useEffect} from 'react';
import {SafeAreaView, Text, TouchableOpacity, View} from 'react-native';
import {TextInput} from 'react-native-gesture-handler';
import {useIsFocused} from 'react-navigation-hooks';
import {opacity, pv, SIZE, WEIGHT, DDS} from '../../common/common';
import {Header} from '../../components/header';
import {useTracked} from '../../provider';
import {eSubscribeEvent, eUnSubscribeEvent} from '../../services/eventManager';
import {eLoginDialogNavigateBack} from '../../services/events';
import { useIsFocused } from '@react-navigation/native';
export const ForgotPassword = ({navigation}) => {
const [state, dispatch] = useTracked();
const {colors, isLoginNavigator} = state;

View File

@@ -1,19 +1,18 @@
import React, {useEffect, useState} from 'react';
import {useIsFocused} from 'react-navigation-hooks';
import { useIsFocused } from '@react-navigation/native';
import React, { useEffect } from 'react';
import Container from '../../components/Container';
import { NotesPlaceHolder } from '../../components/ListPlaceholders';
import NoteItem from '../../components/NoteItem';
import SelectionHeader from '../../components/SelectionHeader';
import SelectionWrapper from '../../components/SelectionWrapper';
import SimpleList from '../../components/SimpleList';
import { useTracked } from '../../provider';
import { ACTIONS } from '../../provider/actions';
import { eSendEvent } from '../../services/eventManager';
import {DDS, ToastEvent, db} from '../../utils/utils';
import {eScrollEvent, eOnLoadNote} from '../../services/events';
import { eOnLoadNote, eScrollEvent } from '../../services/events';
import { openEditorAnimation } from '../../utils/animations';
import { sideMenuRef } from '../../utils/refs';
import SimpleList from '../../components/SimpleList';
import {NotesPlaceHolder} from '../../components/ListPlaceholders';
import SelectionWrapper from '../../components/SelectionWrapper';
import NoteItem from '../../components/NoteItem';
import {Platform} from 'react-native';
import { DDS } from '../../utils/utils';
let count = 0;
export const Home = ({navigation}) => {
@@ -110,13 +109,6 @@ export const Home = ({navigation}) => {
);
};
Home.navigationOptions = {
header: null,
headerStyle: {
backgroundColor: 'transparent',
borderBottomWidth: 0,
height: 0,
},
};
export default Home;

View File

@@ -9,7 +9,6 @@ import {
import * as Animatable from 'react-native-animatable';
import {TextInput} from 'react-native-gesture-handler';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import {useIsFocused} from 'react-navigation-hooks';
import {opacity, pv, SIZE, WEIGHT} from '../../common/common';
import {Header} from '../../components/header';
import {useTracked} from '../../provider';
@@ -18,7 +17,7 @@ import {eSendEvent} from '../../services/eventManager';
import {eCloseSideMenu, refreshNotesPage} from '../../services/events';
import {validatePass, validateUsername} from '../../services/validation';
import {db, DDS, ToastEvent, getElevation} from '../../utils/utils';
import { useIsFocused } from '@react-navigation/native';
@@ -542,13 +541,4 @@ export const Login = ({navigation}) => {
);
};
Login.navigationOptions = {
header: null,
headerStyle: {
backgroundColor: 'transparent',
borderBottomWidth: 0,
height: 0,
},
};
export default Login;

View File

@@ -1,5 +1,4 @@
import React, {useEffect, useState} from 'react';
import {useIsFocused} from 'react-navigation-hooks';
import Container from '../../components/Container';
import {AddTopicEvent} from '../../components/DialogManager/recievers';
import {NotebookPlaceHolder} from '../../components/ListPlaceholders';
@@ -8,6 +7,7 @@ import SelectionWrapper from '../../components/SelectionWrapper';
import SimpleList from '../../components/SimpleList';
import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions';
import { useIsFocused } from '@react-navigation/native';
import {
eSendEvent,
eSubscribeEvent,
@@ -155,8 +155,4 @@ export const Notebook = ({navigation}) => {
);
};
Notebook.navigationOptions = {
header: null,
};
export default Notebook;

View File

@@ -1,5 +1,5 @@
import React, {useEffect, useState} from 'react';
import {useIsFocused} from 'react-navigation-hooks';
import { useIsFocused } from '@react-navigation/native';
import Container from '../../components/Container';
import {NotesPlaceHolder} from '../../components/ListPlaceholders';
import NoteItem from '../../components/NoteItem';
@@ -21,14 +21,14 @@ import {openEditorAnimation} from '../../utils/animations';
import {db, DDS, editing, ToastEvent} from '../../utils/utils';
import {sideMenuRef} from '../../utils/refs';
export const Notes = ({navigation}) => {
export const Notes = ({route,navigation}) => {
const [state, dispatch] = useTracked();
const {colors, selectionMode, currentEditingNote, colorNotes} = state;
const allNotes = state.notes;
const [notes, setNotes] = useState([]);
const [refreshing, setRefreshing] = useState(false);
const isFocused = useIsFocused();
let params = navigation.state ? navigation.state.params : null;
let params = route.params ? route.params : null;
useEffect(() => {
if (!params) {
@@ -64,24 +64,21 @@ export const Notes = ({navigation}) => {
}, []);
const init = (data) => {
params = navigation.state.params;
params = route.params;
if (data) {
params = data;
}
eSendEvent(eScrollEvent, 0);
if (params.type === 'tag') {
let notesInTag = db.notes.tagged(params.tag.title);
setNotes([...notesInTag]);
} else if (params.type == 'color') {
let notesInColors = db.notes.colored(params.color.title);
setNotes([...notesInColors]);
} else {
let allNotes = db.notebooks
.notebook(params.notebookId)
.topics.topic(params.title).all;
if (allNotes && allNotes.length > 0) {
setNotes([...allNotes]);
}
@@ -200,8 +197,4 @@ export const Notes = ({navigation}) => {
);
};
Notes.navigationOptions = {
header: null,
};
export default Notes;

View File

@@ -780,8 +780,5 @@ export const Settings = ({navigation}) => {
);
};
Settings.navigationOptions = {
header: null,
};
export default Settings;

View File

@@ -10,7 +10,7 @@ import {
} from 'react-native';
import {TextInput} from 'react-native-gesture-handler';
import QRCode from 'react-native-qrcode-generator';
import {useIsFocused} from 'react-navigation-hooks';
import { useIsFocused } from '@react-navigation/native';
import {opacity, pv, SIZE, WEIGHT, ph} from '../../common/common';
import {Header} from '../../components/header';
import {useTracked} from '../../provider';
@@ -704,13 +704,6 @@ export const Signup = ({navigation}) => {
);
};
Signup.navigationOptions = {
header: null,
headerStyle: {
backgroundColor: 'transparent',
borderBottomWidth: 0,
height: 0,
},
};
export default Signup;

View File

@@ -1,6 +1,6 @@
import React, {useEffect} from 'react';
import {Text, TouchableOpacity, View} from 'react-native';
import {useIsFocused} from 'react-navigation-hooks';
import { useIsFocused } from '@react-navigation/native';
import {pv, SIZE, WEIGHT} from '../../common/common';
import Container from '../../components/Container';
import {TagsPlaceHolder} from '../../components/ListPlaceholders';
@@ -99,8 +99,4 @@ export const Tags = ({navigation}) => {
);
};
Tags.navigationOptions = {
header: null,
};
export default Tags;

View File

@@ -1,5 +1,5 @@
import React, {useEffect} from 'react';
import {useIsFocused} from 'react-navigation-hooks';
import { useIsFocused } from '@react-navigation/native';
import Container from '../../components/Container';
import {simpleDialogEvent} from '../../components/DialogManager/recievers';
import {TEMPLATE_EMPTY_TRASH} from '../../components/DialogManager/templates';
@@ -108,8 +108,4 @@ export const Trash = ({navigation}) => {
);
};
Trash.navigationOptions = {
header: null,
};
export default Trash;