Link document importer from edit form page.

apps/spotlight/src/components/react/experiments/interview-form.tsx

@@ -5,8 +5,8 @@ import {
   createInterviewContext,
   nextContext,
 } from '@atj/interviews';
-import { Field } from '@atj/interviews/src/prompt';
-import { BooleanFact, TextFact } from '@atj/interviews/src/fact';
+import { Field } from '@atj/interviews';
+import { BooleanFact, TextFact } from '@atj/interviews';
 
 const form = {
   action: 'https://yaawr84uu7.execute-api.us-east-2.amazonaws.com',

apps/spotlight/src/components/react/form-builder/document-importer.tsx

@@ -1,11 +1,10 @@
 import React, { PropsWithChildren, useReducer } from 'react';
 
 import { extractFormFieldData, suggestFormDetails } from '@atj/documents';
-import { SuggestedForm, UD105_TEST_DATA } from '@atj/documents/src/suggestions';
+import { SuggestedForm, UD105_TEST_DATA } from '@atj/documents';
 
 import { onFileInputChangeGetFile } from '../../../lib/file-input';
 import { FormView } from '../form/view';
-import { EditFieldset } from '../form/edit';
 
 type State = { page: number; suggestedForm?: SuggestedForm };
 type Action =
@@ -145,7 +144,7 @@ export const DocumentImporter = () => {
           });
         }}
       >
-        <EditFieldset fields={state.suggestedForm as SuggestedForm} />
+        {/*<EditFieldset fields={state.suggestedForm as SuggestedForm} />*/}
         <ButtonBar />
       </form>
     );

apps/spotlight/src/components/react/form/edit.tsx

@@ -2,13 +2,7 @@ import React from 'react';
 import { useForm } from 'react-hook-form';
 import { Link } from 'react-router-dom';
 
-import {
-  Form,
-  Question,
-  addQuestions,
-  createForm,
-  getFlatFieldList,
-} from '@atj/forms';
+import { Form, addQuestions, createForm, getFlatFieldList } from '@atj/forms';
 import { getFormFromStorage, saveFormToStorage } from '../../../lib/form-repo';
 
 export const FormEdit = ({ formId }: { formId: string }) => {
@@ -48,7 +42,10 @@ export const FormEdit = ({ formId }: { formId: string }) => {
           </button>
         </li>
         <li>
-          <Link to={`/${formId}`}>View form</Link>
+          <Link to={`/${formId}`}>Preview this form</Link>
+        </li>
+        <li>
+          <Link to={`/${formId}/import-document`}>Import document</Link>
         </li>
         <li>
           <Link to="/">View all forms</Link>

apps/spotlight/src/components/react/form/import-document.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { getFormFromStorage } from '../../../lib/form-repo';
+import { createFormContext, createPrompt } from '@atj/forms';
+import { DocumentImporter } from '../form-builder/document-importer';
+
+export const FormDocumentImport = ({ formId }: { formId: string }) => {
+  // Fallback to hardcoded data if a magic ID is chosen.
+  const form = getFormFromStorage(window.localStorage, formId);
+  if (!form) {
+    return 'null form retrieved from storage';
+  }
+  const context = createFormContext(form);
+  const prompt = createPrompt(context);
+
+  return <DocumentImporter />;
+};

apps/spotlight/src/components/react/form/index.tsx

@@ -5,6 +5,7 @@ import { FormDelete } from './delete';
 import { FormEdit } from './edit';
 import { FormList } from './list';
 import { FormViewById } from './view';
+import { FormDocumentImport } from './import-document';
 
 export const FormSection = () => {
   return (
@@ -41,6 +42,16 @@ export const FormSection = () => {
             return <FormDelete formId={formId} />;
           }}
         />
+        <Route
+          path="/:formId/import-document"
+          Component={() => {
+            const { formId } = useParams();
+            if (formId === undefined) {
+              return <div>formId is undefined</div>;
+            }
+            return <FormDocumentImport formId={formId} />;
+          }}
+        />
       </Routes>
     </HashRouter>
   );

packages/documents/src/index.ts

@@ -1,2 +1,2 @@
 export * from './pdf';
-export { suggestFormDetails } from './suggestions';
+export * from './suggestions';

packages/interviews/src/index.ts

@@ -1,5 +1,7 @@
+export * from './fact';
 export { type Interview } from './interview';
 export { createInterviewContext, nextContext } from './interview-context';
+export * from './prompt';
 export {
   createSequentialInterview,
   type SequentialInterview,