import React, { PureComponent } from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import AsyncStorage from '@react-native-community/async-storage';

export class Home extends PureComponent<{}> {
  private saveData = async () => {
    try {
      await AsyncStorage.setItem(
        '@appdemo:tasks',
        JSON.stringify([{ key: 1, text: 'uno' }, { key: 2, text: 'dos' }])
      );
    } catch (error) {
      console.warn(error);
    }
  };

  private recoverData = async () => {
    try {
      const valor = await AsyncStorage.getItem('@appdemo:tasks');
      console.warn(valor);

      if (valor !== null) {
        const newtask = JSON.parse(valor);
        this.setState({ tareas: newtask });
      }
    } catch (error) {
      console.warn(error);
    }
  };

  public render(): JSX.Element {
    return (
      <View style={{ flex: 1, paddingTop: 50 }}>
        <TouchableOpacity onPress={this.saveData}>
          <Text>Save</Text>
        </TouchableOpacity>
        <TouchableOpacity onPress={this.recoverData}>
          <Text>Retrieve</Text>
        </TouchableOpacity>
        <Text>{JSON.stringify(this.state, null, 2)}</Text>
      </View>
    );
  }
}