this repo has no description
1import React from 'react'
2import {
3 Text,
4 View,
5 StyleSheet,
6 Button,
7 Alert,
8 TextInput,
9 Platform,
10} from 'react-native'
11import {
12 digest,
13 getRandomValues,
14 createJwt,
15 generateJwk,
16 ReactNativeOAuthClient,
17} from 'expo-atproto-auth'
18import { OAuthSession } from '@atproto/oauth-client'
19import { Agent } from '@atproto/api'
20import type { ReactNativeKey } from 'expo-atproto-auth'
21
22const client = new ReactNativeOAuthClient({
23 clientMetadata: {
24 client_id: 'https://hailey.at/oauth-client-metadata.json',
25 client_name: 'React Native OAuth Client Demo',
26 client_uri: 'https://hailey.at',
27 redirect_uris: ['at.hailey:/auth/callback'],
28 scope: 'atproto transition:generic',
29 token_endpoint_auth_method: 'none',
30 response_types: ['code'],
31 grant_types: ['authorization_code', 'refresh_token'],
32 application_type: 'native',
33 dpop_bound_access_tokens: true,
34 },
35 handleResolver: 'https://bsky.social',
36})
37
38export default function App() {
39 const [values, setValues] = React.useState<Uint8Array>()
40 const [sha, setSha] = React.useState<Uint8Array>()
41 const [jwt, setJwt] = React.useState<string>()
42 const [privateJwk, setPrivateJwk] = React.useState<
43 ReactNativeKey | undefined
44 >()
45 const [session, setSession] = React.useState<OAuthSession>()
46 const [input, setInput] = React.useState<string>()
47 const [agent, setAgent] = React.useState<Agent>()
48
49 return (
50 <View style={styles.container}>
51 <Text>Current Account: {session ? session.did : 'No Account'}</Text>
52 <Text>Values: {values}</Text>
53 <Button
54 title="Generate Random Values"
55 onPress={() => {
56 const newValues = getRandomValues(400)
57 setValues(newValues)
58 }}
59 />
60 <Text>SHA: {sha}</Text>
61 <Button
62 title="SHA from values"
63 onPress={() => {
64 if (!values) {
65 return
66 }
67 let newSha: Uint8Array | undefined
68 try {
69 newSha = digest(values, 'sha256')
70 } catch (e: any) {
71 Alert.alert('Error', e.toString())
72 return
73 }
74 setSha(newSha)
75 }}
76 />
77 <Text>JWT: {jwt}</Text>
78 <Button
79 title="Create JWT"
80 onPress={() => {
81 if (!privateJwk) {
82 return
83 }
84
85 let newJwt: string | undefined
86 try {
87 newJwt = createJwt('', '', privateJwk)
88 } catch (e: any) {
89 Alert.alert('Error', e.toString())
90 return
91 }
92 setJwt(newJwt)
93 }}
94 />
95 <Text>Priv Key: {privateJwk?.kid}</Text>
96 <Button
97 title="Create JWK"
98 onPress={() => {
99 let newJwk: ReactNativeKey | undefined
100 try {
101 newJwk = generateJwk('ES256')
102 } catch (e: any) {
103 Alert.alert('Error', e.toString())
104 return
105 }
106 setPrivateJwk(newJwk)
107 }}
108 />
109
110 <TextInput
111 onChangeText={(t) => setInput(t)}
112 style={{ height: 40, width: 300, borderWidth: 1, padding: 5 }}
113 placeholder="Input"
114 autoCorrect={false}
115 />
116 <Button
117 title="Open Sign In"
118 onPress={async () => {
119 const res = await client.signIn(input ?? '')
120 if (res.status === 'success') {
121 setSession(res.session)
122 const newAgent = new Agent(res.session)
123 setAgent(newAgent)
124 } else if (res.status === 'error') {
125 Alert.alert('Error', (res.error as any).toString())
126 } else {
127 Alert.alert(
128 'Error',
129 `Received unknown WebResultType: ${res.status}`
130 )
131 }
132 }}
133 />
134
135 <Button
136 title="Restore from DID"
137 onPress={async () => {
138 try {
139 const restoreRes = await client.restore(input ?? '')
140 setSession(restoreRes)
141
142 const newAgent = new Agent(restoreRes)
143 setAgent(newAgent)
144 } catch (e: any) {
145 Alert.alert('Error', e.toString())
146 }
147 }}
148 />
149
150 <Button
151 title="Get Profile"
152 onPress={async () => {
153 try {
154 const res = await agent?.getProfile({
155 actor: session?.did ?? '',
156 })
157 Alert.alert(
158 'Profile',
159 `Display Name: ${res?.data.displayName}, Bio: ${res?.data.description}`
160 )
161 } catch (e: any) {
162 Alert.alert('Error', e.toString())
163 }
164 }}
165 disabled={!agent}
166 />
167
168 <Button
169 title="Create Post"
170 onPress={async () => {
171 try {
172 await agent?.post({
173 text: `Test post from Expo Atproto Auth example using platform ${Platform.OS}`,
174 })
175 } catch (e: any) {
176 Alert.alert('Error', e.toString())
177 }
178 }}
179 disabled={!agent}
180 />
181 </View>
182 )
183}
184
185const styles = StyleSheet.create({
186 container: {
187 flex: 1,
188 alignItems: 'center',
189 justifyContent: 'center',
190 },
191})