Working Message

2026-04-26 16:24:03 +00:00 · 2024-04-14 11:51:15 +05:30
parent d4861c3b55
commit bd7d7d414d
4 changed files with 82 additions and 36 deletions
--- a/components/PrescriptionCreator/sendPrescription.tsx
+++ b/components/PrescriptionCreator/sendPrescription.tsx
@@ -1,6 +1,13 @@
-import { Button, Modal, Text, TextInput, View } from "react-native"
+import { useState } from "react";
+import { Button, Modal, NativeSyntheticEvent, Text, TextInput, TextInputChangeEventData, View } from "react-native"

-export const SendPrescription = ({ isVisible, onClose }: { isVisible: boolean, onClose: () => void }) => {
+export const ImportNsec = ({ isVisible, onClose, onPress }: { isVisible: boolean, onClose: () => void, onPress: (nsec: `nsec1${string}`) => void }) => {
+
+    const [nsec, setNsec] = useState("");
+
+    const handleNsec = (value: string) => {
+        setNsec(value)
+    }
    return (
        <Modal 
            visible={isVisible}
@@ -9,11 +16,13 @@ export const SendPrescription = ({ isVisible, onClose }: { isVisible: boolean, o
            presentationStyle="pageSheet">
            <View style={{ backgroundColor: "#ffffff", height: 500, justifyContent: "center", display: "flex", margin: 30, borderColor: "red", alignItems: "center"}}>
                <View style={{margin: 5}}>
-                    <Text style={{color: "#000000", margin: 5}}>Search an npub to send prescription</Text>
-                    <TextInput style={{borderColor: "#000000", borderWidth: 1, borderRadius: 5}}/>
+                    <Text style={{color: "#000000", margin: 5}}>
+                        Import Your Nsec
+                    </Text>
+                    <TextInput style={{borderColor: "#000000", borderWidth: 1, borderRadius: 5, color: "#000000"}} onChangeText={handleNsec}/>
                </View>
                <View>
-                    <Button title="Send"></Button>
+                    <Button title="Import" onPress={() => onPress(nsec)}></Button>
                </View>
            </View>
        </Modal>
--- a/components/PrescriptionCreator/index.tsx
+++ b/components/PrescriptionCreator/index.tsx
@@ -1,12 +1,14 @@
-import {Alert, Appearance, Dimensions, Image, StyleSheet, Text, View} from 'react-native';
-import {Colors} from 'react-native/Libraries/NewAppScreen';
-import {PropsWithChildren, useState} from 'react';
-import {Button, Card, Modal} from '@ant-design/react-native';
+import { Alert, Appearance, Dimensions, Image, StyleSheet, Text, View } from 'react-native';
+import { Colors } from 'react-native/Libraries/NewAppScreen';
+import { PropsWithChildren, useEffect, useState } from 'react';
+import { Button, Card, Modal } from '@ant-design/react-native';
 import { V1Field } from '@formstr/sdk/dist/interfaces';
 import { InputFiller } from '../Inputs/Inputs';
 // import { SendPrescription } from './sendPrescription';
 import { Dropdown } from 'react-native-element-dropdown';
 import { SimplePool, UnsignedEvent, finalizeEvent, generateSecretKey, getPublicKey, nip04, nip19 } from 'nostr-tools';
+import EncryptedStorage from 'react-native-encrypted-storage';
+import { ImportNsec } from './ImportNsec';

 type SectionProps = PropsWithChildren<{
  title: string;
@@ -42,7 +44,7 @@ const styles = StyleSheet.create({
 const width = Dimensions.get('window').width; //full width
 const height = Dimensions.get('window').height

-function Section({children, title}: SectionProps): React.JSX.Element {
+function Section({ children, title }: SectionProps): React.JSX.Element {
  return (
    <View style={styles.sectionContainer}>
      <Text
@@ -67,30 +69,49 @@ function Section({children, title}: SectionProps): React.JSX.Element {
  );
 }
 const locationData = [
-  { label: 'Pharmacy A', value: 'A', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://relay.damus.io"]},
-  { label: 'Pharmacy B', value: 'B', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://relay.primal.net"]},
-  { label: 'Pharmacy C', value: 'C', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://relay.hllo.live"]},
-  { label: 'Pharmacy D', value: 'D', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://nos.lol", "wss://relay.damus.io"]}
+  { label: 'Pharmacy A', value: 'A', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://relay.damus.io"] },
+  { label: 'Pharmacy B', value: 'B', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://relay.primal.net"] },
+  { label: 'Pharmacy C', value: 'C', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://relay.hllo.live"] },
+  { label: 'Pharmacy D', value: 'D', npub: 'npub1tea09rtjeuzgk4gjajzry37wuyv7h02d4zw38cpadcrkg5yt0qhqncr7km', relays: ["wss://nos.lol", "wss://relay.damus.io"] }
 ]

 const locationDummyData = [
  { label: 'Pharmacy A', value: 'A' }
 ]

-export const PrescriptionCreator = ({form} : {form: any}) => {
-  if(form === null) return <View style={{backgroundColor: "#ffffff"}}><Text style={{color: "#000000"}}>Loading...</Text></View>
-  const [showSendScreen, setShowSendScreen] = useState(false);
+export const PrescriptionCreator = ({ form }: { form: any }) => {
+  if (form === null) return <View style={{ backgroundColor: "#ffffff" }}><Text style={{ color: "#000000" }}>Loading...</Text></View>
+  const [showImportNsec, setShowImportNsec] = useState(false);
+  const [loggedInNpub, setLoggedInNpub] = useState("")
  const [selectedPharmacyId, setSelectedPharmacyId] = useState("");
  const [selectedPharmacyRelays, setSelectedPharmacyRelays] = useState([]);

+  useEffect(() => {
+    async function initialize() {
+      let doctorCredentials = null;
+      try {
+        doctorCredentials = await EncryptedStorage.getItem("user_credentials");
+        if(!doctorCredentials) {
+          setShowImportNsec(true)
+        }
+        else {
+          setLoggedInNpub(nip19.npubEncode(getPublicKey(nip19.decode(doctorCredentials).data as Uint8Array)))
+        }
+      }
+      catch(e) {
+        console.log("Error getting credentials", e)
+      }
+    }
+    initialize()
+  }, [])
  const renderItem = (item: any) => {
-    return <View style={{width: width, display: 'flex', flexDirection: 'column', padding: 10, flexWrap: "wrap"}}>
-      <Text style={{color: "black", fontSize: 24}}>{item.label}</Text>
-      <View style={{width: width -100}}>
-        <Text style={{color: 'grey', paddingBottom: 5}}>Npub: {item.npub}</Text>
-        <Text style={{color: 'grey'}}>Relays: {item.relays.join(', ')}</Text>
-      </View>
+    return <View style={{ width: width, display: 'flex', flexDirection: 'column', padding: 10, flexWrap: "wrap" }}>
+      <Text style={{ color: "black", fontSize: 24 }}>{item.label}</Text>
+      <View style={{ width: width - 100 }}>
+        <Text style={{ color: 'grey', paddingBottom: 5 }}>Npub: {item.npub}</Text>
+        <Text style={{ color: 'grey' }}>Relays: {item.relays.join(', ')}</Text>
      </View>
+    </View>
  }

  const handleLocationChange = (item: any) => {
@@ -98,16 +119,25 @@ export const PrescriptionCreator = ({form} : {form: any}) => {
    setSelectedPharmacyRelays(item.relays)
  }

+  const handleImportNsec = (nsec: string) => {
+    EncryptedStorage.setItem("user_credentials", nsec)
+    if(nsec.startsWith('nsec1') && nsec.length !== 63) {
+      Alert.alert("not a valid nsec!")
+      return;
+    }
+    setShowImportNsec(false)
+  }
+
  const sendPrescription = async () => {
    console.log("Will generate IDs")
-    const sk = generateSecretKey()
+    const sk = nip19.decode(await EncryptedStorage.getItem("user_credentials") as `nsec1${string}`).data as Uint8Array
    const pk = getPublicKey(sk)
    const pharmacyId = nip19.decode(selectedPharmacyId).data as string
-    console.log("Ids generated", sk, pk)
+    console.log("Got ids")
    const baseKind4Event: UnsignedEvent = {
      kind: 4,
-      tags: [["p", pharmacyId ]],
-      content: await nip04.encrypt(sk, pharmacyId, "This is a test message from PeerScribe" ),
+      tags: [["p", pharmacyId]],
+      content: await nip04.encrypt(sk, pharmacyId, "This is a test message from PeerScribe"),
      created_at: Math.floor(Date.now() / 1000),
      pubkey: pk
    }
@@ -134,18 +164,19 @@ export const PrescriptionCreator = ({form} : {form: any}) => {
        }}
      />
      <Section title="PeerScribe">
-        From the practice of {form.name}
+        From the practice of {loggedInNpub}
+        <Button size="small" onPress={() => {setShowImportNsec(true)}} >Edit!</Button>
      </Section>

      <Section title="Choose a Pharmacy">
-        <View style={{ width: width -40}}>
-          <Dropdown data={locationData} labelField={'label'} valueField={'label'} onChange={handleLocationChange} 
-            renderItem={renderItem} style={{width: "100%"}} placeholderStyle={{color: "white"}} selectedTextStyle={{color: 'white'}}/>
-          </View>
+        <View style={{ width: width - 40 }}>
+          <Dropdown data={locationData} labelField={'label'} valueField={'label'} onChange={handleLocationChange} value={locationData[0]}
+            renderItem={renderItem} style={{ width: "100%" }} placeholderStyle={{ color: "white" }} selectedTextStyle={{ color: 'white' }} />
+        </View>
      </Section>

      <Section title="Prescription">
-        <View style={{display: 'flex', flexDirection: 'column', width: "100%"}}>
+        <View style={{ display: 'flex', flexDirection: 'column', width: "100%" }}>
          {form.fields.map((field: V1Field) => {
            return (
              <Card
@@ -171,14 +202,14 @@ export const PrescriptionCreator = ({form} : {form: any}) => {
                  }}>
                  {field.answerType}
                </Text> */}
-                <InputFiller answerSettings={field.answerSettings} answerType={field.answerType} onChange={() => {}} />
+                <InputFiller answerSettings={field.answerSettings} answerType={field.answerType} onChange={() => { }} />
              </Card>
            );
          })}
          <Button type='primary' onPress={sendPrescription}> Create RX </Button>
        </View>
      </Section>
-      {/* <SendPrescription isVisible={showSendScreen} onClose={() => { setShowSendScreen(false)}}/> */}
+      <ImportNsec isVisible={showImportNsec} onClose={() => { setShowImportNsec(false)}} onPress={handleImportNsec}/>

    </View>
  );
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
    "react-native": "0.73.4",
    "react-native-crypto": "^2.2.0",
    "react-native-element-dropdown": "^2.10.4",
+    "react-native-encrypted-storage": "^4.0.3",
    "react-native-get-random-values": "^1.11.0",
    "react-native-picker-select": "^9.0.1",
    "react-native-randombytes": "^3.6.1",
--- a/yarn.lock
+++ b/yarn.lock
@@ -6586,6 +6586,11 @@ react-native-element-dropdown@^2.10.4:
  dependencies:
    lodash "^4.17.21"

+react-native-encrypted-storage@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/react-native-encrypted-storage/-/react-native-encrypted-storage-4.0.3.tgz#2a4d65459870511e8f4ccd22f02433dab7fa5e91"
+  integrity sha512-0pJA4Aj2S1PIJEbU7pN/Qvf7JIJx3hFywx+i+bLHtgK0/6Zryf1V2xVsWcrD50dfiu3jY1eN2gesQ5osGxE7jA==
+
 react-native-gesture-handler@~2.2.1:
  version "2.2.1"
  resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-2.2.1.tgz#672258aa5a40c92a97c736bdde0a8bd6c8c6c692"