update

packages/frontend/App.tsx

@@ -1,10 +1,23 @@
+// App.tsx
+import React from 'react';
 import { StatusBar } from 'expo-status-bar';
-import { StyleSheet, Text, View } from 'react-native';
+import { StyleSheet, Text, View, TextInput, Button } from 'react-native';
+import { useGenerateProof } from './src/hooks/useGenerateProof';
 
 export default function App() {
+  const { age, setAge, proofResult, handleGenerateProof } = useGenerateProof();
+
   return (
     <View style={styles.container}>
-      <Text>Open up App.tsx to start working on your app test!</Text>
+      <TextInput
+        style={styles.input}
+        placeholder="年齢を入力"
+        value={age}
+        onChangeText={setAge}
+        keyboardType="numeric"
+      />
+      <Button title="年齢を証明" onPress={handleGenerateProof} />
+      {proofResult ? <Text>{proofResult}</Text> : null}
       <StatusBar style="auto" />
     </View>
   );
@@ -17,4 +30,11 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
+  input: {
+    height: 40,
+    margin: 12,
+    borderWidth: 1,
+    padding: 10,
+    width: '80%',
+  },
 });

packages/frontend/package.json

@@ -15,10 +15,12 @@
     "test:watch": "jest --watch --verbose"
   },
   "dependencies": {
+    "axios": "^1.6.7",
     "expo": "~50.0.5",
     "expo-status-bar": "~1.11.1",
     "react": "18.2.0",
-    "react-native": "0.73.2"
+    "react-native": "0.73.2",
+    "react-native-config": "^1.5.1"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",

packages/frontend/src/hooks/useGenerateProof.ts

@@ -0,0 +1,24 @@
+// src/hooks/useGenerateProof.ts
+import { useState } from 'react';
+import { generateProof } from '../sindri';
+
+export const useGenerateProof = () => {
+  const [age, setAge] = useState<string>('');
+  const [proofResult, setProofResult] = useState<string>('');
+
+  const handleGenerateProof = async () => {
+    try {
+      const result = await generateProof(parseInt(age, 10));
+      setProofResult('年齢が証明されました');
+    } catch (error) {
+      setProofResult('証明に失敗しました');
+    }
+  };
+
+  return {
+    age,
+    setAge,
+    proofResult,
+    handleGenerateProof
+  };
+};