First Version

App.tsx

@@ -5,114 +5,45 @@
  * @format
  */
 
-import React from 'react';
+import React, {useEffect, useState} from 'react';
-import type {PropsWithChildren} from 'react';
+import {SafeAreaView, ScrollView, StatusBar, StyleSheet} from 'react-native';
-import {
-  SafeAreaView,
-  ScrollView,
-  StatusBar,
-  StyleSheet,
-  Text,
-  useColorScheme,
-  View,
-} from 'react-native';
 
-import {
+import {getFormTemplate} from './formstr/formstr';
-  Colors,
+import {Colors} from 'react-native/Libraries/NewAppScreen';
-  DebugInstructions,
+import {PrescriptionCreator} from './components/PrescriptionCreator';
-  Header,
-  LearnMoreLinks,
-  ReloadInstructions,
-} from 'react-native/Libraries/NewAppScreen';
-
-type SectionProps = PropsWithChildren<{
-  title: string;
-}>;
-
-function Section({children, title}: SectionProps): React.JSX.Element {
-  const isDarkMode = useColorScheme() === 'dark';
-  return (
-    <View style={styles.sectionContainer}>
-      <Text
-        style={[
-          styles.sectionTitle,
-          {
-            color: isDarkMode ? Colors.white : Colors.black,
-          },
-        ]}>
-        {title}
-      </Text>
-      <Text
-        style={[
-          styles.sectionDescription,
-          {
-            color: isDarkMode ? Colors.light : Colors.dark,
-          },
-        ]}>
-        {children}
-      </Text>
-    </View>
-  );
-}
 
 function App(): React.JSX.Element {
-  const isDarkMode = useColorScheme() === 'dark';
-
   const backgroundStyle = {
-    backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
+    backgroundColor: Colors.darker,
   };
 
+  const [form, setForm] = useState<{} | null>(null);
+
+  useEffect(() => {
+    console.log('inside useeffect');
+    const fetchForm = async () => {
+      console.log('fetchiiiing forrmmm!!!');
+      let form = await getFormTemplate(
+        'eb3df1f89653475f0bcbd22da35f8d2f126db8a68a88a7abedc53535c76c39b4',
+      );
+      setForm(form);
+    };
+    fetchForm();
+  }, [form, setForm]);
+
   return (
     <SafeAreaView style={backgroundStyle}>
       <StatusBar
-        barStyle={isDarkMode ? 'light-content' : 'dark-content'}
+        barStyle={'light-content'}
         backgroundColor={backgroundStyle.backgroundColor}
       />
       <ScrollView
         contentInsetAdjustmentBehavior="automatic"
         style={backgroundStyle}>
-        <Header />
+        <PrescriptionCreator />
-        <View
-          style={{
-            backgroundColor: isDarkMode ? Colors.black : Colors.white,
-          }}>
-          <Section title="Step One">
-            Edit <Text style={styles.highlight}>App.tsx</Text> to change this
-            screen and then come back to see your edits.
-          </Section>
-          <Section title="See Your Changes">
-            <ReloadInstructions />
-          </Section>
-          <Section title="Debug">
-            <DebugInstructions />
-          </Section>
-          <Section title="Learn More">
-            Read the docs to discover what to do next:
-          </Section>
-          <LearnMoreLinks />
-        </View>
       </ScrollView>
     </SafeAreaView>
   );
 }
 
-const styles = StyleSheet.create({
-  sectionContainer: {
-    marginTop: 32,
-    paddingHorizontal: 24,
-  },
-  sectionTitle: {
-    fontSize: 24,
-    fontWeight: '600',
-  },
-  sectionDescription: {
-    marginTop: 8,
-    fontSize: 18,
-    fontWeight: '400',
-  },
-  highlight: {
-    fontWeight: '700',
-  },
-});
-
 export default App;

components/PrescriptionCreator/index.tsx

@@ -0,0 +1,113 @@
+import {Dimensions, Image, StyleSheet, Text, View} from 'react-native';
+import SampleJSON from '../../formstr/sample.json';
+import {Colors} from 'react-native/Libraries/NewAppScreen';
+import {PropsWithChildren} from 'react';
+import {Card} from '@ant-design/react-native';
+
+type SectionProps = PropsWithChildren<{
+  title: string;
+}>;
+
+const backgroundStyle = {
+  backgroundColor: Colors.darker,
+};
+
+const styles = StyleSheet.create({
+  sectionContainer: {
+    marginTop: 32,
+    paddingHorizontal: 24,
+    width: Dimensions.get('window').width - 80,
+  },
+  sectionTitle: {
+    fontSize: 24,
+    fontWeight: '600',
+  },
+  sectionDescription: {
+    marginTop: 8,
+    fontSize: 18,
+    fontWeight: '400',
+  },
+  highlight: {
+    fontWeight: '500',
+  },
+});
+
+function Section({children, title}: SectionProps): React.JSX.Element {
+  return (
+    <View style={styles.sectionContainer}>
+      <Text
+        style={[
+          styles.sectionTitle,
+          {
+            color: Colors.white,
+          },
+        ]}>
+        {title}
+      </Text>
+      <Text
+        style={[
+          styles.sectionDescription,
+          {
+            color: Colors.light,
+          },
+        ]}>
+        {children}
+      </Text>
+    </View>
+  );
+}
+
+export const PrescriptionCreator = () => {
+  return (
+    <View
+      style={{
+        backgroundColor: Colors.black,
+      }}>
+      <Image
+        style={{
+          height: 100,
+          width: Dimensions.get('window').width,
+        }}
+        source={{
+          uri: SampleJSON.settings.titleImageUrl,
+        }}
+      />
+      <Section title="PeerScribe">
+        From the practice of {SampleJSON.name}
+      </Section>
+
+      <Section title="Prescription">
+        <View style={{display: 'flex', flexDirection: 'column'}}>
+          {SampleJSON.fields.map(field => {
+            return (
+              <Card
+                key={field.questionId}
+                style={{
+                  display: 'flex',
+                  flexDirection: 'column',
+                  padding: 10,
+                  backgroundColor: Colors.white,
+                  margin: 10,
+                  width: 500,
+                  height: 'auto',
+                }}>
+                <Text
+                  style={{
+                    color: Colors.green,
+                  }}>
+                  {field.question}
+                </Text>
+                <Text
+                  style={{
+                    color: Colors.light,
+                  }}>
+                  {field.answerType}
+                </Text>
+              </Card>
+            );
+          })}
+        </View>
+      </Section>
+    </View>
+  );
+};

formstr/formstr.ts

@@ -0,0 +1,58 @@
+import {SimplePool} from 'nostr-tools';
+import {V1FormSpec} from '@formstr/sdk/dist/interfaces';
+
+const defaultRelays = ['wss://relay.primal.net/', 'wss://relay.hllo.live'];
+
+export const getFormTemplate = async (formId: string): Promise<{}> => {
+  console.log('inside getFormTemplate');
+  const pool = new SimplePool();
+  let formIdPubkey = formId;
+  let relayList = defaultRelays;
+  console.log('everything initialised');
+  const filter = {
+    kinds: [0],
+    authors: [formIdPubkey], //formId is the npub of the form
+  };
+  console.log('getting kind0', filter);
+  pool
+    .get(relayList, filter, {maxWait: 10})
+    .then(
+      value => {
+        console.log('got kind0', value);
+        return;
+      },
+      reason => {
+        console.log('failed to get because', reason);
+        return;
+      },
+    )
+    .catch(reason => {
+      console.log('Errored', reason);
+      return;
+    });
+  console.log('after promise');
+
+  try {
+    console.log('inside try');
+    console.log(
+      'Event',
+      await pool.querySync(relayList, filter, {maxWait: 10}),
+    );
+    // console.log('fetching...', fetch('https://github.com'));
+    console.log('Main thread is stuck');
+  } catch (e) {
+    console.log('inside catch');
+    console.log('error is', e);
+  }
+
+  console.log('After everything');
+
+  pool.close(relayList);
+  let formTemplate;
+  // if (kind0) {
+  //   formTemplate = JSON.parse(kind0.content);
+  // } else {
+  //   throw Error('Form template not found');
+  // }
+  return {};
+};

formstr/sample.json

@@ -0,0 +1,121 @@
+{
+  "name": "X Pharmacy ",
+  "schemaVersion": "v1",
+  "settings": {
+    "titleImageUrl": "https://www.studentdoctor.net/wp-content/uploads/2018/08/20180815_prescription.png",
+    "description": "Testing formstr for getting prescriptions",
+    "thankYouPage": true
+  },
+  "fields": [
+    {
+      "question": "Location",
+      "answerType": "dropdown",
+      "answerSettings": {
+        "choices": [
+          {
+            "label": "Narnia",
+            "choiceId": "ae9DZi"
+          },
+          {
+            "label": "Hogwarts",
+            "choiceId": "Dx4gyn"
+          },
+          {
+            "label": "Mordor",
+            "choiceId": "oWygzo"
+          },
+          {
+            "label": "Tattooine",
+            "choiceId": "dLgxns"
+          }
+        ],
+        "required": true
+      },
+      "questionId": "V7yEc2"
+    },
+    {
+      "question": "Patient",
+      "answerType": "label",
+      "answerSettings": {},
+      "questionId": "BPfwxq"
+    },
+    {
+      "question": "Name",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "HLydbI"
+    },
+    {
+      "question": "Date Of Birth ",
+      "answerType": "date",
+      "answerSettings": {},
+      "questionId": "lzpBhA"
+    },
+    {
+      "question": "Address",
+      "answerType": "paragraph",
+      "answerSettings": {},
+      "questionId": "Mvajrv"
+    },
+    {
+      "question": "Phone",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "PjTnfM"
+    },
+    {
+      "question": "Allergies",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "UMfscG"
+    },
+    {
+      "question": "Current Meds ",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "Cc8lih"
+    },
+    {
+      "question": "Medications",
+      "answerType": "label",
+      "answerSettings": {},
+      "questionId": "0R7uhf"
+    },
+    {
+      "question": "Name",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "WXJScB"
+    },
+    {
+      "question": "Dosage Form",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "BxEwHQ"
+    },
+    {
+      "question": "Strength",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "q2nC6e"
+    },
+    {
+      "question": "Quantiy ",
+      "answerType": "number",
+      "answerSettings": {},
+      "questionId": "fz68UV"
+    },
+    {
+      "question": "Re-fills",
+      "answerType": "shortText",
+      "answerSettings": {},
+      "questionId": "9SdbyN"
+    },
+    {
+      "question": "Directions",
+      "answerType": "paragraph",
+      "answerSettings": {},
+      "questionId": "6FrcPv"
+    }
+  ]
+}

index.js

@@ -3,6 +3,7 @@
  */
 
 import {AppRegistry} from 'react-native';
+import 'text-encoding-polyfill';
 import App from './App';
 import {name as appName} from './app.json';
 

ios/PeerScribe.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

ios/Podfile

@@ -51,5 +51,15 @@ target 'PeerScribe' do
       config[:reactNativePath],
       :mac_catalyst_enabled => false
     )
+    installer.pods_project.targets.each do |target|
+      flutter_additional_ios_build_settings(target)
+      target.build_configurations.each do |config|
+        if target.respond_to?(:product_type) and target.product_type == "com.apple.product-type.bundle"
+          target.build_configurations.each do |config|
+              config.build_settings['CODE_SIGNING_ALLOWED'] = 'NO'
+          end
+        end
+      end
+    end
   end
 end

package.json

@@ -10,8 +10,14 @@
     "test": "jest"
   },
   "dependencies": {
+    "@ant-design/react-native": "^5.1.0",
+    "@formstr/sdk": "^0.0.4-alpha",
+    "@react-native-community/segmented-control": "^2.2.2",
+    "@react-native-community/slider": "^4.5.0",
+    "nostr-tools": "^2.3.1",
     "react": "18.2.0",
-    "react-native": "0.73.4"
+    "react-native": "0.73.4",
+    "text-encoding-polyfill": "^0.6.7"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",