Introduces data management section redesign

This commit is contained in:
mashazyu
2020-03-25 16:55:03 +01:00
committed by Sofiya Tepikin
parent a68ec248b0
commit f2706f509a
2 changed files with 43 additions and 42 deletions
+36 -37
View File
@@ -1,18 +1,22 @@
import React, { Component } from 'react'
import { ScrollView, View } from 'react-native'
import AppText from '../../common/app-text'
import Segment from '../../common/segment'
import AppLoadingView from '../../common/app-loading'
import SettingsButton from '../shared/settings-button'
import AppPage from '../../common/app-page'
import AppText from '../../common/app-text'
import Button from '../../common/button'
import Segment from '../../common/segment'
import { openImportDialog, getFileContent, importData } from './import-dialog'
import openShareDialogAndExport from './export-dialog'
import DeleteData from './delete-data'
import labels from '../../../i18n/en/settings'
export default class DataManagement extends Component {
constructor(props) {
super(props)
this.state = {
isLoading: false,
currentAction: null
@@ -51,41 +55,36 @@ export default class DataManagement extends Component {
}
render() {
const { currentAction } = this.state
const { currentAction, isLoading } = this.state
const isDeletingData = currentAction === 'delete'
return (
<View flex={1}>
{this.state.isLoading && <AppLoadingView />}
{!this.state.isLoading &&
<ScrollView>
<View>
<Segment title={labels.export.button}>
<AppText>{labels.export.segmentExplainer}</AppText>
<SettingsButton onPress={this.startExport}>
{labels.export.button}
</SettingsButton>
</Segment>
<Segment title={labels.import.button}>
<AppText>{labels.import.segmentExplainer}</AppText>
<SettingsButton
onPress= {this.startImport}
>
{labels.import.button}
</SettingsButton>
</Segment>
<Segment
title={labels.deleteSegment.title}
last
>
<AppText>{labels.deleteSegment.explainer}</AppText>
<DeleteData
isDeletingData = { currentAction === 'delete' }
onStartDeletion = {() => this.setCurrentAction('delete')}
/>
</Segment>
</View>
</ScrollView>
<AppPage>
{isLoading && <AppLoadingView />}
{!isLoading &&
<React.Fragment>
<Segment title={labels.export.button}>
<AppText>{labels.export.segmentExplainer}</AppText>
<Button isCTA onPress={this.startExport}>
{labels.export.button}
</Button>
</Segment>
<Segment title={labels.import.button}>
<AppText>{labels.import.segmentExplainer}</AppText>
<Button isCTA onPress= {this.startImport}>
{labels.import.button}
</Button>
</Segment>
<Segment title={labels.deleteSegment.title} last>
<AppText>{labels.deleteSegment.explainer}</AppText>
<DeleteData
isDeletingData = {isDeletingData}
onStartDeletion = {() => this.setCurrentAction('delete')}
/>
</Segment>
</React.Fragment>
}
</View>
</AppPage>
)
}
}