1import { Button, Form, Navigation, NavigationStack, Picker, Script, Section, Text, Toggle, useState } from "scripting"
2
3type NotifyMeAboutType = "directMessages" | "mentions" | "anything"
4type ProfileImageSize = "large" | "medium" | "small"
5
6function Example() {
7 const dismiss = Navigation.useDismiss()
8 const [notifyMeAbout, setNotifyMeAbout] = useState<NotifyMeAboutType>("directMessages")
9 const [playNotificationSounds, setPlayNotificationSounds] = useState(true)
10 const [profileImageSize, setprofileImageSize] = useState<ProfileImageSize>("medium")
11 const [sendReadReceipts, setSendReadReceipts] = useState(false)
12
13 return <NavigationStack>
14 <Form
15 navigationTitle={"Form"}
16 toolbar={{
17 cancellationAction: <Button
18 title={"Done"}
19 action={dismiss}
20 />
21 }}
22 >
23 <Section
24 header={<Text>Notifications</Text>}
25 >
26 <Picker
27 title={"Notify Me About"}
28 value={notifyMeAbout}
29 onChanged={setNotifyMeAbout as any}
30 >
31 <Text
32 tag={"directMessages"}
33 >Direct Messages</Text>
34 <Text
35 tag={"mentions"}
36 >Mentions</Text>
37 <Text
38 tag={"anything"}
39 >Anything</Text>
40 </Picker>
41
42 <Toggle
43 title={"Play notification sounds"}
44 value={playNotificationSounds}
45 onChanged={setPlayNotificationSounds}
46 />
47 <Toggle
48 title={"Send read receipts"}
49 value={sendReadReceipts}
50 onChanged={setSendReadReceipts}
51 />
52 </Section>
53
54 <Section
55 header={<Text>User Profiles</Text>}
56 >
57 <Picker
58 title={"Profile Image Size"}
59 value={profileImageSize}
60 onChanged={setprofileImageSize as any}
61 >
62 <Text
63 tag={"large"}
64 >Large</Text>
65 <Text
66 tag={"medium"}
67 >Medium</Text>
68 <Text
69 tag={"small"}
70 >Small</Text>
71 </Picker>
72
73 <Button
74 title={"Clear Image Cache"}
75 action={() => { }}
76 />
77 </Section>
78 </Form>
79 </NavigationStack>
80}
81
82async function run() {
83 await Navigation.present({
84 element: <Example />
85 })
86
87 Script.exit()
88}
89
90run()
