refactoring

This commit is contained in:
ammarahm-ed
2020-02-02 20:44:17 +05:00
parent c74ff4de90
commit c3e6f02aa3
15 changed files with 332 additions and 157 deletions

View File

@@ -166,9 +166,10 @@ export const Container = ({
<View
style={{
position: 'absolute',
position: selectionMode ? 'relative' : 'absolute',
backgroundColor: colors.bg,
zIndex: 999,
display: selectionMode ? 'none' : 'flex',
width: '100%',
}}>
<Header

View File

@@ -158,15 +158,17 @@ export class Dialog extends Component {
<Icon name={icon} color={colors.accent} size={SIZE.lg} />
) : null}
<Text
style={{
color: colors.accent,
fontFamily: WEIGHT.bold,
marginLeft: 5,
fontSize: SIZE.md,
}}>
{title}
</Text>
{template.noTitle ? null : (
<Text
style={{
color: colors.accent,
fontFamily: WEIGHT.bold,
marginLeft: 5,
fontSize: SIZE.md,
}}>
{title}
</Text>
)}
</View>
{paragraph ? (
@@ -182,58 +184,60 @@ export class Dialog extends Component {
</Text>
) : null}
<View
style={{
justifyContent: 'space-between',
alignItems: 'center',
flexDirection: 'row',
marginTop: 20,
}}>
<TouchableOpacity
activeOpacity={opacity}
onPress={this._onClose}
{template.noButtons ? null : (
<View
style={{
paddingVertical: pv,
paddingHorizontal: ph,
borderRadius: 5,
width: '48%',
justifyContent: 'center',
justifyContent: 'space-between',
alignItems: 'center',
backgroundColor: colors.nav,
flexDirection: 'row',
marginTop: 20,
}}>
<Text
<TouchableOpacity
activeOpacity={opacity}
onPress={this._onClose}
style={{
fontFamily: WEIGHT.medium,
color: colors.icon,
fontSize: SIZE.sm,
paddingVertical: pv,
paddingHorizontal: ph,
borderRadius: 5,
width: '48%',
justifyContent: 'center',
alignItems: 'center',
backgroundColor: colors.nav,
}}>
{negativeText}
</Text>
</TouchableOpacity>
<TouchableOpacity
activeOpacity={opacity}
onPress={this._onPress}
style={{
paddingVertical: pv,
paddingHorizontal: ph,
borderRadius: 5,
width: '48%',
justifyContent: 'center',
alignItems: 'center',
borderColor: colors.accent,
backgroundColor: colors.accent,
borderWidth: 1,
}}>
<Text
<Text
style={{
fontFamily: WEIGHT.medium,
color: colors.icon,
fontSize: SIZE.sm,
}}>
{negativeText}
</Text>
</TouchableOpacity>
<TouchableOpacity
activeOpacity={opacity}
onPress={this._onPress}
style={{
fontFamily: WEIGHT.medium,
color: 'white',
fontSize: SIZE.sm,
paddingVertical: pv,
paddingHorizontal: ph,
borderRadius: 5,
width: '48%',
justifyContent: 'center',
alignItems: 'center',
borderColor: colors.accent,
backgroundColor: colors.accent,
borderWidth: 1,
}}>
{positiveText}
</Text>
</TouchableOpacity>
</View>
<Text
style={{
fontFamily: WEIGHT.medium,
color: 'white',
fontSize: SIZE.sm,
}}>
{positiveText}
</Text>
</TouchableOpacity>
</View>
)}
</View>
</View>
</Modal>

View File

@@ -29,6 +29,7 @@ import {Dialog} from '../Dialog';
import LoginDialog from '../LoginDialog';
import MoveNoteDialog from '../MoveNoteDialog';
import {VaultDialog} from '../VaultDialog';
import {timeConverter} from '../../utils/utils';
export const dialogActions = {
ACTION_DELETE: 511,
@@ -135,6 +136,19 @@ export const TEMPLATE_EXIT = type => {
};
};
export const TEMPLATE_INFO = dateCreated => {
return {
title: `Note Info`,
paragraph: `Created on ${timeConverter(dateCreated)}`,
positiveText: ``,
negativeText: '',
noButtons: true,
noTitle: true,
action: dialogActions.ACTION_CLOSE,
icon: 'info',
};
};
export const TEMPLATE_EMPTY_TRASH = {
title: 'Empty Trash',
paragraph: 'Are you sure you want to clear the trash?',

View File

@@ -1,4 +1,4 @@
import React from 'react';
import React, {useEffect, useState} from 'react';
import {
Platform,
ScrollView,
@@ -26,7 +26,7 @@ import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions';
import NavigationService from '../../services/NavigationService';
import {AnimatedSafeAreaView} from '../../views/Home';
import {DDS} from '../../../App';
import {DDS, db} from '../../../App';
import {
eOpenLoginDialog,
eOpenModalMenu,
@@ -42,7 +42,7 @@ export const Menu = ({
}) => {
const [state, dispatch] = useTracked();
const {colors} = state;
const [tags, setTags] = useState([]);
// todo
let overlayRef;
@@ -54,6 +54,17 @@ export const Menu = ({
dispatch({type: ACTIONS.THEME, colors: newColors});
}
useEffect(() => {
let allTags = db.getTags();
let tagsToAdd = [];
allTags.sort((a, b) => {
return a.count > b.count;
});
setTags([...allTags]);
console.log(allTags);
}, []);
const listItems = [
{
name: 'Home',
@@ -315,22 +326,16 @@ export const Menu = ({
flexWrap: 'wrap',
marginBottom: 0,
}}>
{[
'home',
'office',
'work',
'book_notes',
'poem',
'lists',
'water',
].map(item => (
{tags.map(item => (
<TouchableOpacity
key={item}
key={item.title}
activeOpacity={opacity / 2}
onPress={() => {
close();
NavigationService.navigate('Notes', {
heading: item,
heading: item.title,
tag: item,
type: 'tag',
});
}}
style={{
@@ -339,6 +344,7 @@ export const Menu = ({
alignItems: 'center',
padding: 5,
paddingLeft: 2.5,
marginTop: 5,
}}>
<Text
style={{
@@ -346,8 +352,25 @@ export const Menu = ({
fontSize: SIZE.xs + 1,
color: colors.icon,
}}>
#{item}
#{item.title}
</Text>
{item.count > 1 ? (
<Text
style={{
color: 'white',
backgroundColor: colors.accent,
fontSize: SIZE.xxs - 2,
minWidth: 10,
minHeight: 10,
marginTop: -10,
borderRadius: 2,
textAlign: 'center',
padding: 0,
paddingHorizontal: 1,
}}>
{item.count}
</Text>
) : null}
</TouchableOpacity>
))}
</View>
@@ -378,8 +401,21 @@ export const Menu = ({
height: noTextMode ? SIZE.md : normalize(30),
backgroundColor: item,
borderRadius: 100,
}}
/>
}}></View>
<Text
style={{
color: colors.pri,
fontSize: SIZE.xxs - 2,
minWidth: 10,
minHeight: 10,
borderRadius: 2,
textAlign: 'center',
padding: 0,
paddingHorizontal: 1,
position: 'absolute',
top: -5,
right: -10,
}}></Text>
</TouchableOpacity>
),
)}

View File

@@ -110,7 +110,7 @@ export default class NoteItem extends React.Component {
) : null}
<TouchableOpacity
activeOpacity={1}
activeOpacity={0.8}
onLongPress={() => onLongPress()}
onPress={() => {
if (item.locked) {

View File

@@ -64,8 +64,10 @@ export const NotebookItem = ({
width: '100%',
}}>
<TouchableOpacity
activeOpacity={0.8}
style={{
width: '75%',
width: '90%',
maxWidth: '90%',
minHeight: 50,
justifyContent: 'center',
}}

View File

@@ -1,4 +1,4 @@
import React, {useEffect} from 'react';
import React, {useEffect, useState} from 'react';
import {
ActivityIndicator,
FlatList,
@@ -6,6 +6,7 @@ import {
SectionList,
Text,
View,
RefreshControl,
} from 'react-native';
import {SIZE, WEIGHT} from '../../common/common';
import {useTracked} from '../../provider';
@@ -28,7 +29,7 @@ export const NotesList = ({isGrouped = false}) => {
keyword,
} = state;
const notes = [...state.notes];
const [refreshing, setRefreshing] = useState(false);
const _renderItem = ({item, index}) => (
<SelectionWrapper
index={index}
@@ -172,6 +173,20 @@ export const NotesList = ({isGrouped = false}) => {
<SectionList
ref={ref => (sectionListRef = ref)}
sections={notes}
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
keyExtractor={_listKeyExtractor}
renderSectionHeader={_renderSectionHeader}
onScroll={_onScroll}

View File

@@ -69,6 +69,71 @@ export const ToastEvent = {
},
};
export const timeConverter = timestamp => {
if (!timestamp) return;
var d = new Date(timestamp), // Convert the passed timestamp to milliseconds
yyyy = d.getFullYear(),
mm = ('0' + (d.getMonth() + 1)).slice(-2), // Months are zero based. Add leading 0.
dd = ('0' + d.getDate()).slice(-2), // Add leading 0.
currentDay = d.getDay(),
hh = d.getHours(),
h = hh,
min = ('0' + d.getMinutes()).slice(-2), // Add leading 0.
ampm = 'AM',
time;
let days = [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
];
var months = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec',
];
if (hh > 12) {
h = hh - 12;
ampm = 'PM';
} else if (hh === 12) {
h = 12;
ampm = 'PM';
} else if (hh == 0) {
h = 12;
}
// ie: 2013-02-18, 8:35 AM
time =
days[currentDay] +
' ' +
dd +
' ' +
months[d.getMonth()] +
', ' +
yyyy +
', ' +
h +
':' +
min +
' ' +
ampm;
return time;
};
export const SideMenuEvent = {
open: () => {
eSendEvent(eOpenSideMenu);

View File

@@ -20,6 +20,7 @@ import {
simpleDialogEvent,
TEMPLATE_EXIT,
TEMPLATE_EXIT_FULLSCREEN,
TEMPLATE_INFO,
} from '../../components/DialogManager';
import {useTracked} from '../../provider';
import {ACTIONS} from '../../provider/actions';
@@ -33,12 +34,13 @@ import {
eOnLoadNote,
eOpenFullscreenEditor,
} from '../../services/events';
import {SideMenuEvent} from '../../utils/utils';
import {SideMenuEvent, timeConverter} from '../../utils/utils';
import {AnimatedSafeAreaView} from '../Home';
let EditorWebView;
let note = {};
let timestamp = null;
let dateEdited = null;
var content = null;
var title = null;
let timer = null;
@@ -260,9 +262,11 @@ const Editor = ({navigation, noMenu}) => {
const updateEditor = () => {
title = note.title;
timestamp = note.dateCreated;
dateEdited = note.dateEditted;
content = note.content;
saveCounter = 0;
console.log('here');
console.log(note);
if (title !== null || title === '') {
post(
JSON.stringify({
@@ -294,71 +298,6 @@ const Editor = ({navigation, noMenu}) => {
link.click();
}`;
const timeConverter = timestamp => {
if (!timestamp) return;
var d = new Date(timestamp), // Convert the passed timestamp to milliseconds
yyyy = d.getFullYear(),
mm = ('0' + (d.getMonth() + 1)).slice(-2), // Months are zero based. Add leading 0.
dd = ('0' + d.getDate()).slice(-2), // Add leading 0.
currentDay = d.getDay(),
hh = d.getHours(),
h = hh,
min = ('0' + d.getMinutes()).slice(-2), // Add leading 0.
ampm = 'AM',
time;
let days = [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
];
var months = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec',
];
if (hh > 12) {
h = hh - 12;
ampm = 'PM';
} else if (hh === 12) {
h = 12;
ampm = 'PM';
} else if (hh == 0) {
h = 12;
}
// ie: 2013-02-18, 8:35 AM
time =
days[currentDay] +
' ' +
dd +
' ' +
months[d.getMonth()] +
', ' +
yyyy +
', ' +
h +
':' +
min +
' ' +
ampm;
return time;
};
const _renderEditor = () => {
return (
<KeyboardAvoidingView
@@ -480,15 +419,19 @@ const Editor = ({navigation, noMenu}) => {
flexDirection: 'row',
alignItems: 'center',
paddingLeft: noMenu ? 12 : 12 + 50,
zIndex: 999,
}}>
<Text
onPress={() => {
simpleDialogEvent(TEMPLATE_INFO(timestamp));
}}
style={{
color: colors.icon,
fontSize: SIZE.xxs,
textAlignVertical: 'center',
fontFamily: WEIGHT.regular,
}}>
{timeConverter(timestamp)}
{timeConverter(dateEdited)}
</Text>
</View>
<WebView

View File

@@ -1,5 +1,5 @@
import React, {useEffect} from 'react';
import {FlatList, Platform, Text, View} from 'react-native';
import React, {useEffect, useState} from 'react';
import {FlatList, Platform, Text, View, RefreshControl} from 'react-native';
import {SIZE, WEIGHT} from '../../common/common';
import Container from '../../components/Container';
import {FavoritesPlaceHolder} from '../../components/ListPlaceholders';
@@ -14,7 +14,7 @@ import {eScrollEvent} from '../../services/events';
export const Favorites = ({navigation}) => {
const [state, dispatch] = useTracked();
const {colors, selectionMode, favorites} = state;
const [refreshing, setRefreshing] = useState(false);
useEffect(() => {
dispatch({type: ACTIONS.FAVORITES});
}, []);
@@ -35,6 +35,20 @@ export const Favorites = ({navigation}) => {
noBottomButton={true}>
<FlatList
keyExtractor={item => item.dateCreated.toString()}
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
style={{
width: '100%',
alignSelf: 'center',

View File

@@ -1,5 +1,12 @@
import React, {useEffect} from 'react';
import {BackHandler, FlatList, Platform, Text, View} from 'react-native';
import React, {useEffect, useState} from 'react';
import {
BackHandler,
FlatList,
Platform,
Text,
View,
RefreshControl,
} from 'react-native';
import {useIsFocused} from 'react-navigation-hooks';
import {DDS} from '../../../App';
import {SIZE, WEIGHT} from '../../common/common';
@@ -24,7 +31,9 @@ export const Folders = ({navigation}) => {
notebooks,
preventDefaultMargins,
} = state;
const [refreshing, setRefreshing] = useState(false);
let isFocused = useIsFocused();
///
const handleBackPress = () => {
@@ -80,6 +89,20 @@ export const Folders = ({navigation}) => {
style={{
width: '100%',
}}
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
onScroll={onScroll}
ListHeaderComponent={
<View

View File

@@ -1,5 +1,5 @@
import React, {useEffect, useState} from 'react';
import {FlatList, Platform, Text, View} from 'react-native';
import {FlatList, Platform, Text, View, RefreshControl} from 'react-native';
import {useIsFocused} from 'react-navigation-hooks';
import {SIZE, WEIGHT} from '../../common/common';
import Container from '../../components/Container';
@@ -16,6 +16,7 @@ export const Notebook = ({navigation}) => {
const [state, dispatch] = useTracked();
const {colors, selectionMode, preventDefaultMargins} = state;
const [topics, setTopics] = useState([]);
const [refreshing, setRefreshing] = useState(false);
let params = navigation.state.params;
let isFocused = useIsFocused();
@@ -106,6 +107,20 @@ export const Notebook = ({navigation}) => {
//setAddTopic(true);
}}>
<FlatList
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
style={{
width: '100%',
}}

View File

@@ -1,5 +1,5 @@
import React, {useEffect, useState} from 'react';
import {FlatList, Text, View, Platform} from 'react-native';
import {FlatList, Text, View, Platform, RefreshControl} from 'react-native';
import {db} from '../../../App';
import Container from '../../components/Container';
import NoteItem from '../../components/NoteItem';
@@ -13,7 +13,7 @@ export const Notes = ({navigation}) => {
const {colors, selectionMode, currentEditingNote} = state;
const allNotes = state.notes;
const [notes, setNotes] = useState([]);
const [refreshing, setRefreshing] = useState(false);
let params = navigation.state ? navigation.state.params : null;
useEffect(() => {
@@ -115,6 +115,20 @@ export const Notes = ({navigation}) => {
bottomButtonOnPress={() => {}}>
<FlatList
data={notes}
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
keyExtractor={_listKeyExtractor}
ListFooterComponent={_ListFooterComponent}
onScroll={_onScroll}

View File

@@ -1,4 +1,4 @@
import React, {useEffect} from 'react';
import React, {useEffect, useState} from 'react';
import {
Dimensions,
FlatList,
@@ -6,6 +6,7 @@ import {
Text,
View,
TouchableOpacity,
RefreshControl,
} from 'react-native';
import {pv, SIZE, WEIGHT} from '../../common/common';
import {Header} from '../../components/header';
@@ -20,7 +21,7 @@ const h = Dimensions.get('window').height;
export const Tags = ({navigation}) => {
const [state, dispatch] = useTracked();
const {colors, tags} = state;
const [refreshing, setRefreshing] = useState(false);
useEffect(() => {
dispatch({type: ACTIONS.TAGS});
}, []);
@@ -44,6 +45,20 @@ export const Tags = ({navigation}) => {
style={{
height: '100%',
}}
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
contentContainerStyle={{
height: '100%',
}}

View File

@@ -1,5 +1,5 @@
import React, {useEffect} from 'react';
import {FlatList, Text, View} from 'react-native';
import React, {useEffect, useState} from 'react';
import {FlatList, Text, View, RefreshControl} from 'react-native';
import {SIZE, WEIGHT} from '../../common/common';
import Container from '../../components/Container';
import {
@@ -17,7 +17,7 @@ import SelectionWrapper from '../../components/SelectionWrapper';
export const Trash = ({navigation}) => {
const [state, dispatch] = useTracked();
const {colors, selectionMode, trash} = state;
const [refreshing, setRefreshing] = useState(false);
useEffect(() => {
dispatch({
type: ACTIONS.TRASH,
@@ -113,6 +113,20 @@ export const Trash = ({navigation}) => {
menu={true}
bottomButtonText="Clear all trash">
<FlatList
refreshControl={
<RefreshControl
tintColor={colors.accent}
colors={[colors.accent]}
progressViewOffset={165}
onRefresh={() => {
setRefreshing(true);
setTimeout(() => {
setRefreshing(false);
}, 1000);
}}
refreshing={refreshing}
/>
}
ListHeaderComponent={
<View
style={{