"adding and deleting" using asyncStorage

app/index.tsx

@@ -22,10 +22,6 @@ const Home = () => {
   const [taskItem, setTaskItem] = useState<listProp[]>([]);
   const DarkMode = useColorScheme() === "dark";
 
-  // const handleData = (data) => {
-  //   setTaskItem(data);
-  // };
-
   const handlePress = () => {
     showCreate(true);
   };

components/CreateScrn.tsx

@@ -8,18 +8,18 @@ import {
   Alert,
   useColorScheme,
 } from "react-native";
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import { Entypo } from "@expo/vector-icons";
 import "react-native-get-random-values";
-// import AsyncStorage from "@react-native-async-storage/async-storage";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 
 import {
   getRandomLetter,
   getRandomNumber,
   getCurrentDateAndTime,
 } from "../constants/FUNT";
 import FONT from "../constants/FONT";
-import { createScreenProp } from "../types/type";
+import { createScreenProp, listProp } from "../types/type";
 // import list from "../assets/list";
 import { light, dark } from "../constants/Colors";
 
@@ -35,23 +35,26 @@ const CreateScrn = ({
   const key = getRandomLetter() + getRandomNumber();
   const DarkMode = useColorScheme() === "dark";
 
-  // const setData = async () => {
-  //   try {
-  //     var uniqueId = getRandomLetter() + getRandomNumber();
-  //     const newItem: any = { name, subject, date, time };
-  //     await AsyncStorage.setItem(uniqueId, JSON.stringify(newItem));
-  //   } catch (error) {
-  //     console.error("error saving data");
-  //   }
-  // };
+  const setData = async (newTask: listProp) => {
+    try {
+      const Data = await AsyncStorage.getItem("itemData");
+      let DataArray = Data ? JSON.parse(Data) : [];
 
-  const newItem = { key, name, subject, date, time };
+      const newItem = { key, name, subject, date, time };
+      const newDataArray = [...DataArray, newTask];
+      setTaskItem(newDataArray);
+      await AsyncStorage.setItem("itemData", JSON.stringify(newDataArray));
+    } catch (error) {
+      console.error("error saving data");
+    }
+  };
 
   const handlePress = () => {
     if (!name || !subject || !date || !time) {
       Alert.alert("Enter A Task");
     } else {
-      setTaskItem([...taskItem, newItem]);
+      const newItem = { key, name, subject, date, time };
+      setData(newItem);
       showCreate(false);
       setName("");
       setSubject("");

components/List.tsx

@@ -1,17 +1,30 @@
 import { View, StyleSheet, FlatList, useColorScheme, Text } from "react-native";
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { light, dark } from "../constants/Colors";
-// import AsyncStorage from "@react-native-async-storage/async-storage";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 import { FontAwesome5 } from "@expo/vector-icons";
 
 import ToDoCard from "./ToDoCard";
 import { ListProp, DataProp } from "../types/type";
 import FONT from "../constants/FONT";
 import list from "../assets/list";
-// import { getAllData } from "../constants/FUNT";
+import { fetchTaskItems } from "../constants/FUNT";
 
 const List = ({ create, taskItem, setTaskItem }: ListProp) => {
   const DarkMode = useColorScheme() === "dark";
+
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const fetchedData = await fetchTaskItems("itemData");
+        setTaskItem(fetchedData);
+      } catch (error) {
+        console.error("Error fetching data:", error);
+      }
+    };
+    fetchData();
+  }, []);
+
   const renderItem = ({ item, index }: DataProp) => {
     return (
       <ToDoCard

components/ToDoCard.tsx

@@ -7,8 +7,9 @@ import {
 } from "react-native";
 import React from "react";
 import { FontAwesome5, Ionicons, FontAwesome } from "@expo/vector-icons";
+import AsyncStorage from "@react-native-async-storage/async-storage";
 
-import { todoCardProp } from "../types/type";
+import { listProp, todoCardProp } from "../types/type";
 import FONT from "../constants/FONT";
 import { light, dark } from "../constants/Colors";
 
@@ -19,10 +20,19 @@ const ToDoCard = ({
   taskItem,
   DarkMode,
 }: todoCardProp) => {
-  const handlePress = () => {
-    const itemCopy = [...taskItem];
-    itemCopy.splice(index, 1);
-    setTaskItem(itemCopy);
+  const handleDelete = async () => {
+    try {
+      const existingData = await AsyncStorage.getItem("itemData");
+      let DataArray = existingData ? JSON.parse(existingData) : [];
+
+      const updatedData = DataArray.filter(
+        (item1: listProp) => item1.key !== item.key
+      );
+      setTaskItem(updatedData);
+      await AsyncStorage.setItem("itemData", JSON.stringify(updatedData));
+    } catch (error) {
+      console.log(error);
+    }
   };
 
   return (
@@ -47,7 +57,7 @@ const ToDoCard = ({
         </View>
       </View>
       <View style={styles.cont1}>
-        <Pressable onPress={handlePress}>
+        <Pressable onPress={handleDelete}>
           <Ionicons name="ios-trash-outline" size={24} color="#ED187A" />
         </Pressable>
         <FontAwesome name="check" size={24} color="#1CB674" />

constants/FUNT.ts

@@ -1,4 +1,5 @@
 import AsyncStorage from "@react-native-async-storage/async-storage";
+import { listProp } from "../types/type";
 
 const getRandomLetter = () => {
   const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
@@ -30,23 +31,39 @@ const getCurrentDateAndTime = () => {
   return { date, time };
 };
 
-const getAllData = async () => {
+const fetchTaskItems = async (key: string) => {
   try {
-    const allKeys = await AsyncStorage.getAllKeys();
-    const allItems = await AsyncStorage.multiGet(allKeys);
+    const existingData = await AsyncStorage.getItem(key);
+    if (existingData) {
+      return JSON.parse(existingData);
+    } else {
+      return [];
+    }
+  } catch (error) {
+    console.error("Error fetching data:", error);
+    return [];
+  }
+};
 
-    // Transform the array of arrays to an array of objects
-    const allData = allItems.map(([key, value]) => {
-      if (key !== null && value !== null) {
-        return { key, data: JSON.parse(value) };
-      } else return null;
-    });
+const deleteItem = async (key: string, itemKey: string) => {
+  try {
+    const existingData = await AsyncStorage.getItem(key);
+    let DataArray = existingData ? JSON.parse(existingData) : [];
+
+    const updatedData = DataArray.filter(
+      (item: listProp) => item.key !== itemKey
+    );
 
-    return allData;
+    await AsyncStorage.setItem("itemData", JSON.stringify(updatedData));
   } catch (error) {
-    console.error("Error getting all data:", error);
-    return [];
+    console.log(error);
   }
 };
 
-export { getRandomLetter, getRandomNumber, getCurrentDateAndTime, getAllData };
+export {
+  getRandomLetter,
+  getRandomNumber,
+  getCurrentDateAndTime,
+  fetchTaskItems,
+  deleteItem,
+};