Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-21 22:19:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

remove useIsFocused hook from all screens

Browse Source
This commit is contained in:
ammarahm-ed
2020-10-03 12:03:15 +05:00
parent 40ca59d18d
commit c9c8b0cf56
10 changed files with 436 additions and 445 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
apps/mobile/src/components/Container/ContainerBottomButton.js
View File

@@ -7,9 +7,9 @@ import {useTracked} from '../../provider';
import {DDS, getElevation} from '../../utils/utils'; import {DDS, getElevation} from '../../utils/utils';
import {PressableButton} from '../PressableButton'; import {PressableButton} from '../PressableButton';
export const ContainerBottomButton = ({root}) => { export const ContainerBottomButton = ({title, onPress, color}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {colors,containerBottomButton} = state; const {colors} = state;
const [buttonHide, setButtonHide] = useState(false); const [buttonHide, setButtonHide] = useState(false);
const insets = useSafeAreaInsets(); const insets = useSafeAreaInsets();
@@ -42,7 +42,7 @@ export const ContainerBottomButton = ({root}) => {
}; };
}, []); }, []);
return !containerBottomButton.visible ? null : ( return (
<View <View
style={{ style={{
width: '100%', width: '100%',
@@ -58,21 +58,13 @@ export const ContainerBottomButton = ({root}) => {
], ],
}}> }}>
<PressableButton <PressableButton
testID={"container_bottom_btn"} testID={'container_bottom_btn'}
color={ color={color || colors.accent}
containerBottomButton.color selectedColor={color || colors.accent}
? containerBottomButton.color
: colors.accent
}
selectedColor={
containerBottomButton.color
? containerBottomButton.color
: colors.accent
}
customStyle={{ customStyle={{
...getElevation(5), ...getElevation(5),
}} }}
onPress={containerBottomButton.bottomButtonOnPress}> onPress={onPress}>
<View <View
style={{ style={{
justifyContent: 'flex-start', justifyContent: 'flex-start',
@@ -84,11 +76,7 @@ export const ContainerBottomButton = ({root}) => {
paddingVertical: pv + 5, paddingVertical: pv + 5,
}}> }}>
<Icon <Icon
name={ name={title === 'Clear all trash' ? 'delete' : 'plus'}
containerBottomButton.bottomButtonText === 'Clear all trash'
? 'delete'
: 'plus'
}
color="white" color="white"
size={SIZE.xl} size={SIZE.xl}
/> />
@@ -100,7 +88,7 @@ export const ContainerBottomButton = ({root}) => {
fontFamily: WEIGHT.regular, fontFamily: WEIGHT.regular,
textAlignVertical: 'center', textAlignVertical: 'center',
}}> }}>
{' ' + containerBottomButton.bottomButtonText} {' ' + title}
</Text> </Text>
</View> </View>
</PressableButton> </PressableButton>

3
apps/mobile/src/components/SimpleList/index.js
View File

@@ -50,8 +50,9 @@ const SimpleList = ({
}; };
useEffect(() => { useEffect(() => {
console.log(focused());
let mainData = let mainData =
searchResults.type === type && focused && searchResults.results.length > 0 searchResults.type === type && focused() && searchResults.results.length > 0
? searchResults.results ? searchResults.results
: listData; : listData;

79
apps/mobile/src/views/Favorites/index.js
View File

@@ -1,51 +1,48 @@
import { useIsFocused } from '@react-navigation/native'; import React, {useEffect, useState} from 'react';
import React, { useEffect, useState } from 'react'; import {Placeholder} from '../../components/ListPlaceholders';
import { Placeholder } from '../../components/ListPlaceholders';
import SimpleList from '../../components/SimpleList'; import SimpleList from '../../components/SimpleList';
import { NoteItemWrapper } from '../../components/SimpleList/NoteItemWrapper'; import {NoteItemWrapper} from '../../components/SimpleList/NoteItemWrapper';
import { useTracked } from '../../provider'; import {useTracked} from '../../provider';
import { ACTIONS } from '../../provider/actions'; import {ACTIONS} from '../../provider/actions';
export const Favorites = ({route, navigation}) => { export const Favorites = ({route, navigation}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {favorites} = state; const {favorites} = state;
const [refreshing, setRefreshing] = useState(false); const [refreshing, setRefreshing] = useState(false);
const isFocused = useIsFocused();
const onFocus = useCallback(() => {
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: 'notes',
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Favorites',
},
});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'favorites',
});
dispatch({type: ACTIONS.FAVORITES});
}, []);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
dispatch({ return () => {
type: ACTIONS.HEADER_STATE, navigation.removeListener('focus', onFocus);
state: { };
type: 'notes', });
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.CONTAINER_BOTTOM_BUTTON,
state: {
visible: false,
},
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Favorites',
},
});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'favorites',
});
dispatch({type: ACTIONS.FAVORITES});
}
}, [isFocused]);
useEffect(() => { useEffect(() => {
if (isFocused) { if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -57,7 +54,7 @@ export const Favorites = ({route, navigation}) => {
}, },
}); });
} }
}, [favorites, isFocused]); }, [favorites]);
return ( return (
<SimpleList <SimpleList
@@ -67,7 +64,7 @@ export const Favorites = ({route, navigation}) => {
dispatch({type: ACTIONS.FAVORITES}); dispatch({type: ACTIONS.FAVORITES});
}} }}
refreshing={refreshing} refreshing={refreshing}
focused={isFocused} focused={() => navigation.isFocused()}
RenderItem={NoteItemWrapper} RenderItem={NoteItemWrapper}
placeholder={<Placeholder type="favorites" />} placeholder={<Placeholder type="favorites" />}
placeholderText="Notes you favorite appear here" placeholderText="Notes you favorite appear here"

105
apps/mobile/src/views/Folders/index.js
View File

@@ -1,4 +1,3 @@
import {useIsFocused} from '@react-navigation/native';
import React, {useEffect} from 'react'; import React, {useEffect} from 'react';
import {AddNotebookEvent} from '../../components/DialogManager/recievers'; import {AddNotebookEvent} from '../../components/DialogManager/recievers';
import {Placeholder} from '../../components/ListPlaceholders'; import {Placeholder} from '../../components/ListPlaceholders';
@@ -6,52 +5,50 @@ import SimpleList from '../../components/SimpleList';
import {NotebookItemWrapper} from '../../components/SimpleList/NotebookItemWrapper'; import {NotebookItemWrapper} from '../../components/SimpleList/NotebookItemWrapper';
import {useTracked} from '../../provider'; import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions'; import {ACTIONS} from '../../provider/actions';
import {ContainerBottomButton} from '../../components/Container/ContainerBottomButton';
export const Folders = ({route, navigation}) => { export const Folders = ({route, navigation}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {notebooks} = state; const {notebooks} = state;
let isFocused = useIsFocused(); const params = route.params;
const onFocus = useCallback(() => {
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: 'notebooks',
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: params.title,
},
});
dispatch({type: ACTIONS.PINNED});
dispatch({type: ACTIONS.NOTEBOOKS});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'notebooks',
});
}, []);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
dispatch({ return () => {
type: ACTIONS.HEADER_STATE, navigation.removeListener('focus', onFocus);
state: { };
type: 'notebooks', });
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.CONTAINER_BOTTOM_BUTTON,
state: {
bottomButtonText: 'Create a new notebook',
bottomButtonOnPress: () => AddNotebookEvent(),
color: null,
visible: true,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: params.title,
},
});
dispatch({type: ACTIONS.PINNED});
dispatch({type: ACTIONS.NOTEBOOKS});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'notebooks',
});
}
}, [isFocused]);
useEffect(() => { useEffect(() => {
if (isFocused) { if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -63,20 +60,26 @@ export const Folders = ({route, navigation}) => {
}, },
}); });
} }
}, [notebooks, isFocused]); }, [notebooks]);
const params = route.params; const _onPressBottomButton = () => AddNotebookEvent();
return ( return (
<SimpleList <>
data={notebooks} <SimpleList
type="notebooks" data={notebooks}
focused={isFocused} type="notebooks"
RenderItem={NotebookItemWrapper} focused={() => navigation.isFocused()}
placeholder={<Placeholder type="notebooks" />} RenderItem={NotebookItemWrapper}
pinned={true} placeholder={<Placeholder type="notebooks" />}
placeholderText="Notebooks you add will appear here" pinned={true}
/> placeholderText="Notebooks you add will appear here"
/>
<ContainerBottomButton
title="Create a new notebook"
onPress={_onPressBottomButton}
/>
</>
); );
}; };

123
apps/mobile/src/views/Home/index.js
View File

@@ -1,5 +1,5 @@
import {useIsFocused} from '@react-navigation/native'; import React, {useCallback, useEffect} from 'react';
import React, {useEffect} from 'react'; import {ContainerBottomButton} from '../../components/Container/ContainerBottomButton';
import {Placeholder} from '../../components/ListPlaceholders'; import {Placeholder} from '../../components/ListPlaceholders';
import SimpleList from '../../components/SimpleList'; import SimpleList from '../../components/SimpleList';
import {NoteItemWrapper} from '../../components/SimpleList/NoteItemWrapper'; import {NoteItemWrapper} from '../../components/SimpleList/NoteItemWrapper';
@@ -9,72 +9,59 @@ import {eSendEvent} from '../../services/eventManager';
import {eOnLoadNote, eScrollEvent} from '../../services/events'; import {eOnLoadNote, eScrollEvent} from '../../services/events';
import {openEditorAnimation} from '../../utils/animations'; import {openEditorAnimation} from '../../utils/animations';
import {DDS} from '../../utils/utils'; import {DDS} from '../../utils/utils';
export const Home = ({route, navigation}) => { export const Home = ({route, navigation}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {notes} = state; const {notes} = state;
const isFocused = useIsFocused();
const onFocus = useCallback(() => {
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'home',
});
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: 'notes',
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: true,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Home',
},
});
eSendEvent(eScrollEvent, 0);
dispatch({type: ACTIONS.COLORS});
dispatch({type: ACTIONS.NOTES});
}, []);
const onBlur = useCallback(() => {
console.log(navigation.isFocused());
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
}, []);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
dispatch({ navigation.addListener('blur', onBlur);
type: ACTIONS.CURRENT_SCREEN,
screen: 'home',
});
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: 'notes',
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: true,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Home',
},
});
dispatch({
type: ACTIONS.CONTAINER_BOTTOM_BUTTON,
state: {
bottomButtonText: 'Create a new note',
bottomButtonOnPress: async () => {
if (DDS.isTab) {
eSendEvent(eOnLoadNote, {type: 'new'});
} else {
eSendEvent(eOnLoadNote, {type: 'new'});
openEditorAnimation();
}
},
color: null,
visible: true,
},
});
eSendEvent(eScrollEvent, 0);
dispatch({type: ACTIONS.COLORS});
dispatch({type: ACTIONS.NOTES});
} else {
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
}
return () => { return () => {
dispatch({ navigation.removeListener('focus', onFocus);
type: ACTIONS.HEADER_VERTICAL_MENU, navigation.removeListener('blur', onBlur);
state: false,
});
}; };
}, [isFocused]); });
useEffect(() => { useEffect(() => {
if (isFocused) { if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -86,7 +73,16 @@ export const Home = ({route, navigation}) => {
}, },
}); });
} }
}, [notes, isFocused]); }, [notes]);
const _onPressBottomButton = async () => {
if (DDS.isTab) {
eSendEvent(eOnLoadNote, {type: 'new'});
} else {
eSendEvent(eOnLoadNote, {type: 'new'});
openEditorAnimation();
}
};
return ( return (
<> <>
@@ -95,11 +91,16 @@ export const Home = ({route, navigation}) => {
type="notes" type="notes"
isHome={true} isHome={true}
pinned={true} pinned={true}
focused={isFocused} focused={() => navigation.isFocused()}
RenderItem={NoteItemWrapper} RenderItem={NoteItemWrapper}
placeholder={<Placeholder type="notes" />} placeholder={<Placeholder type="notes" />}
placeholderText={`Notes you write appear here`} placeholderText={`Notes you write appear here`}
/> />
<ContainerBottomButton
title="Create a new note"
onPress={_onPressBottomButton}
/>
</> </>
); );
}; };

120
apps/mobile/src/views/Notebook/index.js
View File

@@ -1,4 +1,3 @@
import {useIsFocused} from '@react-navigation/native';
import React, {useEffect, useState} from 'react'; import React, {useEffect, useState} from 'react';
import {AddTopicEvent} from '../../components/DialogManager/recievers'; import {AddTopicEvent} from '../../components/DialogManager/recievers';
import {NotebookItem} from '../../components/NotebookItem'; import {NotebookItem} from '../../components/NotebookItem';
@@ -6,6 +5,7 @@ import SelectionWrapper from '../../components/SelectionWrapper';
import SimpleList from '../../components/SimpleList'; import SimpleList from '../../components/SimpleList';
import {useTracked} from '../../provider'; import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions'; import {ACTIONS} from '../../provider/actions';
import {ContainerBottomButton} from '../../components/Container/ContainerBottomButton';
import { import {
eSendEvent, eSendEvent,
eSubscribeEvent, eSubscribeEvent,
@@ -13,15 +13,12 @@ import {
} from '../../services/eventManager'; } from '../../services/eventManager';
import {eOnNewTopicAdded, eScrollEvent} from '../../services/events'; import {eOnNewTopicAdded, eScrollEvent} from '../../services/events';
import NavigationService from '../../services/NavigationService'; import NavigationService from '../../services/NavigationService';
import {db, ToastEvent} from '../../utils/utils'; import {db} from '../../utils/utils';
export const Notebook = ({route, navigation}) => { export const Notebook = ({route, navigation}) => {
const [, dispatch] = useTracked(); const [, dispatch] = useTracked();
const [topics, setTopics] = useState([]); const [topics, setTopics] = useState([]);
const [refreshing, setRefreshing] = useState(false);
let params = route.params; let params = route.params;
let isFocused = useIsFocused();
const onLoad = () => { const onLoad = () => {
let allTopics; let allTopics;
@@ -42,41 +39,46 @@ export const Notebook = ({route, navigation}) => {
}; };
}, []); }, []);
useEffect(() => { const onFocus = useCallback(() => {
if (isFocused) { onLoad();
onLoad(); dispatch({
dispatch({ type: ACTIONS.HEADER_STATE,
type: ACTIONS.HEADER_STATE, state: {
state: { type: 'topics',
type: 'topics', menu: false,
menu: false, canGoBack: true,
canGoBack: true, heading: params.title,
heading: params.title, color: null,
color: null, },
}, });
});
dispatch({ dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU, type: ACTIONS.HEADER_VERTICAL_MENU,
state: false, state: false,
}); });
dispatch({ dispatch({
type: ACTIONS.HEADER_TEXT_STATE, type: ACTIONS.HEADER_TEXT_STATE,
state: { state: {
heading: params.title, heading: params.title,
}, },
}); });
dispatch({ dispatch({
type: ACTIONS.CURRENT_SCREEN, type: ACTIONS.CURRENT_SCREEN,
screen: 'notebook', screen: 'notebook',
}); });
} }, []);
}, [isFocused]);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
return () => {
navigation.removeListener('focus', onFocus);
};
});
useEffect(() => {
if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -87,35 +89,33 @@ export const Notebook = ({route, navigation}) => {
color: null, color: null,
}, },
}); });
dispatch({
type: ACTIONS.CONTAINER_BOTTOM_BUTTON,
state: {
visible: true,
bottomButtonOnPress: () => {
let n = route.params.notebook;
AddTopicEvent(n);
},
color: null,
bottomButtonText: 'Add new topic',
},
});
} }
}, [topics, isFocused]); }, [topics]);
const _onPressBottomButton = () => {
let n = route.params.notebook;
AddTopicEvent(n);
};
return ( return (
<SimpleList <>
data={topics} <SimpleList
type="topics" data={topics}
refreshCallback={() => { type="topics"
onLoad(); refreshCallback={() => {
}} onLoad();
focused={isFocused} }}
RenderItem={RenderItem} focused={() => navigation.isFocused()}
placeholder={<></>} RenderItem={RenderItem}
placeholderText="" placeholder={<></>}
/> placeholderText=""
/>
<ContainerBottomButton
title="Add new topic"
onPress={_onPressBottomButton}
/>
</>
); );
}; };

137
apps/mobile/src/views/Notes/index.js
View File

@@ -1,11 +1,11 @@
import {useIsFocused} from '@react-navigation/native'; import React, {useCallback, useEffect, useState} from 'react';
import React, {useEffect, useState} from 'react';
import {COLORS_NOTE} from '../../common/common'; import {COLORS_NOTE} from '../../common/common';
import {Placeholder} from '../../components/ListPlaceholders'; import {Placeholder} from '../../components/ListPlaceholders';
import SimpleList from '../../components/SimpleList'; import SimpleList from '../../components/SimpleList';
import {NoteItemWrapper} from '../../components/SimpleList/NoteItemWrapper'; import {NoteItemWrapper} from '../../components/SimpleList/NoteItemWrapper';
import {useTracked} from '../../provider'; import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions'; import {ACTIONS} from '../../provider/actions';
import {ContainerBottomButton} from '../../components/Container/ContainerBottomButton';
import { import {
eSendEvent, eSendEvent,
eSubscribeEvent, eSubscribeEvent,
@@ -25,7 +25,6 @@ export const Notes = ({route, navigation}) => {
const allNotes = state.notes; const allNotes = state.notes;
const [notes, setNotes] = useState([]); const [notes, setNotes] = useState([]);
const [refreshing, setRefreshing] = useState(false); const [refreshing, setRefreshing] = useState(false);
const isFocused = useIsFocused();
let params = route.params ? route.params : null; let params = route.params ? route.params : null;
useEffect(() => { useEffect(() => {
@@ -75,55 +74,54 @@ export const Notes = ({route, navigation}) => {
} }
}; };
useEffect(() => { const onFocus = useCallback(() => {
if (isFocused) { dispatch({
dispatch({ type: ACTIONS.HEADER_STATE,
type: ACTIONS.HEADER_STATE, state: {
state: { type: 'notes',
type: 'notes', menu: params.type === 'color' ? true : false,
menu: params.type === 'color' ? true : false, canGoBack: params.type === 'color' ? false : true,
canGoBack: params.type === 'color' ? false : true, color: params.type == 'color' ? COLORS_NOTE[params.title] : null,
color: params.type == 'color' ? COLORS_NOTE[params.title] : null, },
});
}, dispatch({
}); type: ACTIONS.HEADER_VERTICAL_MENU,
dispatch({ state: false,
type: ACTIONS.CONTAINER_BOTTOM_BUTTON, });
state: { dispatch({
visible: true, type: ACTIONS.HEADER_TEXT_STATE,
color: params.type == 'color' ? COLORS_NOTE[params.title] : null, state: {
bottomButtonOnPress: _bottomBottomOnPress, heading:
bottomButtonText: 'Create a new note', params.type == 'tag'
}, ? '# ' + params.title
}); : params.title.slice(0, 1).toUpperCase() + params.title.slice(1),
dispatch({ },
type: ACTIONS.HEADER_VERTICAL_MENU, });
state: false, init();
}); dispatch({
dispatch({ type: ACTIONS.CURRENT_SCREEN,
type: ACTIONS.HEADER_TEXT_STATE, screen: params.type === 'color' ? params.color.title : params.type,
state: { });
heading: }, []);
params.type == 'tag'
? '# ' + params.title const onBlur = useCallback(() => {
: params.title.slice(0, 1).toUpperCase() + params.title.slice(1), setNotes([]);
}, editing.actionAfterFirstSave = {
}); type: null,
init(); };
dispatch({ }, []);
type: ACTIONS.CURRENT_SCREEN,
screen: params.type === 'color' ? params.color.title : params.type,
});
} else {
setNotes([]);
editing.actionAfterFirstSave = {
type: null,
};
}
}, [isFocused, allNotes, colorNotes]);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
navigation.addListener('blur', onBlur);
return () => {
navigation.removeListener('focus', onFocus);
navigation.removeListener('blur', onBlur);
};
});
useEffect(() => {
if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -137,9 +135,9 @@ export const Notes = ({route, navigation}) => {
}, },
}); });
} }
}, [notes, isFocused]); }, [notes]);
const _bottomBottomOnPress = () => { const _onPressBottomButton = useCallback(() => {
if (params.type === 'tag') { if (params.type === 'tag') {
editing.actionAfterFirstSave = { editing.actionAfterFirstSave = {
type: 'tag', type: 'tag',
@@ -162,22 +160,29 @@ export const Notes = ({route, navigation}) => {
eSendEvent(eOnLoadNote, {type: 'new'}); eSendEvent(eOnLoadNote, {type: 'new'});
} }
openEditorAnimation(); openEditorAnimation();
}; }, [params.type]);
return ( return (
<SimpleList <>
data={notes} <SimpleList
type="notes" data={notes}
refreshCallback={() => { type="notes"
init(); refreshCallback={() => {
}} init();
focused={isFocused} }}
RenderItem={NoteItemWrapper} focused={() => navigation.isFocused()}
placeholder={<Placeholder type="notes" />} RenderItem={NoteItemWrapper}
placeholderText={`Add some notes to this" ${ placeholder={<Placeholder type="notes" />}
params.type ? params.type : 'topic.' placeholderText={`Add some notes to this" ${
}`} params.type ? params.type : 'topic.'
/> }`}
/>
<ContainerBottomButton
title="Create a new note"
onPress={_onPressBottomButton}
color={params.type == 'color' ? COLORS_NOTE[params.title] : null}
/>
</>
); );
}; };

83
apps/mobile/src/views/Settings/index.js
View File

@@ -1,4 +1,3 @@
import {useIsFocused} from '@react-navigation/native';
import React, {useEffect} from 'react'; import React, {useEffect} from 'react';
import { import {
Appearance, Appearance,
@@ -56,7 +55,6 @@ import {
export const Settings = ({route, navigation}) => { export const Settings = ({route, navigation}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {colors, user, settings} = state; const {colors, user, settings} = state;
const isFocused = useIsFocused();
function changeColorScheme(colors = COLOR_SCHEME, accent = ACCENT) { function changeColorScheme(colors = COLOR_SCHEME, accent = ACCENT) {
let newColors = setColorScheme(colors, accent); let newColors = setColorScheme(colors, accent);
StatusBar.setBarStyle(colors.night ? 'light-content' : 'dark-content'); StatusBar.setBarStyle(colors.night ? 'light-content' : 'dark-content');
@@ -69,49 +67,46 @@ export const Settings = ({route, navigation}) => {
changeColorScheme(); changeColorScheme();
} }
const onFocus = useCallback(() => {
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: null,
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Settings',
},
});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'settings',
});
dispatch({
type: ACTIONS.SEARCH_STATE,
state: {
noSearch: true,
},
});
}, []);
useEffect(() => { useEffect(() => {
console.log(user); navigation.addListener('focus', onFocus);
if (isFocused) { return () => {
dispatch({ navigation.removeListener('focus', onFocus);
type: ACTIONS.CONTAINER_BOTTOM_BUTTON, };
state: { });
visible: false,
},
});
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: null,
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Settings',
},
});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'settings',
});
dispatch({
type: ACTIONS.SEARCH_STATE,
state: {
noSearch: true,
},
});
}
}, [isFocused]);
const getTimeLeft = (t1, t2) => { const getTimeLeft = (t1, t2) => {
let d1 = new Date(Date.now()); let d1 = new Date(Date.now());

92
apps/mobile/src/views/Tags/index.js
View File

@@ -1,58 +1,56 @@
import { useIsFocused } from '@react-navigation/native'; import React, {useEffect} from 'react';
import React, { useEffect } from 'react'; import {Text} from 'react-native';
import { Text } from 'react-native'; import {SIZE, WEIGHT} from '../../common/common';
import { SIZE, WEIGHT } from '../../common/common'; import {Placeholder} from '../../components/ListPlaceholders';
import { Placeholder } from '../../components/ListPlaceholders'; import {PressableButton} from '../../components/PressableButton';
import { PressableButton } from '../../components/PressableButton';
import SimpleList from '../../components/SimpleList'; import SimpleList from '../../components/SimpleList';
import { useTracked } from '../../provider'; import {useTracked} from '../../provider';
import { ACTIONS } from '../../provider/actions'; import {ACTIONS} from '../../provider/actions';
import NavigationService from '../../services/NavigationService'; import NavigationService from '../../services/NavigationService';
export const Tags = ({route, navigation}) => { export const Tags = ({route, navigation}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {colors, tags} = state; const {colors, tags} = state;
const isFocused = useIsFocused();
const onFocus = useCallback(() => {
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: 'trash',
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Tags',
},
});
dispatch({type: ACTIONS.TAGS});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'tags',
});
}, []);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
dispatch({ return () => {
type: ACTIONS.HEADER_STATE, navigation.removeListener('focus', onFocus);
state: { };
type: 'trash', });
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.CONTAINER_BOTTOM_BUTTON,
state: {
visible: false,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Tags',
},
});
dispatch({type: ACTIONS.TAGS});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'tags',
});
}
}, [isFocused]);
useEffect(() => { useEffect(() => {
if (isFocused) { if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -64,13 +62,13 @@ export const Tags = ({route, navigation}) => {
}, },
}); });
} }
}, [tags, isFocused]); }, [tags]);
return ( return (
<SimpleList <SimpleList
data={tags} data={tags}
type="tags" type="tags"
focused={isFocused} focused={() => navigation.isFocused()}
RenderItem={RenderItem} RenderItem={RenderItem}
placeholder={<Placeholder type="tags" />} placeholder={<Placeholder type="tags" />}
placeholderText="Tags added to notes appear here" placeholderText="Tags added to notes appear here"

109
apps/mobile/src/views/Trash/index.js
View File

@@ -1,5 +1,5 @@
import {useIsFocused} from '@react-navigation/native';
import React, {useEffect} from 'react'; import React, {useEffect} from 'react';
import {ContainerBottomButton} from '../../components/Container/ContainerBottomButton';
import {simpleDialogEvent} from '../../components/DialogManager/recievers'; import {simpleDialogEvent} from '../../components/DialogManager/recievers';
import {TEMPLATE_EMPTY_TRASH} from '../../components/DialogManager/templates'; import {TEMPLATE_EMPTY_TRASH} from '../../components/DialogManager/templates';
import {Placeholder} from '../../components/ListPlaceholders'; import {Placeholder} from '../../components/ListPlaceholders';
@@ -13,53 +13,47 @@ export const Trash = ({route, navigation}) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {trash} = state; const {trash} = state;
const isFocused = useIsFocused(); const onFocus = useCallback(() => {
dispatch({
type: ACTIONS.HEADER_STATE,
state: {
type: 'trash',
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Trash',
},
});
dispatch({
type: ACTIONS.TRASH,
});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'trash',
});
}, []);
useEffect(() => { useEffect(() => {
if (isFocused) { navigation.addListener('focus', onFocus);
dispatch({ return () => {
type: ACTIONS.HEADER_STATE, navigation.removeListener('focus', onFocus);
state: { };
type: 'trash', });
menu: true,
canGoBack: false,
color: null,
},
});
dispatch({
type: ACTIONS.CONTAINER_BOTTOM_BUTTON,
state: {
bottomButtonText: 'Clear all trash',
bottomButtonOnPress: () => simpleDialogEvent(TEMPLATE_EMPTY_TRASH),
color: null,
visible: true,
},
});
dispatch({
type: ACTIONS.HEADER_VERTICAL_MENU,
state: false,
});
dispatch({
type: ACTIONS.HEADER_TEXT_STATE,
state: {
heading: 'Trash',
},
});
dispatch({
type: ACTIONS.TRASH,
});
dispatch({
type: ACTIONS.CURRENT_SCREEN,
screen: 'trash',
});
}
}, [isFocused]);
useEffect(() => { useEffect(() => {
if (isFocused) { if (navigation.isFocused()) {
dispatch({ dispatch({
type: ACTIONS.SEARCH_STATE, type: ACTIONS.SEARCH_STATE,
state: { state: {
@@ -71,17 +65,26 @@ export const Trash = ({route, navigation}) => {
}, },
}); });
} }
}, [trash, isFocused]); }, [trash]);
const _onPressBottomButton = () => simpleDialogEvent(TEMPLATE_EMPTY_TRASH);
return ( return (
<SimpleList <>
data={trash} <SimpleList
type="trash" data={trash}
focused={isFocused} type="trash"
RenderItem={RenderItem} focused={() => navigation.isFocused()}
placeholder={<Placeholder type="trash" />} RenderItem={RenderItem}
placeholderText="Deleted notes & notebooks appear here." placeholder={<Placeholder type="trash" />}
/> placeholderText="Deleted notes & notebooks appear here."
/>
<ContainerBottomButton
title="Clear all trash"
onPress={_onPressBottomButton}
/>
</>
); );
}; };