up

theosanderson · Sep 16, 2023 · 32f638a · 32f638a
1 parent d580f5b
commit 32f638a
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 5 deletions.
diff --git a/taxonium_website/src/components/InputSupplier.jsx b/taxonium_website/src/components/InputSupplier.jsx
@@ -159,6 +159,7 @@ export const InputSupplier = ({ inputHelper, className }) => {
         </div>
       )}
       <div className="mb-3">
+
         Select, drag-and-drop, or enter the URL for tree or metadata files
         (jsonl, newick, nextstrain, tsv, etc.):
       </div>
@@ -208,19 +209,41 @@ export const InputSupplier = ({ inputHelper, className }) => {
           {
             addingText ? <>
             <div>
-              <textarea className="border p-1 mr-1 text-sm " rows="5" cols="25" 
+              <textarea className="border p-1 mr-1 text-sm md:w-1/2 w-full"
+              placeholder="Paste e.g. Newick tree here.."
               onChange={(e) => {
                 setText(e.target.value)
               }}
               value={text}
               />
+              <div className="mt-2">
+              <button className="background-gray-100 text-sm p-1 rounded border-gray-300 border  text-gray-700"
+              onClick={() => {
+                inputHelper.addFromText(text)
+                setAddingText(false)
+                setText("")
+              }}
+              >Add</button> <button
+              className="background-gray-100 text-sm p-1 rounded border-gray-300 border ml-3 text-gray-700"
+              onClick={() => {
+                setAddingText(false)
+                setText("")
+              }}
+              >Cancel</button>
 
-            </div></>  : <>
-            or you can use <button className="text-xs text-gray-800 hover:text-gray-700" 
+              </div>
+
+
+
+
+
+
+            </div></>  : <div className="text-sm">
+            ..or use <button className="text-gray-700 hover:text-gray-700 hover:underline" 
              onClick={() => {
               setAddingText(true)
-            }}>text entry</button>
-            </>
+            }}>text entry</button>.
+            </div>
           }
           </div>
 

diff --git a/taxonium_website/src/hooks/useInputHelper.jsx b/taxonium_website/src/hooks/useInputHelper.jsx
@@ -166,6 +166,13 @@ export const useInputHelper = ({
     addInput(file_obj);
   }
 
+  function addFromText(text){
+    const file_obj = { name: "text.nwk", supplyType: "file" };
+    file_obj.filetype = "nwk";
+    file_obj.data = text;
+    addInput(file_obj,text);
+  }
+
   const finaliseInputs = useCallback(() => {
     // if everything is a URL:
     if (inputs.every((input) => input.supplyType === "url")) {
@@ -283,8 +290,10 @@ export const useInputHelper = ({
     removeInput,
     addInput,
     addFromURL,
+    addFromText,
     finaliseInputs,
     validity,
     validityMessage,
+
   };
 };