dappros/ethora

View on GitHub
client-reactnative/src/Screens/Privacy/ManageData.tsx

Summary

Maintainability
B
5 hrs
Test Coverage
import React, {useState} from 'react';
import {VStack} from 'native-base';
import {Platform, StyleSheet, Text, View} from 'react-native';

import Share from 'react-native-share';
import RNFS, {
  DocumentDirectoryPath,
  DownloadDirectoryPath,
} from 'react-native-fs';
import {textStyles} from '../../../docs/config';
import {DeleteDialog} from '../../components/Modals/DeleteDialog';
import {showSuccess, showError} from '../../components/Toast/toast';
import {httpDelete, httpGet} from '../../config/apiService';
import {changeUserData} from '../../config/routesConstants';
import {useStores} from '../../stores/context';
import {Button} from '../../components/Button';
export interface IManageData {}

export const ManageData: React.FC<IManageData> = ({}) => {
  const {loginStore} = useStores();
  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
  const [loading, setLoading] = useState(false);

  const deleteAccount = async () => {
    setLoading(true);
    try {
      await httpDelete(changeUserData, loginStore.userToken);
      showSuccess('Success', 'Account deleted successfully');
      loginStore.logOut();
    } catch (error) {
      console.log(error);
      showError('Error', 'Something went wrong');
    }
    setLoading(false);

    setDeleteDialogOpen(false);
  };
  const writeFile = async (data: string) => {
    const aPath = Platform.select({
      ios: DocumentDirectoryPath,
      android: DownloadDirectoryPath,
    });

    const fPath = aPath + '/' + 'data' + new Date().getTime() + '.json';
    try {
      // console.log(base64)
      await RNFS.writeFile(fPath, data, 'utf8');

      Share.open({url: Platform.OS === 'android' ? 'file://' + fPath : fPath});
    } catch (error) {
      showError('Error', 'Cannot write file');
    }
  };
  const exportData = async () => {
    setLoading(true);

    try {
      const {data} = await httpGet('/users/exportData', loginStore.userToken);
      const dataString = JSON.stringify(data);
      await writeFile(dataString);
    } catch (error) {
      showError('Error', 'Something went wrong');
      console.log(error);
    }
    setLoading(false);
  };
  return (
    <VStack paddingX={5} marginTop={5}>
      <VStack>
        <View>
          <Text style={styles.title}>Download your data</Text>

          <Text style={styles.description}>
            You own your data. Tap the button below to download a copy of your
            data
          </Text>
        </View>
        <View style={{alignItems: 'center', marginTop: 10}}>
          <Button
            style={{width: '60%'}}
            title="Download my data"
            onPress={exportData}
            loading={loading}
          />
        </View>
        <VStack marginTop={5}>
          <View>
            <Text style={styles.title}>Delete your account</Text>
            <Text style={styles.description}>
              Use this only if you want to permanently delete your account &
              data from our system.
            </Text>
            <Text style={[styles.note]}>
              Note: due to the immutable nature of distributed ledger
              technology, network nodes operated by the community may still
              retain historical transactions generated by your account, however
              your personally identifiable information such as your name,
              e-mail, your key-value storage etc will be removed.
            </Text>
            <Text style={[styles.note]}>
              Any of your digital assets will be lost.
            </Text>
          </View>
          <View style={{alignItems: 'center', marginTop: 10}}>
            <Button
              style={{backgroundColor: 'red', width: '60%'}}
              title="Delete my account"
              onPress={() => setDeleteDialogOpen(true)}
            />
          </View>
        </VStack>
      </VStack>
      <DeleteDialog
        loading={loading}
        open={deleteDialogOpen}
        onClose={() => setDeleteDialogOpen(false)}
        onDeletePress={deleteAccount}
        title={'Delete Account'}
        description={
          ' This will result in a complete deletion of your account and assets. Are you sure you want to proceed?'
        }
      />
    </VStack>
  );
};

const styles = StyleSheet.create({
  title: {
    fontFamily: textStyles.semiBoldFont,
    color: 'black',
    fontSize: 16,
    marginVertical: 5,
  },
  description: {
    fontFamily: textStyles.regularFont,
    color: 'black',
  },
  note: {
    color: 'black',
    marginTop: 5,
    fontStyle: 'italic',
    fontSize: 12,
  },
});