From d87cea9ff2467f93be28533938dfc3a3e5c0c937 Mon Sep 17 00:00:00 2001
From: Akshay Nair <phenax5@gmail.com>
Date: Sun, 12 May 2024 18:04:15 +0530
Subject: Add home and clock on top

---
 src/components/Clock.tsx | 37 +++++++++++++++++++++++++++++++++++++
 src/screens/Home.tsx     | 14 ++++++++++++++
 2 files changed, 51 insertions(+)
 create mode 100644 src/components/Clock.tsx
 create mode 100644 src/screens/Home.tsx

(limited to 'src')

diff --git a/src/components/Clock.tsx b/src/components/Clock.tsx
new file mode 100644
index 0000000..113201f
--- /dev/null
+++ b/src/components/Clock.tsx
@@ -0,0 +1,37 @@
+import React, {useEffect, useMemo, useState} from 'react';
+import {Text, View} from 'react-native';
+
+export const Clock: React.FC = () => {
+  const [date, setDate] = useState(() => new Date());
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setDate(new Date());
+    }, 5000);
+    return () => clearInterval(interval);
+  }, []);
+
+  const timeText = useMemo(() => {
+    const formatter = new Intl.DateTimeFormat('en', {
+      hour: 'numeric',
+      minute: 'numeric',
+      second: 'numeric',
+    });
+    return formatter.format(date);
+  }, [date]);
+
+  const dateText = useMemo(() => {
+    const formatter = new Intl.DateTimeFormat('en-IN', {
+      month: 'short',
+      day: 'numeric',
+      weekday: 'long',
+    });
+    return formatter.format(date);
+  }, [date]);
+
+  return (
+    <View className="p-6">
+      <Text className="text-3xl font-bold">{timeText}</Text>
+      <Text className="text-lg">{dateText}</Text>
+    </View>
+  );
+};
diff --git a/src/screens/Home.tsx b/src/screens/Home.tsx
new file mode 100644
index 0000000..da24e13
--- /dev/null
+++ b/src/screens/Home.tsx
@@ -0,0 +1,14 @@
+import React, {useMemo} from 'react';
+import {Text, View} from 'react-native';
+import {Clock} from '../components/Clock';
+
+export const Home: React.FC = () => {
+  return (
+    <View>
+      <Clock />
+      <View className="p-6">
+        <Text>Favorites list</Text>
+      </View>
+    </View>
+  );
+};
-- 
cgit v1.3.1