Add loading screen to data import

This commit is contained in:
mashazyu
2019-05-02 17:32:32 +02:00
parent c00684ebbb
commit 227aa69677
4 changed files with 98 additions and 39 deletions
+68 -29
View File
@@ -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 (
<ScrollView>
<FramedSegment title={labels.export.button}>
<AppText>{labels.export.segmentExplainer}</AppText>
<SettingsButton onPress={openShareDialogAndExport}>
{labels.export.button}
</SettingsButton>
</FramedSegment>
<FramedSegment title={labels.import.button}>
<AppText>{labels.import.segmentExplainer}</AppText>
<SettingsButton onPress={openImportDialogAndImport}>
{labels.import.button}
</SettingsButton>
</FramedSegment>
<FramedSegment
title={labels.deleteSegment.title}
last
>
<AppText>{labels.deleteSegment.explainer}</AppText>
<DeleteData />
</FramedSegment>
</ScrollView>
)
}
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 (
<View flex={1}>
{this.state.isLoading && <AppLoadingView />}
{!this.state.isLoading &&
<ScrollView>
<View>
<FramedSegment title={labels.export.button}>
<AppText>{labels.export.segmentExplainer}</AppText>
<SettingsButton onPress={openShareDialogAndExport}>
{labels.export.button}
</SettingsButton>
</FramedSegment>
<FramedSegment title={labels.import.button}>
<AppText>{labels.import.segmentExplainer}</AppText>
<SettingsButton
onPress= {() => openImportDialog(this.onImportData)}
>
{labels.import.button}
</SettingsButton>
</FramedSegment>
<FramedSegment
title={labels.deleteSegment.title}
last
>
<AppText>{labels.deleteSegment.explainer}</AppText>
<DeleteData />
</FramedSegment>
</View>
</ScrollView>
}
</View>
)
}
}