From 8cb7b290a61b3cbc3dfc44b721ec4a7ae11f4300 Mon Sep 17 00:00:00 2001
From: atuonufure <atuonufure@gmail.com>
Date: Sat, 16 Dec 2023 18:47:56 +0100
Subject: [PATCH] Add PDF to questionnaire converter

---
 .../QuestionnaireBuilder/PromptForm.tsx       | 10 +++-
 .../QuestionnaireBuilder.module.scss          |  5 ++
 .../QuestionnaireFromPdfButton/index.tsx      | 55 +++++++++++++++++++
 3 files changed, 67 insertions(+), 3 deletions(-)
 create mode 100644 src/containers/QuestionnaireBuilder/QuestionnaireFromPdfButton/index.tsx

diff --git a/src/containers/QuestionnaireBuilder/PromptForm.tsx b/src/containers/QuestionnaireBuilder/PromptForm.tsx
index d9ca4399..d4347242 100644
--- a/src/containers/QuestionnaireBuilder/PromptForm.tsx
+++ b/src/containers/QuestionnaireBuilder/PromptForm.tsx
@@ -4,6 +4,7 @@ import { Button, Form, Input, Timeline } from 'antd';
 import { FormProps } from 'antd/lib/form';
 
 import s from './QuestionnaireBuilder.module.scss';
+import { QuestionnaireFromPdfButton } from './QuestionnaireFromPdfButton';
 
 const { TextArea } = Input;
 
@@ -72,9 +73,12 @@ export function PromptForm(props: Props) {
             <Form.Item name="prompt" label={t`Describe requirements to a questionnaire`}>
                 <TextArea rows={5} disabled={disabled} />
             </Form.Item>
-            <Form.Item>
-                <Button htmlType="submit" disabled={disabled}>{t`Submit`}</Button>
-            </Form.Item>
+            <div className={s.submitButtons}>
+                <Form.Item>
+                    <Button htmlType="submit" disabled={disabled}>{t`Submit`}</Button>
+                </Form.Item>
+                <QuestionnaireFromPdfButton onSubmit={onSubmit} disabled={disabled} />
+            </div>
             <div className={s.prompts}>
                 <Timeline items={items} />
             </div>
diff --git a/src/containers/QuestionnaireBuilder/QuestionnaireBuilder.module.scss b/src/containers/QuestionnaireBuilder/QuestionnaireBuilder.module.scss
index 752c7f4a..940706ef 100644
--- a/src/containers/QuestionnaireBuilder/QuestionnaireBuilder.module.scss
+++ b/src/containers/QuestionnaireBuilder/QuestionnaireBuilder.module.scss
@@ -39,3 +39,8 @@
     display: flex;
     flex-direction: column;
 }
+
+.submitButtons {
+    display: flex;
+    justify-content: space-between;
+}
diff --git a/src/containers/QuestionnaireBuilder/QuestionnaireFromPdfButton/index.tsx b/src/containers/QuestionnaireBuilder/QuestionnaireFromPdfButton/index.tsx
new file mode 100644
index 00000000..b8fedfc9
--- /dev/null
+++ b/src/containers/QuestionnaireBuilder/QuestionnaireFromPdfButton/index.tsx
@@ -0,0 +1,55 @@
+import { t } from '@lingui/macro';
+import { Button } from 'antd';
+import axios from 'axios';
+import { useRef } from 'react';
+
+interface Props {
+    onSubmit: (prompt: string) => Promise<any>;
+    disabled?: boolean;
+}
+
+const context = `Questions might be type choice if answers are provided or text if no provided answers.
+Keep original question numeration if possible in the text attribute.
+Create from pdf: 
+{PDF_TEXT}`;
+
+export function QuestionnaireFromPdfButton({ onSubmit, disabled }: Props) {
+    const fileInputRef = useRef<HTMLInputElement>(null);
+
+    const uploadPdf = async () => {
+        if (fileInputRef.current?.files && fileInputRef.current.files[0]) {
+            console.log('Uploading Questionnaire');
+
+            const file = fileInputRef.current.files[0];
+            const url = 'http://localhost:8081/';
+
+            const formData = new FormData();
+            formData.append('file', file);
+
+            try {
+                const response = await axios.post(url, formData, {
+                    headers: {
+                        'Content-Type': 'multipart/form-data',
+                    },
+                });
+
+                await onSubmit(context + response.data);
+            } catch (error) {
+                console.error(error);
+            }
+        } else {
+            console.log('Please select a file');
+        }
+    };
+
+    const handleButtonClick = () => {
+        fileInputRef.current?.click();
+    };
+
+    return (
+        <div>
+            <input type="file" ref={fileInputRef} style={{ display: 'none' }} accept=".pdf" onChange={uploadPdf} />
+            <Button onClick={handleButtonClick} disabled={disabled}>{t`Upload PDF`}</Button>
+        </div>
+    );
+}