From 227aa69677e9dfecd9837dc39eff68e3e95eba0b Mon Sep 17 00:00:00 2001 From: mashazyu Date: Thu, 2 May 2019 17:32:32 +0200 Subject: [PATCH 1/3] Add loading screen to data import --- components/app-loading.js | 18 ++++ components/chart/chart.js | 7 +- .../settings/data-management/import-dialog.js | 15 ++- components/settings/data-management/index.js | 97 +++++++++++++------ 4 files changed, 98 insertions(+), 39 deletions(-) create mode 100644 components/app-loading.js diff --git a/components/app-loading.js b/components/app-loading.js new file mode 100644 index 0000000..c99cd51 --- /dev/null +++ b/components/app-loading.js @@ -0,0 +1,18 @@ +import React from 'react' + +import { View } from 'react-native' + +import AppText from './app-text' +import { shared } from '../i18n/en/labels' + +const AppLoadingView = () => { + return ( + + + {shared.loading} + + + ) +} + +export default AppLoadingView \ No newline at end of file diff --git a/components/chart/chart.js b/components/chart/chart.js index 586ed41..4106938 100644 --- a/components/chart/chart.js +++ b/components/chart/chart.js @@ -10,6 +10,7 @@ import { cycleDayColor } from '../../styles' import { scaleObservable } from '../../local-storage' import config from '../../config' import AppText from '../app-text' +import AppLoadingView from '../app-loading' import { shared as labels } from '../../i18n/en/labels' import DripIcon from '../../assets/drip-icons' import DripHomeIcon from '../../assets/drip-home-icons' @@ -133,11 +134,7 @@ export default class CycleChart extends Component { onLayout={this.onLayout} style={{ flexDirection: 'row', flex: 1 }} > - {!this.state.chartLoaded && - - {labels.loading} - - } + {!this.state.chartLoaded && } {this.state.chartHeight && this.state.chartLoaded && diff --git a/components/settings/data-management/import-dialog.js b/components/settings/data-management/import-dialog.js index 5971c4b..9995d31 100644 --- a/components/settings/data-management/import-dialog.js +++ b/components/settings/data-management/import-dialog.js @@ -6,23 +6,23 @@ import { shared as sharedLabels } from '../../../i18n/en/labels' import labels from '../../../i18n/en/settings' import alertError from '../shared/alert-error' -export default function openImportDialogAndImport() { +export function openImportDialog(onImportData) { Alert.alert( labels.import.title, labels.import.message, [{ text: labels.import.replaceOption, - onPress: () => getFileContentAndImport({ deleteExisting: false }) + onPress: () => onImportData(false) }, { text: labels.import.deleteOption, - onPress: () => getFileContentAndImport({ deleteExisting: true }) + onPress: () => onImportData(true) }, { text: sharedLabels.cancel, style: 'cancel', onPress: () => { } }] ) } -async function getFileContentAndImport({ deleteExisting }) { +export async function getFileContent() { let fileInfo try { fileInfo = await new Promise((resolve, reject) => { @@ -45,8 +45,13 @@ async function getFileContentAndImport({ deleteExisting }) { return importError(labels.import.errors.couldNotOpenFile) } + return fileContent +} + +export async function importData(shouldDeleteExistingData, fileContent) { + try { - await importCsv(fileContent, deleteExisting) + await importCsv(fileContent, shouldDeleteExistingData) Alert.alert(sharedLabels.successTitle, labels.import.success.message) } catch(err) { importError(err.message) diff --git a/components/settings/data-management/index.js b/components/settings/data-management/index.js index bbcf9df..27818f8 100644 --- a/components/settings/data-management/index.js +++ b/components/settings/data-management/index.js @@ -1,37 +1,76 @@ -import React from 'react' -import { ScrollView } from 'react-native' +import React, { Component } from 'react' +import { ScrollView, View } from 'react-native' import AppText from '../../app-text' import FramedSegment from '../../framed-segment' +import AppLoadingView from '../../app-loading' import SettingsButton from '../shared/settings-button' -import openImportDialogAndImport from './import-dialog' +import { openImportDialog, getFileContent, importData } from './import-dialog' import openShareDialogAndExport from './export-dialog' import DeleteData from './delete-data' import labels from '../../../i18n/en/settings' -const DataManagement = () => { - return ( - - - {labels.export.segmentExplainer} - - {labels.export.button} - - - - {labels.import.segmentExplainer} - - {labels.import.button} - - - - {labels.deleteSegment.explainer} - - - - ) -} +export default class DataManagement extends Component { -export default DataManagement + constructor(props) { + super(props) + this.state = { isLoading: false } + } + + onStartLoading = () => { + this.setState({ isLoading: true }) + } + + onEndLoading = () => { + this.setState({ isLoading: false }) + } + + onImportData = async (shouldDeleteExistingData) => { + + try { + this.onStartLoading() + const fileContent = await getFileContent() + if (fileContent) { + await importData(shouldDeleteExistingData, fileContent) + } + } catch(err) { + return + } finally { + this.onEndLoading() + } + } + + render() { + return ( + + {this.state.isLoading && } + {!this.state.isLoading && + + + + {labels.export.segmentExplainer} + + {labels.export.button} + + + + {labels.import.segmentExplainer} + openImportDialog(this.onImportData)} + > + {labels.import.button} + + + + {labels.deleteSegment.explainer} + + + + + } + + ) + } +} From 9ee7819462af3cb9eb717ed93bcb2e491b9b2575 Mon Sep 17 00:00:00 2001 From: Julia Friesel Date: Mon, 6 May 2019 08:37:26 +0200 Subject: [PATCH 2/3] Rename methods --- components/settings/data-management/index.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/components/settings/data-management/index.js b/components/settings/data-management/index.js index 27818f8..c9e10a0 100644 --- a/components/settings/data-management/index.js +++ b/components/settings/data-management/index.js @@ -16,16 +16,15 @@ export default class DataManagement extends Component { this.state = { isLoading: false } } - onStartLoading = () => { + startLoading = () => { this.setState({ isLoading: true }) } - onEndLoading = () => { + endLoading = () => { this.setState({ isLoading: false }) } - onImportData = async (shouldDeleteExistingData) => { - + startImportFlow = async (shouldDeleteExistingData) => { try { this.onStartLoading() const fileContent = await getFileContent() From 6a98b284276d1c5a1cbaeecbbf9eee96447e0311 Mon Sep 17 00:00:00 2001 From: Julia Friesel Date: Mon, 6 May 2019 08:42:43 +0200 Subject: [PATCH 3/3] Remove superfluous try/catch --- components/settings/data-management/index.js | 17 ++++++----------- 1 file changed, 6 insertions(+), 11 deletions(-) diff --git a/components/settings/data-management/index.js b/components/settings/data-management/index.js index c9e10a0..04a6ccb 100644 --- a/components/settings/data-management/index.js +++ b/components/settings/data-management/index.js @@ -25,17 +25,12 @@ export default class DataManagement extends Component { } startImportFlow = async (shouldDeleteExistingData) => { - try { - this.onStartLoading() - const fileContent = await getFileContent() - if (fileContent) { - await importData(shouldDeleteExistingData, fileContent) - } - } catch(err) { - return - } finally { - this.onEndLoading() + this.startLoading() + const fileContent = await getFileContent() + if (fileContent) { + await importData(shouldDeleteExistingData, fileContent) } + this.endLoading() } render() { @@ -54,7 +49,7 @@ export default class DataManagement extends Component { {labels.import.segmentExplainer} openImportDialog(this.onImportData)} + onPress= {() => openImportDialog(this.startImportFlow)} > {labels.import.button}