1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
import React, {useEffect, useMemo, useState} from 'react';
import {Pressable, Text, View} from 'react-native';
// @ts-expect-error No declaration file
import IntentLauncher from '@angelkrak/react-native-intent-launcher';
import {useStableCallback} from '../hooks/useStableCallback';
export const Clock: React.FC = React.memo(() => {
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]);
const showAlarms = useStableCallback(() =>
IntentLauncher.startActivity({
action: 'android.intent.action.SHOW_ALARMS',
}),
);
return (
<View className="p-6">
<Pressable onPress={showAlarms} className="self-start">
<Text className="text-4xl font-bold">{timeText}</Text>
<Text className="text-lg">{dateText}</Text>
</Pressable>
</View>
);
});
|
