Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-23 15:09:33 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
ammarahm-ed
2020-09-21 13:13:18 +05:00
parent 0dfaf60d1b
commit 753a7154d1
1 changed files with 144 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -33,17 +33,11 @@ const SimpleList = ({
placeholder, placeholder,
RenderItem, RenderItem,
focused, focused,
placeholderText,
pinned = null,
customRefresh, customRefresh,
customRefreshing, customRefreshing,
isMove,
hideMore,
noteToMove,
isHome = false,
}) => { }) => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {colors, selectionMode, user, currentScreen} = state; const {colors, selectionMode, user} = state;
const searchResults = {...state.searchResults}; const searchResults = {...state.searchResults};
const [refreshing, setRefreshing] = useState(false); const [refreshing, setRefreshing] = useState(false);
const [dataProvider, setDataProvider] = useState(null); const [dataProvider, setDataProvider] = useState(null);
@@ -54,17 +48,6 @@ const SimpleList = ({
eSendEvent(eScrollEvent, y); eSendEvent(eScrollEvent, y);
}; };
const NOOP = () => undefined;
const layoutItemAnimator = {
animateDidMount: NOOP,
animateShift: NOOP,
animateWillMount: NOOP,
animateWillUnmount: NOOP,
animateWillUpdate: () =>
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut),
};
useEffect(() => { useEffect(() => {
let mainData = let mainData =
searchResults.type === type && focused && searchResults.results.length > 0 searchResults.type === type && focused && searchResults.results.length > 0
@@ -130,24 +113,8 @@ const SimpleList = ({
let user = await db.user.get(); let user = await db.user.get();
dispatch({type: ACTIONS.USER, user: user}); dispatch({type: ACTIONS.USER, user: user});
await db.sync(); await db.sync();
if (Platform.OS === 'ios') {
dispatch({
type: ACTIONS.SYNCING,
syncing: false,
});
} else {
setRefreshing(false);
}
ToastEvent.show('Sync Complete', 'success'); ToastEvent.show('Sync Complete', 'success');
} catch (e) { } catch (e) {
if (Platform.OS === 'ios') {
dispatch({
type: ACTIONS.SYNCING,
syncing: false,
});
} else {
setRefreshing(false);
}
ToastEvent.show( ToastEvent.show(
e.message, e.message,
'error', 'error',
@@ -158,117 +125,17 @@ const SimpleList = ({
}, },
'Login', 'Login',
); );
} finally {
if (Platform.OS === 'ios') {
dispatch({
type: ACTIONS.SYNCING,
syncing: false,
});
} else {
setRefreshing(false);
}
dispatch({type: ACTIONS.ALL});
} }
dispatch({type: ACTIONS.ALL});
};
const ListHeaderComponent = () => {
return searchResults.type === type && searchResults.results.length > 0 ? (
<View
style={{
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
paddingHorizontal: 12,
height: 40,
}}>
<Text
style={{
fontFamily: WEIGHT.bold,
color: colors.accent,
fontSize: SIZE.xs,
}}>
Showing Results for {searchResults.keyword}
</Text>
<Text
onPress={() => {
eSendEvent(eClearSearch);
}}
style={{
fontFamily: WEIGHT.regular,
color: colors.errorText,
fontSize: SIZE.xs,
}}>
Clear
</Text>
</View>
) : (
<View>
{user || !data[0] || selectionMode ? null : (
<PressableButton
onPress={() => {
eSendEvent(eOpenLoginDialog);
}}
color={
COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.shade
}
selectedColor={
COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.accent
}
alpha={!colors.night ? -0.02 : 0.1}
opacity={0.12}
customStyle={{
width: '100%',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'flex-start',
paddingHorizontal: 12,
alignSelf: 'center',
height: 40,
borderRadius: 0,
position: 'relative',
}}>
<View
style={{
width: 25,
backgroundColor: COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.accent,
height: 25,
borderRadius: 100,
alignItems: 'center',
justifyContent: 'center',
}}>
<Icon
style={{
textAlign: 'center',
textAlignVertical: 'center',
}}
name="account-outline"
color="white"
size={SIZE.xs}
/>
</View>
<View
style={{
marginLeft: 10,
}}>
<Text
style={{
fontFamily: WEIGHT.regular,
color: colors.icon,
fontSize: SIZE.xxs - 1,
}}>
You are not logged in
</Text>
<Text
style={{
color: COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.accent,
fontSize: SIZE.xxs,
}}>
Login to sync your {type}.
</Text>
</View>
</PressableButton>
)}
</View>
);
}; };
const _ListEmptyComponent = ( const _ListEmptyComponent = (
@@ -286,10 +153,8 @@ const SimpleList = ({
</View> </View>
); );
const _layoutProvider = new LayoutProvider( const _layoutProvider = new LayoutProvider(
(index) => { (index) => {
return dataProvider.getDataForIndex(index).type; return dataProvider.getDataForIndex(index).type;
}, },
(type, dim) => { (type, dim) => {
@@ -316,7 +181,7 @@ const SimpleList = ({
break; break;
case 'MAIN_HEADER': case 'MAIN_HEADER':
dim.width = width; dim.width = width;
dim.height =user || !data[0] || selectionMode ? 0: 40; dim.height = user || !data[0] || selectionMode ? 0 : 40;
break; break;
default: default:
dim.width = width; dim.width = width;
@@ -330,7 +195,7 @@ const SimpleList = ({
case 'note': case 'note':
return <RenderItem item={data} pinned={data.pinned} index={index} />; return <RenderItem item={data} pinned={data.pinned} index={index} />;
case 'MAIN_HEADER': case 'MAIN_HEADER':
return <ListHeaderComponent />; return <ListHeaderComponent type={type} />;
case 'header': case 'header':
return <RenderSectionHeader item={data} />; return <RenderSectionHeader item={data} />;
@@ -363,20 +228,6 @@ const SimpleList = ({
minHeight: '100%', minHeight: '100%',
}, },
}} }}
/* data={
searchResults.type === type &&
focused &&
searchResults.results.length > 0
? searchResults.results
: data
}
keyExtractor={_listKeyExtractor} */
//
//onScroll={_onScroll}
//
//
style={{ style={{
height: '100%', height: '100%',
backgroundColor: colors.bg, backgroundColor: colors.bg,
@@ -390,15 +241,139 @@ const SimpleList = ({
? 155 - insets.top ? 155 - insets.top
: 155 - insets.top - 60, : 155 - insets.top - 60,
}} }}
/* renderItem={({item, index}) =>
item.type === 'header' ? (
<RenderSectionHeader item={item} />
) : (
<RenderItem item={item} index={index} />
)
} */
/> />
); );
}; };
export default SimpleList; export default SimpleList;
const SearchHeader = () => {
const [state, dispatch] = useTracked();
const {colors} = state;
const searchResults = {...state.searchResults};
return (
<View
style={{
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
paddingHorizontal: 12,
height: 40,
}}>
<Text
style={{
fontFamily: WEIGHT.bold,
color: colors.accent,
fontSize: SIZE.xs,
}}>
Showing Results for {searchResults.keyword}
</Text>
<Text
onPress={() => {
eSendEvent(eClearSearch);
}}
style={{
fontFamily: WEIGHT.regular,
color: colors.errorText,
fontSize: SIZE.xs,
}}>
Clear
</Text>
</View>
);
};
const LoginCard = () => {
const [state, dispatch] = useTracked();
const {colors, selectionMode, user, currentScreen} = state;
return (
<View>
{user || !data[0] || selectionMode ? null : (
<PressableButton
onPress={() => {
eSendEvent(eOpenLoginDialog);
}}
color={
COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.shade
}
selectedColor={
COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.accent
}
alpha={!colors.night ? -0.02 : 0.1}
opacity={0.12}
customStyle={{
width: '100%',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'flex-start',
paddingHorizontal: 12,
alignSelf: 'center',
height: 40,
borderRadius: 0,
position: 'relative',
}}>
<View
style={{
width: 25,
backgroundColor: COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.accent,
height: 25,
borderRadius: 100,
alignItems: 'center',
justifyContent: 'center',
}}>
<Icon
style={{
textAlign: 'center',
textAlignVertical: 'center',
}}
name="account-outline"
color="white"
size={SIZE.xs}
/>
</View>
<View
style={{
marginLeft: 10,
}}>
<Text
style={{
fontFamily: WEIGHT.regular,
color: colors.icon,
fontSize: SIZE.xxs - 1,
}}>
You are not logged in
</Text>
<Text
style={{
color: COLORS_NOTE[currentScreen]
? COLORS_NOTE[currentScreen]
: colors.accent,
fontSize: SIZE.xxs,
}}>
Login to sync your {type}.
</Text>
</View>
</PressableButton>
)}
</View>
);
};
const ListHeaderComponent = (type) => {
const [state, dispatch] = useTracked();
const searchResults = {...state.searchResults};
return searchResults.type === type && searchResults.results.length > 0 ? (
<SearchHeader />
) : (
<LoginCard type={type} />
);
};