Rearrange Segment Element: * Rename SettingsSegment into FramedSegment * Move it out of Settings into Components

components/settings/data-management/index.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import { ScrollView } from 'react-native'
 import AppText from '../../app-text'
-import SettingsSegment from '../shared/settings-segment'
+import FramedSegment from '../../framed-segment'
 import SettingsButton from '../shared/settings-button'
 import openImportDialogAndImport from './import-dialog'
 import openShareDialogAndExport from './export-dialog'
@@ -11,27 +11,27 @@ import labels from '../../../i18n/en/settings'
 const DataManagement = () => {
   return (
     <ScrollView>
-      <SettingsSegment title={labels.export.button}>
+      <FramedSegment title={labels.export.button}>
         <AppText>{labels.export.segmentExplainer}</AppText>
         <SettingsButton onPress={openShareDialogAndExport}>
           {labels.export.button}
         </SettingsButton>
-      </SettingsSegment>
-      <SettingsSegment title={labels.import.button}>
+      </FramedSegment>
+      <FramedSegment title={labels.import.button}>
         <AppText>{labels.import.segmentExplainer}</AppText>
         <SettingsButton onPress={openImportDialogAndImport}>
           {labels.import.button}
         </SettingsButton>
-      </SettingsSegment>
-      <SettingsSegment
+      </FramedSegment>
+      <FramedSegment
         title={labels.deleteSegment.title}
         last
       >
         <AppText>{labels.deleteSegment.explainer}</AppText>
         <DeleteData />
-      </SettingsSegment>
+      </FramedSegment>
     </ScrollView>
   )
 }
 
-export default DataManagement
+export default DataManagement