1import { Button, HStack, Image, LiveActivity, LiveActivityState, Navigation, NavigationStack, Script, Text, useMemo, useState, VStack } from "scripting"
2
3function Example() {
4 const dismiss = Navigation.useDismiss()
5
6 const [state, setState] = useState<LiveActivityState>()
7 const activity = useMemo(() => {
8 const activity = new LiveActivity((attributes: {
9 mins: number
10 }) => {
11
12 return {
13 content: <HStack>
14 <Image systemName={"clock"} />
15 <Text>{attributes.mins}minutes left until next drink</Text>
16 </HStack>,
17 compactLeading: <HStack>
18 <Image systemName={"clock"} />
19 <Text>{attributes.mins}mins</Text>
20 </HStack>,
21 compactTrailing: <Image systemName={"waterbottle"} foregroundStyle={"systemBlue"} />,
22 minimal: <Image systemName={"clock"} />,
23 expanded: {
24 center: <HStack>
25 <Image systemName={"clock"} />
26 <Text>{attributes.mins}minutes left until next drink</Text>
27 </HStack>,
28 }
29 }
30 })
31
32 activity.addUpdateListener(setState)
33
34 return activity
35 }, [])
36
37 return <NavigationStack>
38 <VStack
39 navigationTitle={"LiveActivity Example"}
40 navigationBarTitleDisplayMode={"inline"}
41 toolbar={{
42 cancellationAction: <Button
43 title={"Done"}
44 action={dismiss}
45 />
46 }}
47 >
48 <Text>Activity State: {state ?? '-'}</Text>
49 <Button
50 title={"Start Live Activity"}
51 disabled={state != null}
52 action={() => {
53 let count = 5
54 activity.start({ mins: count })
55
56 function startTimer() {
57 setTimeout(() => {
58 count -= 1
59 if (count === 0) {
60 activity.end({ mins: 0 })
61 } else {
62 activity.update({ mins: count })
63 startTimer()
64 }
65 }, 60000)
66 }
67
68 startTimer()
69 }}
70 />
71 </VStack>
72 </NavigationStack>
73}
74
75async function run() {
76 await Navigation.present({
77 element: <Example />
78 })
79
80 Script.exit()
81}
82
83run()
