Time with dayjs

package.json

@@ -16,6 +16,7 @@
     "@react-navigation/stack": "^5.9.2",
     "@ui-kitten/components": "^5.0.0",
     "@ui-kitten/eva-icons": "^5.0.0",
+    "dayjs": "^1.9.3",
     "expo": "^39.0.3",
     "expo-status-bar": "~1.0.2",
     "node-fetch": "^2.6.1",

screens/home.component.js

@@ -6,6 +6,10 @@ import { SafeAreaView, View, StyleSheet } from "react-native";
 import { signOut } from "../src/auth/signout";
 import { requestData } from "../src/app/api-req";
 
+const dayjs = require('dayjs');
+const relativeTime = require('dayjs/plugin/relativeTime');
+dayjs.extend(relativeTime);
+
 const data = new Array(5).fill({
   title: 'Item',
 });
@@ -15,7 +19,7 @@ const ListCustomItemShowcase = ( props ) => {
   const renderItemHeader = (headerProps, info) => (
     <View {...headerProps}>
       <Text category='h6'>
-        {info.item.node.id}
+        {info.item.node.task}
       </Text>
     </View>
   );
@@ -26,17 +30,21 @@ const ListCustomItemShowcase = ( props ) => {
     </Text>
   );
 
-  const renderItem = (info) => (
+  const renderItem = (info) => {
+
+    //const date = new Date(info.item.node.created_at);
+    return (
     <Card
       style={styles.item}
       status='basic'
       header={headerProps => renderItemHeader(headerProps, info)}
       footer={footerProps => renderItemFooter(footerProps, info)}>
       <Text>
-        {info.item.node.task}
+        Created {dayjs(info.item.node.created_at).fromNow()}
       </Text>
     </Card>
-  );
+    );
+  };
 
   return (
     props.data ?

src/app/api-req.js

@@ -36,6 +36,7 @@ export const requestData = async (params) => {
               }
               id
               task
+              created_at
             }
           }
         }