self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2025-11-29 22:48:10 +02:00
Code Issues Releases Activity

First pass at linting lib dir

Browse Source
This commit is contained in:
Laurent Cozic
2019-07-29 15:43:53 +02:00
parent 64b7bc3d62
commit 86dc72b204
170 changed files with 4140 additions and 3119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
ReactNativeClient/lib/components/screens/NoteTagsDialog.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { ListView, StyleSheet, View, Text, Button, FlatList, TouchableOpacity, TextInput } = require('react-native');
const Setting = require('lib/models/Setting.js');
const { connect } = require('react-redux');
@@ -18,7 +19,6 @@ const ModalDialog = require('lib/components/ModalDialog');
const naturalCompare = require('string-natural-compare');
class NoteTagsDialogComponent extends React.Component {
constructor() {
super();
this.styles_ = {};
@@ -30,21 +30,21 @@ class NoteTagsDialogComponent extends React.Component {
savingTags: false,
};
const noteHasTag = (tagId) => {
const noteHasTag = tagId => {
for (let i = 0; i < this.state.tagListData.length; i++) {
if (this.state.tagListData[i].id === tagId) return this.state.tagListData[i].selected;
}
return false;
}
};
const newTagTitles = () => {
return this.state.newTags
.split(',')
.map(t => t.trim().toLowerCase())
.filter(t => !!t);
}
};
this.tag_press = (tagId) => {
this.tag_press = tagId => {
const newData = this.state.tagListData.slice();
for (let i = 0; i < newData.length; i++) {
const t = newData[i];
@@ -57,19 +57,20 @@ class NoteTagsDialogComponent extends React.Component {
}
this.setState({ tagListData: newData });
}
};
this.renderTag = (data) => {
this.renderTag = data => {
const tag = data.item;
const iconName = noteHasTag(tag.id) ? 'md-checkbox-outline' : 'md-square-outline';
return (
<TouchableOpacity key={tag.id} onPress={() => this.tag_press(tag.id)} style={this.styles().tag}>
<View style={this.styles().tagIconText}>
<Icon name={iconName} style={this.styles().tagCheckbox}/><Text style={this.styles().tagText}>{tag.title}</Text>
<Icon name={iconName} style={this.styles().tagCheckbox} />
<Text style={this.styles().tagText}>{tag.title}</Text>
</View>
</TouchableOpacity>
);
}
};
this.tagKeyExtractor = (tag, index) => tag.id;
@@ -89,11 +90,11 @@ class NoteTagsDialogComponent extends React.Component {
}
if (this.props.onCloseRequested) this.props.onCloseRequested();
}
};
this.cancelButton_press = () => {
if (this.props.onCloseRequested) this.props.onCloseRequested();
}
};
}
UNSAFE_componentWillMount() {
@@ -106,11 +107,13 @@ class NoteTagsDialogComponent extends React.Component {
const tags = await Tag.tagsByNoteId(noteId);
const tagIds = tags.map(t => t.id);
const tagListData = this.props.tags.map(tag => { return {
id: tag.id,
title: tag.title,
selected: tagIds.indexOf(tag.id) >= 0,
}});
const tagListData = this.props.tags.map(tag => {
return {
id: tag.id,
title: tag.title,
selected: tagIds.indexOf(tag.id) >= 0,
};
});
tagListData.sort((a, b) => {
return naturalCompare.caseInsensitive(a.title, b.title);
@@ -143,12 +146,12 @@ class NoteTagsDialogComponent extends React.Component {
color: theme.color,
},
newTagBox: {
flexDirection:'row',
flexDirection: 'row',
alignItems: 'center',
paddingLeft: theme.marginLeft,
paddingRight: theme.marginRight,
borderBottomWidth: 1,
borderBottomColor: theme.dividerColor
borderBottomColor: theme.dividerColor,
},
newTagBoxLabel: Object.assign({}, theme.normalText, { marginRight: 8 }),
newTagBoxInput: Object.assign({}, theme.lineInput, { flex: 1 }),
@@ -157,43 +160,37 @@ class NoteTagsDialogComponent extends React.Component {
this.styles_[themeId] = StyleSheet.create(styles);
return this.styles_[themeId];
}
render() {
const theme = themeStyle(this.props.theme);
const dialogContent = (
<View style={{flex:1}}>
<View style={{ flex: 1 }}>
<View style={this.styles().newTagBox}>
<Text style={this.styles().newTagBoxLabel}>{_('New tags:')}</Text><TextInput selectionColor={theme.textSelectionColor} value={this.state.newTags} onChangeText={value => { this.setState({ newTags: value }) }} style={this.styles().newTagBoxInput}/>
<Text style={this.styles().newTagBoxLabel}>{_('New tags:')}</Text>
<TextInput
selectionColor={theme.textSelectionColor}
value={this.state.newTags}
onChangeText={value => {
this.setState({ newTags: value });
}}
style={this.styles().newTagBoxInput}
/>
</View>
<FlatList
data={this.state.tagListData}
renderItem={this.renderTag}
keyExtractor={this.tagKeyExtractor}
/>
<FlatList data={this.state.tagListData} renderItem={this.renderTag} keyExtractor={this.tagKeyExtractor} />
</View>
);
return <ModalDialog
theme={this.props.theme}
ContentComponent={dialogContent}
title={_('Type new tags or select from list')}
onOkPress={this.okButton_press}
onCancelPress={this.cancelButton_press}
buttonBarEnabled={!this.state.savingTags}
/>
return <ModalDialog theme={this.props.theme} ContentComponent={dialogContent} title={_('Type new tags or select from list')} onOkPress={this.okButton_press} onCancelPress={this.cancelButton_press} buttonBarEnabled={!this.state.savingTags} />;
}
}
const NoteTagsDialog = connect(
(state) => {
return {
theme: state.settings.theme,
tags: state.tags,
noteId: state.selectedNoteIds.length ? state.selectedNoteIds[0] : null,
};
}
)(NoteTagsDialogComponent)
const NoteTagsDialog = connect(state => {
return {
theme: state.settings.theme,
tags: state.tags,
noteId: state.selectedNoteIds.length ? state.selectedNoteIds[0] : null,
};
})(NoteTagsDialogComponent);
module.exports = NoteTagsDialog;
module.exports = NoteTagsDialog;

35
ReactNativeClient/lib/components/screens/dropbox-login.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { View, Button, Text, TextInput, TouchableOpacity, StyleSheet, ScrollView } = require('react-native');
const { connect } = require('react-redux');
const { ScreenHeader } = require('lib/components/screen-header.js');
@@ -10,17 +11,12 @@ const Shared = require('lib/components/shared/dropbox-login-shared');
const { themeStyle } = require('lib/components/global-style.js');
class DropboxLoginScreenComponent extends BaseScreenComponent {
constructor() {
super();
this.styles_ = {};
this.shared_ = new Shared(
this,
(msg) => dialogs.info(this, msg),
(msg) => dialogs.error(this, msg)
);
this.shared_ = new Shared(this, msg => dialogs.info(this, msg), msg => dialogs.error(this, msg));
}
UNSAFE_componentWillMount() {
@@ -40,7 +36,7 @@ class DropboxLoginScreenComponent extends BaseScreenComponent {
},
stepText: Object.assign({}, theme.normalText, { marginBottom: theme.margin }),
urlText: Object.assign({}, theme.urlText, { marginBottom: theme.margin }),
}
};
this.styles_[themeId] = StyleSheet.create(styles);
return this.styles_[themeId];
@@ -51,8 +47,8 @@ class DropboxLoginScreenComponent extends BaseScreenComponent {
return (
<View style={this.styles().screen}>
<ScreenHeader title={_('Login with Dropbox')}/>
<ScreenHeader title={_('Login with Dropbox')} />
<ScrollView style={this.styles().container}>
<Text style={this.styles().stepText}>{_('To allow Joplin to synchronise with Dropbox, please follow the steps below:')}</Text>
<Text style={this.styles().stepText}>{_('Step 1: Open this URL in your browser to authorise the application:')}</Text>
@@ -62,25 +58,28 @@ class DropboxLoginScreenComponent extends BaseScreenComponent {
</TouchableOpacity>
</View>
<Text style={this.styles().stepText}>{_('Step 2: Enter the code provided by Dropbox:')}</Text>
<TextInput placeholder={_('Enter code here')} placeholderTextColor={theme.colorFaded} selectionColor={theme.textSelectionColor} value={this.state.authCode} onChangeText={this.shared_.authCodeInput_change} style={theme.lineInput}/>
<View style={{height:10}}></View>
<Button disabled={this.state.checkingAuthToken} title={_("Submit")} onPress={this.shared_.submit_click}></Button>
<TextInput placeholder={_('Enter code here')} placeholderTextColor={theme.colorFaded} selectionColor={theme.textSelectionColor} value={this.state.authCode} onChangeText={this.shared_.authCodeInput_change} style={theme.lineInput} />
<View style={{ height: 10 }}></View>
<Button disabled={this.state.checkingAuthToken} title={_('Submit')} onPress={this.shared_.submit_click}></Button>
{/* Add this extra padding to make sure the view is scrollable when the keyboard is visible on small screens (iPhone SE) */}
<View style={{ height: 200 }}></View>
</ScrollView>
<DialogBox ref={dialogbox => { this.dialogbox = dialogbox }}/>
<DialogBox
ref={dialogbox => {
this.dialogbox = dialogbox;
}}
/>
</View>
);
}
}
const DropboxLoginScreen = connect((state) => {
const DropboxLoginScreen = connect(state => {
return {
theme: state.settings.theme,
};
})(DropboxLoginScreenComponent)
})(DropboxLoginScreenComponent);
module.exports = { DropboxLoginScreen };
module.exports = { DropboxLoginScreen };

130
ReactNativeClient/lib/components/screens/encryption-config.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { TextInput, TouchableOpacity, Linking, View, Switch, StyleSheet, Text, Button, ScrollView, Platform } = require('react-native');
const EncryptionService = require('lib/services/EncryptionService');
const { connect } = require('react-redux');
@@ -14,7 +15,6 @@ const { dialogs } = require('lib/dialogs.js');
const DialogBox = require('react-native-dialogbox').default;
class EncryptionConfigScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -88,7 +88,7 @@ class EncryptionConfigScreenComponent extends BaseScreenComponent {
flex: 1,
padding: theme.margin,
},
}
};
this.styles_[themeId] = StyleSheet.create(styles);
return this.styles_[themeId];
@@ -99,28 +99,28 @@ class EncryptionConfigScreenComponent extends BaseScreenComponent {
const onSaveClick = () => {
return shared.onSavePasswordClick(this, mk);
}
};
const onPasswordChange = (text) => {
const onPasswordChange = text => {
return shared.onPasswordChange(this, mk, text);
}
};
const password = this.state.passwords[mk.id] ? this.state.passwords[mk.id] : '';
const passwordOk = this.state.passwordChecks[mk.id] === true ? '✔' : '❌';
const active = this.props.activeMasterKeyId === mk.id ? '✔' : '';
const inputStyle = {flex:1, marginRight: 10, color: theme.color};
const inputStyle = { flex: 1, marginRight: 10, color: theme.color };
inputStyle.borderBottomWidth = 1;
inputStyle.borderBottomColor = theme.strongDividerColor;
return (
<View key={mk.id}>
<Text style={this.styles().titleText}>{_('Master Key %s', mk.id.substr(0,6))}</Text>
<Text style={this.styles().titleText}>{_('Master Key %s', mk.id.substr(0, 6))}</Text>
<Text style={this.styles().normalText}>{_('Created: %s', time.formatMsToLocal(mk.created_time))}</Text>
<View style={{flexDirection: 'row', alignItems: 'center'}}>
<Text style={{flex:0, fontSize: theme.fontSize, marginRight: 10, color: theme.color}}>{_('Password:')}</Text>
<TextInput selectionColor={theme.textSelectionColor} secureTextEntry={true} value={password} onChangeText={(text) => onPasswordChange(text)} style={inputStyle}></TextInput>
<Text style={{fontSize: theme.fontSize, marginRight: 10, color: theme.color}}>{passwordOk}</Text>
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
<Text style={{ flex: 0, fontSize: theme.fontSize, marginRight: 10, color: theme.color }}>{_('Password:')}</Text>
<TextInput selectionColor={theme.textSelectionColor} secureTextEntry={true} value={password} onChangeText={text => onPasswordChange(text)} style={inputStyle}></TextInput>
<Text style={{ fontSize: theme.fontSize, marginRight: 10, color: theme.color }}>{passwordOk}</Text>
<Button title={_('Save')} onPress={() => onSaveClick()}></Button>
</View>
</View>
@@ -139,18 +139,36 @@ class EncryptionConfigScreenComponent extends BaseScreenComponent {
} catch (error) {
await dialogs.error(this, error.message);
}
}
};
return (
<View style={{flex:1, borderColor: theme.dividerColor, borderWidth: 1, padding: 10, marginTop: 10, marginBottom: 10}}>
<Text style={{fontSize: theme.fontSize, color: theme.color}}>{_('Enabling encryption means *all* your notes and attachments are going to be re-synchronised and sent encrypted to the sync target. Do not lose the password as, for security purposes, this will be the *only* way to decrypt the data! To enable encryption, please enter your password below.')}</Text>
<TextInput selectionColor={theme.textSelectionColor} style={{margin: 10, color: theme.color, borderWidth: 1, borderColor: theme.dividerColor }} secureTextEntry={true} value={this.state.passwordPromptAnswer} onChangeText={(text) => { this.setState({ passwordPromptAnswer: text }) }}></TextInput>
<View style={{flexDirection: 'row'}}>
<View style={{flex:1 , marginRight:10}} >
<Button title={_('Enable')} onPress={() => { onEnableClick() }}></Button>
<View style={{ flex: 1, borderColor: theme.dividerColor, borderWidth: 1, padding: 10, marginTop: 10, marginBottom: 10 }}>
<Text style={{ fontSize: theme.fontSize, color: theme.color }}>{_('Enabling encryption means *all* your notes and attachments are going to be re-synchronised and sent encrypted to the sync target. Do not lose the password as, for security purposes, this will be the *only* way to decrypt the data! To enable encryption, please enter your password below.')}</Text>
<TextInput
selectionColor={theme.textSelectionColor}
style={{ margin: 10, color: theme.color, borderWidth: 1, borderColor: theme.dividerColor }}
secureTextEntry={true}
value={this.state.passwordPromptAnswer}
onChangeText={text => {
this.setState({ passwordPromptAnswer: text });
}}
></TextInput>
<View style={{ flexDirection: 'row' }}>
<View style={{ flex: 1, marginRight: 10 }}>
<Button
title={_('Enable')}
onPress={() => {
onEnableClick();
}}
></Button>
</View>
<View style={{flex:1}} >
<Button title={_('Cancel')} onPress={() => { this.setState({ passwordPromptShow: false}) }}></Button>
<View style={{ flex: 1 }}>
<Button
title={_('Cancel')}
onPress={() => {
this.setState({ passwordPromptShow: false });
}}
></Button>
</View>
</View>
</View>
@@ -168,7 +186,7 @@ class EncryptionConfigScreenComponent extends BaseScreenComponent {
for (let i = 0; i < masterKeys.length; i++) {
const mk = masterKeys[i];
mkComps.push(this.renderMasterKey(i+1, mk));
mkComps.push(this.renderMasterKey(i + 1, mk));
const idx = nonExistingMasterKeyIds.indexOf(mk.id);
if (idx >= 0) nonExistingMasterKeyIds.splice(idx, 1);
@@ -199,30 +217,45 @@ class EncryptionConfigScreenComponent extends BaseScreenComponent {
const rows = [];
for (let i = 0; i < nonExistingMasterKeyIds.length; i++) {
const id = nonExistingMasterKeyIds[i];
rows.push(<Text style={this.styles().normalText} key={id}>{id}</Text>);
rows.push(
<Text style={this.styles().normalText} key={id}>
{id}
</Text>
);
}
nonExistingMasterKeySection = (
<View>
<Text style={this.styles().titleText}>{_('Missing Master Keys')}</Text>
<Text style={this.styles().normalText}>{_('The master keys with these IDs are used to encrypt some of your items, however the application does not currently have access to them. It is likely they will eventually be downloaded via synchronisation.')}</Text>
<View style={{marginTop: 10}}>{rows}</View>
<View style={{ marginTop: 10 }}>{rows}</View>
</View>
);
}
const passwordPromptComp = this.state.passwordPromptShow ? this.passwordPromptComponent() : null;
const toggleButton = !this.state.passwordPromptShow ? <View style={{marginTop: 10}}><Button title={this.props.encryptionEnabled ? _('Disable encryption') : _('Enable encryption')} onPress={() => onToggleButtonClick()}></Button></View> : null;
const toggleButton = !this.state.passwordPromptShow ? (
<View style={{ marginTop: 10 }}>
<Button title={this.props.encryptionEnabled ? _('Disable encryption') : _('Enable encryption')} onPress={() => onToggleButtonClick()}></Button>
</View>
) : null;
return (
<View style={this.rootStyle(this.props.theme).root}>
<ScreenHeader title={_('Encryption Config')}/>
<ScreenHeader title={_('Encryption Config')} />
<ScrollView style={this.styles().container}>
{<View style={{backgroundColor: theme.warningBackgroundColor, paddingTop: 5, paddingBottom: 5, paddingLeft: 10, paddingRight: 10 }}>
<Text>{_('For more information about End-To-End Encryption (E2EE) and advices on how to enable it please check the documentation:')}</Text>
<TouchableOpacity onPress={() => { Linking.openURL('https://joplinapp.org/e2ee/') }}><Text>https://joplinapp.org/e2ee/</Text></TouchableOpacity>
</View>}
{
<View style={{ backgroundColor: theme.warningBackgroundColor, paddingTop: 5, paddingBottom: 5, paddingLeft: 10, paddingRight: 10 }}>
<Text>{_('For more information about End-To-End Encryption (E2EE) and advices on how to enable it please check the documentation:')}</Text>
<TouchableOpacity
onPress={() => {
Linking.openURL('https://joplinapp.org/e2ee/');
}}
>
<Text>https://joplinapp.org/e2ee/</Text>
</TouchableOpacity>
</View>
}
<Text style={this.styles().titleText}>{_('Status')}</Text>
<Text style={this.styles().normalText}>{_('Encryption is: %s', this.props.encryptionEnabled ? _('Enabled') : _('Disabled'))}</Text>
@@ -231,26 +264,27 @@ class EncryptionConfigScreenComponent extends BaseScreenComponent {
{passwordPromptComp}
{mkComps}
{nonExistingMasterKeySection}
<View style={{flex:1, height: 20}}></View>
<View style={{ flex: 1, height: 20 }}></View>
</ScrollView>
<DialogBox ref={dialogbox => { this.dialogbox = dialogbox }}/>
<DialogBox
ref={dialogbox => {
this.dialogbox = dialogbox;
}}
/>
</View>
);
}
}
const EncryptionConfigScreen = connect(
(state) => {
return {
theme: state.settings.theme,
masterKeys: state.masterKeys,
passwords: state.settings['encryption.passwordCache'],
encryptionEnabled: state.settings['encryption.enabled'],
activeMasterKeyId: state.settings['encryption.activeMasterKeyId'],
notLoadedMasterKeys: state.notLoadedMasterKeys,
};
}
)(EncryptionConfigScreenComponent)
const EncryptionConfigScreen = connect(state => {
return {
theme: state.settings.theme,
masterKeys: state.masterKeys,
passwords: state.settings['encryption.passwordCache'],
encryptionEnabled: state.settings['encryption.enabled'],
activeMasterKeyId: state.settings['encryption.activeMasterKeyId'],
notLoadedMasterKeys: state.notLoadedMasterKeys,
};
})(EncryptionConfigScreenComponent);
module.exports = { EncryptionConfigScreen };
module.exports = { EncryptionConfigScreen };

40
ReactNativeClient/lib/components/screens/folder.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { View, Button, TextInput, StyleSheet } = require('react-native');
const { connect } = require('react-redux');
const { ActionButton } = require('lib/components/action-button.js');
@@ -12,7 +13,6 @@ const { themeStyle } = require('lib/components/global-style.js');
const { _ } = require('lib/locale.js');
class FolderScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -52,7 +52,7 @@ class FolderScreenComponent extends BaseScreenComponent {
lastSavedFolder: Object.assign({}, folder),
});
} else {
Folder.load(this.props.folderId).then((folder) => {
Folder.load(this.props.folderId).then(folder => {
this.setState({
folder: folder,
lastSavedFolder: Object.assign({}, folder),
@@ -72,7 +72,7 @@ class FolderScreenComponent extends BaseScreenComponent {
this.setState((prevState, props) => {
let folder = Object.assign({}, prevState.folder);
folder[propName] = propValue;
return { folder: folder }
return { folder: folder };
});
}
@@ -108,29 +108,23 @@ class FolderScreenComponent extends BaseScreenComponent {
return (
<View style={this.rootStyle(this.props.theme).root}>
<ScreenHeader
title={_('Edit notebook')}
showSaveButton={true}
saveButtonDisabled={saveButtonDisabled}
onSaveButtonPress={() => this.saveFolderButton_press()}
showSideMenuButton={false}
showSearchButton={false}
<ScreenHeader title={_('Edit notebook')} showSaveButton={true} saveButtonDisabled={saveButtonDisabled} onSaveButtonPress={() => this.saveFolderButton_press()} showSideMenuButton={false} showSearchButton={false} />
<TextInput placeholder={_('Enter notebook title')} underlineColorAndroid={theme.strongDividerColor} selectionColor={theme.textSelectionColor} style={this.styles().textInput} autoFocus={true} value={this.state.folder.title} onChangeText={text => this.title_changeText(text)} />
<dialogs.DialogBox
ref={dialogbox => {
this.dialogbox = dialogbox;
}}
/>
<TextInput placeholder={_('Enter notebook title')} underlineColorAndroid={theme.strongDividerColor} selectionColor={theme.textSelectionColor} style={this.styles().textInput} autoFocus={true} value={this.state.folder.title} onChangeText={(text) => this.title_changeText(text)} />
<dialogs.DialogBox ref={dialogbox => { this.dialogbox = dialogbox }}/>
</View>
);
}
}
const FolderScreen = connect(
(state) => {
return {
folderId: state.selectedFolderId,
theme: state.settings.theme,
};
}
)(FolderScreenComponent)
const FolderScreen = connect(state => {
return {
folderId: state.selectedFolderId,
theme: state.settings.theme,
};
})(FolderScreenComponent);
module.exports = { FolderScreen };
module.exports = { FolderScreen };

79
ReactNativeClient/lib/components/screens/log.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { ListView, View, Text, Button, StyleSheet, Platform } = require('react-native');
const { connect } = require('react-redux');
const { reg } = require('lib/registry.js');
@@ -10,7 +11,6 @@ const { BaseScreenComponent } = require('lib/components/base-screen.js');
const { _ } = require('lib/locale.js');
class LogScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -18,7 +18,9 @@ class LogScreenComponent extends BaseScreenComponent {
constructor() {
super();
const ds = new ListView.DataSource({
rowHasChanged: (r1, r2) => { return r1 !== r2; }
rowHasChanged: (r1, r2) => {
return r1 !== r2;
},
});
this.state = {
dataSource: ds,
@@ -38,16 +40,17 @@ class LogScreenComponent extends BaseScreenComponent {
flexDirection: 'row',
paddingLeft: 1,
paddingRight: 1,
paddingTop:0,
paddingBottom:0,
paddingTop: 0,
paddingBottom: 0,
},
rowText: {
fontSize: 10,
color: theme.color,
color: theme.color,
},
};
if (Platform.OS !== 'ios') { // Crashes on iOS with error "Unrecognized font family 'monospace'"
if (Platform.OS !== 'ios') {
// Crashes on iOS with error "Unrecognized font family 'monospace'"
styles.rowText.fontFamily = 'monospace';
}
@@ -69,12 +72,15 @@ class LogScreenComponent extends BaseScreenComponent {
if (showErrorsOnly === null) showErrorsOnly = this.state.showErrorsOnly;
let levels = [Logger.LEVEL_DEBUG, Logger.LEVEL_INFO, Logger.LEVEL_WARN, Logger.LEVEL_ERROR];
if (showErrorsOnly) levels = [Logger.LEVEL_WARN, Logger.LEVEL_ERROR]
if (showErrorsOnly) levels = [Logger.LEVEL_WARN, Logger.LEVEL_ERROR];
reg.logger().lastEntries(1000, { levels: levels }).then((entries) => {
const newDataSource = this.state.dataSource.cloneWithRows(entries);
this.setState({ dataSource: newDataSource });
});
reg
.logger()
.lastEntries(1000, { levels: levels })
.then(entries => {
const newDataSource = this.state.dataSource.cloneWithRows(entries);
this.setState({ dataSource: newDataSource });
});
}
toggleErrorsOnly() {
@@ -84,47 +90,50 @@ class LogScreenComponent extends BaseScreenComponent {
}
render() {
let renderRow = (item) => {
let renderRow = item => {
let textStyle = this.styles().rowText;
if (item.level == Logger.LEVEL_WARN) textStyle = this.styles().rowTextWarn;
if (item.level == Logger.LEVEL_ERROR) textStyle = this.styles().rowTextError;
return (
<View style={this.styles().row}>
<Text style={textStyle}>{time.formatMsToLocal(item.timestamp, 'MM-DDTHH:mm:ss') + ': ' + item.message}</Text>
</View>
);
}
};
// `enableEmptySections` is to fix this warning: https://github.com/FaridSafi/react-native-gifted-listview/issues/39
return (
<View style={this.rootStyle(this.props.theme).root}>
<ScreenHeader title={_('Log')}/>
<ListView
dataSource={this.state.dataSource}
renderRow={renderRow}
enableEmptySections={true}
/>
<View style={{flexDirection: 'row'}}>
<View style={{flex:1, marginRight: 5 }}>
<Button title={_("Refresh")} onPress={() => { this.resfreshLogEntries(); }}/>
<ScreenHeader title={_('Log')} />
<ListView dataSource={this.state.dataSource} renderRow={renderRow} enableEmptySections={true} />
<View style={{ flexDirection: 'row' }}>
<View style={{ flex: 1, marginRight: 5 }}>
<Button
title={_('Refresh')}
onPress={() => {
this.resfreshLogEntries();
}}
/>
</View>
<View style={{flex:1}}>
<Button title={this.state.showErrorsOnly ? _("Show all") : _("Errors only")} onPress={() => { this.toggleErrorsOnly(); }}/>
<View style={{ flex: 1 }}>
<Button
title={this.state.showErrorsOnly ? _('Show all') : _('Errors only')}
onPress={() => {
this.toggleErrorsOnly();
}}
/>
</View>
</View>
</View>
);
}
}
const LogScreen = connect(
(state) => {
return {
theme: state.settings.theme,
};
}
)(LogScreenComponent)
const LogScreen = connect(state => {
return {
theme: state.settings.theme,
};
})(LogScreenComponent);
module.exports = { LogScreen };
module.exports = { LogScreen };

108
ReactNativeClient/lib/components/screens/notes.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { AppState, View, Button, Text, StyleSheet } = require('react-native');
const { stateUtils } = require('lib/reducer.js');
const { connect } = require('react-redux');
@@ -18,7 +19,6 @@ const DialogBox = require('react-native-dialogbox').default;
const { BaseScreenComponent } = require('lib/components/base-screen.js');
class NotesScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -31,16 +31,16 @@ class NotesScreenComponent extends BaseScreenComponent {
let newProps = Object.assign({}, this.props);
newProps.notesSource = '';
await this.refreshNotes(newProps);
}
};
this.sortButton_press = async () => {
const buttons = [];
const sortNoteOptions = Setting.enumOptions('notes.sortOrder.field');
const makeCheckboxText = function(selected, sign, label) {
const s = sign === 'tick' ? '✓' : '⬤'
return (selected ? (s + ' ') : '') + label;
}
const s = sign === 'tick' ? '✓' : '⬤';
return (selected ? s + ' ' : '') + label;
};
for (let field in sortNoteOptions) {
if (!sortNoteOptions.hasOwnProperty(field)) continue;
@@ -69,7 +69,7 @@ class NotesScreenComponent extends BaseScreenComponent {
if (!r) return;
Setting.setValue(r.name, r.value);
}
};
}
styles() {
@@ -100,15 +100,11 @@ class NotesScreenComponent extends BaseScreenComponent {
AppState.removeEventListener('change', this.onAppStateChange_);
}
async componentDidUpdate(prevProps) {
if (prevProps.notesOrder !== this.props.notesOrder ||
prevProps.selectedFolderId != this.props.selectedFolderId ||
prevProps.selectedTagId != this.props.selectedTagId ||
prevProps.selectedSmartFilterId != this.props.selectedSmartFilterId ||
prevProps.notesParentType != this.props.notesParentType) {
await this.refreshNotes(this.props);
}
async componentDidUpdate(prevProps) {
if (prevProps.notesOrder !== this.props.notesOrder || prevProps.selectedFolderId != this.props.selectedFolderId || prevProps.selectedTagId != this.props.selectedTagId || prevProps.selectedSmartFilterId != this.props.selectedSmartFilterId || prevProps.notesParentType != this.props.notesParentType) {
await this.refreshNotes(this.props);
}
}
async refreshNotes(props = null) {
if (props === null) props = this.props;
@@ -147,18 +143,20 @@ class NotesScreenComponent extends BaseScreenComponent {
}
deleteFolder_onPress(folderId) {
dialogs.confirm(this, _('Delete notebook? All notes and sub-notebooks within this notebook will also be deleted.')).then((ok) => {
dialogs.confirm(this, _('Delete notebook? All notes and sub-notebooks within this notebook will also be deleted.')).then(ok => {
if (!ok) return;
Folder.delete(folderId).then(() => {
this.props.dispatch({
type: 'NAV_GO',
routeName: 'Notes',
smartFilterId: 'c3176726992c11e9ac940492261af972',
Folder.delete(folderId)
.then(() => {
this.props.dispatch({
type: 'NAV_GO',
routeName: 'Notes',
smartFilterId: 'c3176726992c11e9ac940492261af972',
});
})
.catch(error => {
alert(error.message);
});
}).catch((error) => {
alert(error.message);
});
});
}
@@ -206,7 +204,7 @@ class NotesScreenComponent extends BaseScreenComponent {
let rootStyle = {
flex: 1,
backgroundColor: theme.backgroundColor,
}
};
if (!this.props.visible) {
rootStyle.flex = 0.001; // This is a bit of a hack but it seems to work fine - it makes the component invisible but without unmounting it
@@ -217,52 +215,46 @@ class NotesScreenComponent extends BaseScreenComponent {
<View style={rootStyle}>
<ScreenHeader title={title} showSideMenuButton={true} showBackButton={false} />
</View>
)
);
}
let title = parent ? parent.title : null;
const addFolderNoteButtons = this.props.selectedFolderId && this.props.selectedFolderId != Folder.conflictFolderId();
const thisComp = this;
const actionButtonComp = this.props.noteSelectionEnabled || !this.props.visible ? null : <ActionButton addFolderNoteButtons={addFolderNoteButtons} parentFolderId={this.props.selectedFolderId}></ActionButton>
const actionButtonComp = this.props.noteSelectionEnabled || !this.props.visible ? null : <ActionButton addFolderNoteButtons={addFolderNoteButtons} parentFolderId={this.props.selectedFolderId}></ActionButton>;
return (
<View style={rootStyle}>
<ScreenHeader
title={title}
showBackButton={false}
parentComponent={thisComp}
sortButton_press={this.sortButton_press}
folderPickerOptions={this.folderPickerOptions()}
showSearchButton={true}
showSideMenuButton={true}
<ScreenHeader title={title} showBackButton={false} parentComponent={thisComp} sortButton_press={this.sortButton_press} folderPickerOptions={this.folderPickerOptions()} showSearchButton={true} showSideMenuButton={true} />
<NoteList style={this.styles().noteList} />
{actionButtonComp}
<DialogBox
ref={dialogbox => {
this.dialogbox = dialogbox;
}}
/>
<NoteList style={this.styles().noteList}/>
{ actionButtonComp }
<DialogBox ref={dialogbox => { this.dialogbox = dialogbox }}/>
</View>
);
}
}
const NotesScreen = connect(
(state) => {
return {
folders: state.folders,
tags: state.tags,
selectedFolderId: state.selectedFolderId,
selectedNoteIds: state.selectedNoteIds,
selectedTagId: state.selectedTagId,
selectedSmartFilterId: state.selectedSmartFilterId,
notesParentType: state.notesParentType,
notes: state.notes,
notesSource: state.notesSource,
uncompletedTodosOnTop: state.settings.uncompletedTodosOnTop,
showCompletedTodos: state.settings.showCompletedTodos,
theme: state.settings.theme,
noteSelectionEnabled: state.noteSelectionEnabled,
notesOrder: stateUtils.notesOrder(state.settings),
};
}
)(NotesScreenComponent)
const NotesScreen = connect(state => {
return {
folders: state.folders,
tags: state.tags,
selectedFolderId: state.selectedFolderId,
selectedNoteIds: state.selectedNoteIds,
selectedTagId: state.selectedTagId,
selectedSmartFilterId: state.selectedSmartFilterId,
notesParentType: state.notesParentType,
notes: state.notes,
notesSource: state.notesSource,
uncompletedTodosOnTop: state.settings.uncompletedTodosOnTop,
showCompletedTodos: state.settings.showCompletedTodos,
theme: state.settings.theme,
noteSelectionEnabled: state.noteSelectionEnabled,
notesOrder: stateUtils.notesOrder(state.settings),
};
})(NotesScreenComponent);
module.exports = { NotesScreen };

53
ReactNativeClient/lib/components/screens/onedrive-login.js
View File

@@ -1,7 +1,8 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { View } = require('react-native');
const { Button, Text } = require('react-native');
const { WebView } = require('react-native-webview');
const { WebView } = require('react-native-webview');
const { connect } = require('react-redux');
const Setting = require('lib/models/Setting.js');
const { ScreenHeader } = require('lib/components/screen-header.js');
@@ -11,7 +12,6 @@ const { BaseScreenComponent } = require('lib/components/base-screen.js');
const parseUri = require('lib/parseUri');
class OneDriveLoginScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -29,11 +29,17 @@ class OneDriveLoginScreenComponent extends BaseScreenComponent {
}
startUrl() {
return reg.syncTarget().api().authCodeUrl(this.redirectUrl());
return reg
.syncTarget()
.api()
.authCodeUrl(this.redirectUrl());
}
redirectUrl() {
return reg.syncTarget().api().nativeClientRedirectUrl();
return reg
.syncTarget()
.api()
.nativeClientRedirectUrl();
}
async webview_load(noIdeaWhatThisIs) {
@@ -44,10 +50,13 @@ class OneDriveLoginScreenComponent extends BaseScreenComponent {
const parsedUrl = parseUri(url);
if (!this.authCode_ && parsedUrl && parsedUrl.queryKey && parsedUrl.queryKey.code) {
this.authCode_ = parsedUrl.queryKey.code
this.authCode_ = parsedUrl.queryKey.code;
try {
await reg.syncTarget().api().execTokenRequest(this.authCode_, this.redirectUrl(), true);
await reg
.syncTarget()
.api()
.execTokenRequest(this.authCode_, this.redirectUrl(), true);
this.props.dispatch({ type: 'NAV_BACK' });
reg.scheduleSync(0);
} catch (error) {
@@ -83,27 +92,33 @@ class OneDriveLoginScreenComponent extends BaseScreenComponent {
render() {
const source = {
uri: this.state.webviewUrl,
}
};
return (
<View style={this.styles().screen}>
<ScreenHeader title={_('Login with OneDrive')}/>
<ScreenHeader title={_('Login with OneDrive')} />
<WebView
source={source}
onNavigationStateChange={(o) => { this.webview_load(o); }}
onError={() => { this.webview_error(); }}
onNavigationStateChange={o => {
this.webview_load(o);
}}
onError={() => {
this.webview_error();
}}
/>
<Button title={_("Refresh")} onPress={() => { this.retryButton_click(); }}></Button>
<Button
title={_('Refresh')}
onPress={() => {
this.retryButton_click();
}}
></Button>
</View>
);
}
}
const OneDriveLoginScreen = connect(
(state) => {
return {};
}
)(OneDriveLoginScreenComponent)
const OneDriveLoginScreen = connect(state => {
return {};
})(OneDriveLoginScreenComponent);
module.exports = { OneDriveLoginScreen };
module.exports = { OneDriveLoginScreen };

62
ReactNativeClient/lib/components/screens/search.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { ListView, StyleSheet, View, TextInput, FlatList, TouchableHighlight } = require('react-native');
const { connect } = require('react-redux');
const { ScreenHeader } = require('lib/components/screen-header.js');
@@ -13,7 +14,6 @@ const SearchEngineUtils = require('lib/services/SearchEngineUtils');
const DialogBox = require('react-native-dialogbox').default;
class SearchScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -43,8 +43,8 @@ class SearchScreenComponent extends BaseScreenComponent {
alignItems: 'center',
borderWidth: 1,
borderColor: theme.dividerColor,
}
}
},
};
styles.searchTextInput = Object.assign({}, theme.lineInput);
styles.searchTextInput.paddingLeft = theme.marginLeft;
@@ -111,13 +111,12 @@ class SearchScreenComponent extends BaseScreenComponent {
query = query === null ? this.state.query.trim : query.trim();
let notes = []
let notes = [];
if (query) {
if (!!this.props.settings['db.ftsEnabled']) {
if (this.props.settings['db.ftsEnabled']) {
notes = await SearchEngineUtils.notesForQuery(query);
} else {
} else {
let p = query.split(' ');
let temp = [];
for (let i = 0; i < p.length; i++) {
@@ -149,7 +148,7 @@ class SearchScreenComponent extends BaseScreenComponent {
let rootStyle = {
flex: 1,
backgroundColor: theme.backgroundColor,
}
};
if (!this.props.visible) {
rootStyle.flex = 0.001; // This is a bit of a hack but it seems to work fine - it makes the component invisible but without unmounting it
@@ -174,39 +173,38 @@ class SearchScreenComponent extends BaseScreenComponent {
<TextInput
style={this.styles().searchTextInput}
autoFocus={this.props.visible}
underlineColorAndroid="#ffffff00"
onSubmitEditing={() => { this.searchTextInput_submit() }}
onChangeText={(text) => this.searchTextInput_changeText(text) }
underlineColorAndroid="#ffffff00"
onSubmitEditing={() => {
this.searchTextInput_submit();
}}
onChangeText={text => this.searchTextInput_changeText(text)}
value={this.state.query}
selectionColor={theme.textSelectionColor}
/>
<TouchableHighlight onPress={() => this.clearButton_press() }>
<Icon name='md-close-circle' style={this.styles().clearIcon} />
<TouchableHighlight onPress={() => this.clearButton_press()}>
<Icon name="md-close-circle" style={this.styles().clearIcon} />
</TouchableHighlight>
</View>
<FlatList
data={this.state.notes}
keyExtractor={(item, index) => item.id}
renderItem={(event) => <NoteItem note={event.item}/>}
/>
<FlatList data={this.state.notes} keyExtractor={(item, index) => item.id} renderItem={event => <NoteItem note={event.item} />} />
</View>
<DialogBox ref={dialogbox => { this.dialogbox = dialogbox }}/>
<DialogBox
ref={dialogbox => {
this.dialogbox = dialogbox;
}}
/>
</View>
);
}
}
const SearchScreen = connect(
(state) => {
return {
query: state.searchQuery,
theme: state.settings.theme,
settings: state.settings,
noteSelectionEnabled: state.noteSelectionEnabled,
};
}
)(SearchScreenComponent)
const SearchScreen = connect(state => {
return {
query: state.searchQuery,
theme: state.settings.theme,
settings: state.settings,
noteSelectionEnabled: state.noteSelectionEnabled,
};
})(SearchScreenComponent);
module.exports = { SearchScreen };
module.exports = { SearchScreen };

81
ReactNativeClient/lib/components/screens/status.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { ListView, StyleSheet, View, Text, Button, FlatList } = require('react-native');
const Setting = require('lib/models/Setting.js');
const { connect } = require('react-redux');
@@ -22,7 +23,6 @@ const styles = StyleSheet.create({
});
class StatusScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -82,7 +82,7 @@ class StatusScreenComponent extends BaseScreenComponent {
retryHandler = async () => {
await item.retryHandler();
this.resfreshScreen();
}
};
}
text = item.text;
} else {
@@ -95,55 +95,56 @@ class StatusScreenComponent extends BaseScreenComponent {
lines.push({ key: 'divider2_' + i, isDivider: true });
}
return (<FlatList
data={lines}
renderItem={({item}) => {
let style = Object.assign({}, baseStyle);
return (
<FlatList
data={lines}
renderItem={({ item }) => {
let style = Object.assign({}, baseStyle);
if (item.isSection === true) {
style.fontWeight = 'bold';
style.marginBottom = 5;
}
if (item.isSection === true) {
style.fontWeight = 'bold';
style.marginBottom = 5;
}
style.flex = 1;
style.flex = 1;
const retryButton = item.retryHandler ? <View style={{flex:0}}><Button title={_('Retry')} onPress={item.retryHandler}/></View> : null;
if (item.isDivider) {
return (<View style={{borderBottomWidth: 1, borderBottomColor: theme.dividerColor, marginTop: 20, marginBottom: 20}}/>);
} else {
return (
<View style={{flex:1, flexDirection:'row'}}>
<Text style={style}>{item.text}</Text>
{retryButton}
const retryButton = item.retryHandler ? (
<View style={{ flex: 0 }}>
<Button title={_('Retry')} onPress={item.retryHandler} />
</View>
);
}
}}
/>);
}
) : null;
if (item.isDivider) {
return <View style={{ borderBottomWidth: 1, borderBottomColor: theme.dividerColor, marginTop: 20, marginBottom: 20 }} />;
} else {
return (
<View style={{ flex: 1, flexDirection: 'row' }}>
<Text style={style}>{item.text}</Text>
{retryButton}
</View>
);
}
}}
/>
);
};
let body = renderBody(this.state.report);
return (
<View style={this.rootStyle(this.props.theme).root}>
<ScreenHeader title={_('Status')}/>
<View style={styles.body}>
{ body }
</View>
<Button title={_("Refresh")} onPress={() => this.resfreshScreen()}/>
<ScreenHeader title={_('Status')} />
<View style={styles.body}>{body}</View>
<Button title={_('Refresh')} onPress={() => this.resfreshScreen()} />
</View>
);
}
}
const StatusScreen = connect(
(state) => {
return {
theme: state.settings.theme,
};
}
)(StatusScreenComponent)
const StatusScreen = connect(state => {
return {
theme: state.settings.theme,
};
})(StatusScreenComponent);
module.exports = { StatusScreen };
module.exports = { StatusScreen };

33
ReactNativeClient/lib/components/screens/tag.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { ListView, StyleSheet, View, TextInput, FlatList, TouchableHighlight } = require('react-native');
const { connect } = require('react-redux');
const { ScreenHeader } = require('lib/components/screen-header.js');
@@ -13,10 +14,9 @@ let styles = {
body: {
flex: 1,
},
}
};
class TagScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -53,22 +53,23 @@ class TagScreenComponent extends BaseScreenComponent {
return (
<View style={this.styles().screen}>
<ScreenHeader title={title} menuOptions={this.menuOptions()} />
<NoteList style={{flex: 1}}/>
<DialogBox ref={dialogbox => { this.dialogbox = dialogbox }}/>
<NoteList style={{ flex: 1 }} />
<DialogBox
ref={dialogbox => {
this.dialogbox = dialogbox;
}}
/>
</View>
);
}
}
const TagScreen = connect(
(state) => {
return {
tag: tag,
notes: state.notes,
notesSource: state.notesSource,
};
}
)(TagScreenComponent)
const TagScreen = connect(state => {
return {
tag: tag,
notes: state.notes,
notesSource: state.notesSource,
};
})(TagScreenComponent);
module.exports = { TagScreen };
module.exports = { TagScreen };

38
ReactNativeClient/lib/components/screens/tags.js
View File

@@ -1,4 +1,5 @@
const React = require('react'); const Component = React.Component;
const React = require('react');
const Component = React.Component;
const { AppState, View, Button, Text, FlatList, StyleSheet, TouchableOpacity } = require('react-native');
const { stateUtils } = require('lib/reducer.js');
const { connect } = require('react-redux');
@@ -18,7 +19,6 @@ const DialogBox = require('react-native-dialogbox').default;
const { BaseScreenComponent } = require('lib/components/base-screen.js');
class TagsScreenComponent extends BaseScreenComponent {
static navigationOptions(options) {
return { header: null };
}
@@ -74,8 +74,12 @@ class TagsScreenComponent extends BaseScreenComponent {
tagList_renderItem(event) {
const tag = event.item;
return (
<TouchableOpacity onPress={() => { this.tagItem_press({ id: tag.id }) }}>
<View style={ this.styles().listItem }>
<TouchableOpacity
onPress={() => {
this.tagItem_press({ id: tag.id });
}}
>
<View style={this.styles().listItem}>
<Text style={this.styles().listItemText}>{tag.title}</Text>
</View>
</TouchableOpacity>
@@ -100,31 +104,21 @@ class TagsScreenComponent extends BaseScreenComponent {
let rootStyle = {
flex: 1,
backgroundColor: theme.backgroundColor,
}
};
return (
<View style={rootStyle}>
<ScreenHeader
title={_('Tags')}
parentComponent={this}
showSearchButton={false}
/>
<FlatList style={{flex:1}}
data={this.state.tags}
renderItem={this.tagList_renderItem}
keyExtractor={this.tagList_keyExtractor}
/>
<ScreenHeader title={_('Tags')} parentComponent={this} showSearchButton={false} />
<FlatList style={{ flex: 1 }} data={this.state.tags} renderItem={this.tagList_renderItem} keyExtractor={this.tagList_keyExtractor} />
</View>
);
}
}
const TagsScreen = connect(
(state) => {
return {
theme: state.settings.theme,
};
}
)(TagsScreenComponent)
const TagsScreen = connect(state => {
return {
theme: state.settings.theme,
};
})(TagsScreenComponent);
module.exports = { TagsScreen };