diff --git a/app/src/images/internet.png b/app/src/images/internet.png new file mode 100644 index 000000000..14c3f3ca2 Binary files /dev/null and b/app/src/images/internet.png differ diff --git a/app/src/images/nfc_help.png b/app/src/images/nfc_help.png new file mode 100644 index 000000000..23ac7a3a5 Binary files /dev/null and b/app/src/images/nfc_help.png differ diff --git a/app/src/images/scan_help.png b/app/src/images/scan_help.png new file mode 100644 index 000000000..e51600cc7 Binary files /dev/null and b/app/src/images/scan_help.png differ diff --git a/app/src/screens/AppScreen.tsx b/app/src/screens/AppScreen.tsx index 94d6e8489..9e4a587c6 100644 --- a/app/src/screens/AppScreen.tsx +++ b/app/src/screens/AppScreen.tsx @@ -38,6 +38,11 @@ const AppScreen: React.FC = ({ selectedApp, setSelectedApp, step nationality ); + const sepolia = () => ( + + Sepolia + + ); @@ -69,13 +74,13 @@ const AppScreen: React.FC = ({ selectedApp, setSelectedApp, step colorOfTheText: 'black', selectable: true, icon: Flame, - tags: [age(), nationality()] + tags: [sepolia()] } ]; return ( - - < YStack my="$4" gap="$5" px="$5" jc="center" alignItems='center' > + + < YStack my="$8" gap="$5" px="$5" jc="center" alignItems='center' > { cardsData.map(card => ( = ({ - -

Info

+

Help

+ + Linking.openURL('https://proofofpassport.com')}> + + + Linking.openURL('https://t.me/proofofpassport')}> + + + Linking.openURL('https://x.com/proofofpassport')}> + + + Linking.openURL('https://github.com/zk-passport/proof-of-passport')}> + + + - + + +

Security and Privacy

+ Proof of Passport uses Zero-Knowledge cryptography to allow you to prove facts about yourself like humanity, nationality or age without disclosing sensitive information. + + +

About ZK Proofs

+ Zero-knowledge proofs rely on mathematical magic tricks to show the correctness of some computation while hiding some inputs of its inputs. In our case, the proof shows the passport has not been forged, but allows you to hide sensitive data. + + +

FAQ

+ +

Troubleshoot NFC scanning

+ Refer to Linking.openURL('https://zk-passport.github.io/posts/how-to-scan-your-passport-using-nfc/')} color={blueColorLight} style={{ textDecorationLine: 'underline', fontStyle: 'italic' }}>this tutorial on how to scan your passport using NFC. + + +

My camera is down

+ Go to settings and turn on the broken camera option. + + +

My passport is not supported

+ Please contact us on telegram, or if you know how to develop, you can easily Linking.openURL('https://zk-passport.github.io/posts/how-to-contribute/')} color={blueColorLight} style={{ textDecorationLine: 'underline', fontStyle: 'italic' }}>contribute to the project by adding your region. + + + + + + + {/*

How do I scan my passport ?

@@ -336,7 +387,7 @@ const MainScreen: React.FC = ({ - + */} diff --git a/app/src/screens/ProveScreen.tsx b/app/src/screens/ProveScreen.tsx index 8454401c3..f316de6f2 100644 --- a/app/src/screens/ProveScreen.tsx +++ b/app/src/screens/ProveScreen.tsx @@ -120,8 +120,8 @@ const ProveScreen: React.FC = ({ console.log("new address settled:" + resolvedAddress); setAddress(resolvedAddress); setEns(inputValue); - toast.show('welcome', { - message: 'Hi ' + inputValue, + toast.show('✨ Welcome ✨', { + message: 'Nice to meet you ' + inputValue, customData: { type: "success", }, @@ -246,15 +246,14 @@ const ProveScreen: React.FC = ({ Disclose - + {/* */} Select optionnal data - - + {selectedApp && Object.keys(selectedApp.disclosure).map((key) => { const key_ = key as string; const indexes = attributeToPosition[key_]; @@ -263,7 +262,7 @@ const ProveScreen: React.FC = ({ const mrzAttributeFormatted = mrzAttribute; return ( - + handleDisclosureChange(key_)} > void; @@ -15,92 +18,110 @@ interface ScanScreenProps { const ScanScreen: React.FC = ({ onStartCameraScan, handleNFCScan, step }) => { const toast = useToastController(); return ( - + + - - - - - - - - Step 1 - Scan you passport - - - - - Use the camera to scan main page of your passport. - No personnal data will be stored or shared with external apps. - - - - {step >= Steps.MRZ_SCAN_COMPLETED ? ( - - Done + + + + + - ) : ( - - To-do - - )} - - - - - - - - - - - - - - Step 2 - Read the NFC chip - - - - - Hold your passport against your device to read the biometric chip. - No personnal data will be stored or shared with external apps. - - - - {step < Steps.MRZ_SCAN_COMPLETED ? ( - - To-do + + Step 1 + Scan you passport - ) : step < Steps.NFC_SCAN_COMPLETED ? ( - - To-do + + + + + Use the camera to scan main page of your passport. + No personnal data will be stored or shared with external apps. + + + + + {step >= Steps.MRZ_SCAN_COMPLETED ? ( + + Done + + ) : ( + + To-do + + )} + + + + + + + + + + + - ) : ( - - Done - - )} - - + + Step 2 + Read the NFC chip + + + + + + + Hold your passport against your device to read the biometric chip. + Follow Linking.openURL('https://zk-passport.github.io/posts/how-to-scan-your-passport-using-nfc/')} color={blueColorLight} style={{ textDecorationLine: 'underline', fontStyle: 'italic' }}>this guide if you have trouble reading your passport. + No personnal data will be stored or shared with external apps. + + + - - + + + {step < Steps.MRZ_SCAN_COMPLETED ? ( + + To-do + + ) : step < Steps.NFC_SCAN_COMPLETED ? ( + + To-do + + ) : ( + + Done + + )} + + + + + - {/* + + {/* = ({ onStartCameraScan, handleNFCSca Scan the machine readable zone on the main page of your passport */} - {/* = ({ onStartCameraScan, handleNFCSca 2 Hold your passport against your device to read the biometric chip */} - {/* + {/* { step < Steps.NFC_SCAN_COMPLETED @@ -155,7 +176,8 @@ const ScanScreen: React.FC = ({ onStartCameraScan, handleNFCSca } */} - + + ); };