ove-auto-annotate 0.0.4 → 0.0.8

package/src/index.js

@@ -11,6 +11,7 @@ import {
   validateCSVRow
 } from "./fileUtils";
 import downloadjs from "downloadjs";
+import { convertProteinSeqToDNAIupac } from "ve-sequence-utils";
 
 const {
   shortid,
@@ -21,8 +22,8 @@ const {
   pluralize,
   reduxForm,
   SubmissionError,
-  featureColors,
-  FeatureTypes,
+  getFeatureToColorMap,
+  getFeatureTypes,
   InfoHelper,
   showConfirmationDialog,
   wrapDialog,
@@ -68,6 +69,7 @@ export function autoAnnotatePrimers() {
 
 export const AutoAnnotateModal = compose(
   wrapDialog((p) => ({
+    canEscapeKeyClose: false,
     title: `Auto Annotate ${startCase(pluralize(p.annotationType))}`
   })),
   withEditorProps,
@@ -99,7 +101,8 @@ export const AutoAnnotateModal = compose(
         }
       }
     })();
-  }, [getCustomAutoAnnotateList, props]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   if (newAnnotations) {
     return (
       <CreateAnnotationsPage
@@ -119,41 +122,7 @@ export const AutoAnnotateModal = compose(
           panel={
             <div>
               <div>
-                Select a CSV file with the following columns -<br></br>
-                <br></br>
-                <div style={{ display: "flex" }}>
-                  name,description,sequence,type,
-                  <span style={{ display: "flex" }}>
-                    isRegex &nbsp;
-                    <InfoHelper
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        e.preventDefault();
-                        showDialog({
-                          ModalComponent: AutoAnnotateBpMatchingDialog
-                        });
-                      }}
-                      content={
-                        true ? (
-                          <span>
-                            Any valid regexes allowed. Click for more info about
-                            regex matching
-                          </span>
-                        ) : (
-                          `All valid IUPAC bases allowed as well as a couple special characters. Click for more info`
-                        )
-                      }
-                    ></InfoHelper>
-                  </span>
-                </div>
-                <br></br>
-                {annotationType !== "feature" && (
-                  <React.Fragment>
-                    <i>Note: the "type" column is optional</i>
-                    <br></br>
-                  </React.Fragment>
-                )}
-                <br></br>
+                Select a CSV file (
                 <a
                   onClick={() => {
                     const rows = [
@@ -164,7 +133,18 @@ export const AutoAnnotateModal = compose(
                         ...(annotationType === "feature" && {
                           type: `cds`
                         }),
-                        isRegex: false
+                        isRegex: false,
+                        matchType: "dna"
+                      },
+                      {
+                        name: `Example Protein ${startCase(annotationType)}`,
+                        description: "I'm a description",
+                        sequence: `APGSGTGGGSGSAPG`,
+                        ...(annotationType === "feature" && {
+                          type: `cds`
+                        }),
+                        isRegex: false,
+                        matchType: "protein"
                       },
                       {
                         name: `Example ${startCase(annotationType)} 2`,
@@ -173,7 +153,8 @@ export const AutoAnnotateModal = compose(
                         ...(annotationType === "feature" && {
                           type: `cds`
                         }),
-                        isRegex: true
+                        isRegex: true,
+                        matchType: "dna"
                       }
                     ];
                     const csv = unparse(rows);
@@ -189,8 +170,44 @@ export const AutoAnnotateModal = compose(
                 >
                   download example
                 </a>
+                ) with the following columns:<br></br>
+                <br></br>
+                <div style={{ display: "flex" }}>
+                  name,description,sequence,type,
+                  <span style={{ display: "flex" }}>
+                    isRegex &nbsp;
+                    <InfoHelper
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        e.preventDefault();
+                        showDialog({
+                          ModalComponent: AutoAnnotateBpMatchingDialog
+                        });
+                      }}
+                      content={
+                        true ? (
+                          <span>
+                            Any valid regexes allowed. Click for more info about
+                            regex matching
+                          </span>
+                        ) : (
+                          `All valid IUPAC bases allowed as well as a couple special characters. Click for more info`
+                        )
+                      }
+                    ></InfoHelper>
+                  </span>
+                  ,matchType
+                </div>
+                <br></br>
+                {annotationType !== "feature" && (
+                  <React.Fragment>
+                    <i>Note: the "type" column is optional</i>
+                    <br></br>
+                  </React.Fragment>
+                )}
               </div>
               <FileUploadField
+                validateAgainstSchema={validateAgainstSchema}
                 name="csvFile"
                 fileLimit={1}
                 isRequired
@@ -239,16 +256,12 @@ FRT	GAAGTTCCTATTCTCTAGAAAGTATAGGAACTTC	misc_recomb	orchid	pink	0	0`,
           (loadingCustomAnnList ? (
             <Tab disabled title="Loading..."></Tab>
           ) : (
-            customAnnResponse && (
+            customAnnResponse &&
+            customAnnResponse.list && (
               <Tab
                 id="implementerDefined"
-                title={
-                  (customAnnResponse && customAnnResponse.title) ||
-                  "Custom List"
-                }
+                title={customAnnResponse.title || "Custom List"}
                 panel={
-                  customAnnResponse &&
-                  customAnnResponse.list &&
                   customAnnResponse.list.length ? (
                     <div>
                       <DataTable
@@ -288,7 +301,7 @@ FRT	GAAGTTCCTATTCTCTAGAAAGTATAGGAACTTC	misc_recomb	orchid	pink	0	0`,
               let regexConvertedSeq;
 
               if (annotationType === "feature") {
-                const cleanedType = FeatureTypes.find(
+                const cleanedType = getFeatureTypes().find(
                   (t) => t.toLowerCase() === type.toLowerCase()
                 );
                 if (!cleanedType) {
@@ -332,10 +345,16 @@ FRT	GAAGTTCCTATTCTCTAGAAAGTATAGGAACTTC	misc_recomb	orchid	pink	0	0`,
                 // eslint-disable-next-line no-unused-vars
                 i,
                 // eslint-disable-next-line no-unused-vars
-                { name, sequence, type, isRegex }
+                { name, sequence, matchType, type, isRegex }
               ] of customAnnResponse.list.entries()) {
                 await validateRow(
-                  { name, sequence, type, isRegex: isRegex ? "TRUE" : "FALSE" },
+                  {
+                    name,
+                    sequence,
+                    matchType,
+                    type,
+                    isRegex: isRegex ? "TRUE" : "FALSE"
+                  },
                   `Row ${i + 1} (${name})`
                 );
               }
@@ -389,6 +408,9 @@ FRT	GAAGTTCCTATTCTCTAGAAAGTATAGGAACTTC	misc_recomb	orchid	pink	0	0`,
             }
             const annotationsToCheckById = {};
             annsToCheck.forEach((ann) => {
+              if (ann.matchType === "protein") {
+                ann.sequence = convertProteinSeqToDNAIupac(ann.sequence);
+              }
               const id = shortid();
               annotationsToCheckById[id] = {
                 ...ann,
@@ -416,7 +438,8 @@ FRT	GAAGTTCCTATTCTCTAGAAAGTATAGGAACTTC	misc_recomb	orchid	pink	0	0`,
                     forward: a.strand !== -1,
                     id: shortid()
                   };
-                  toRet.color = toRet.color || featureColors[toRet.type];
+                  toRet.color =
+                    toRet.color || getFeatureToColorMap()[toRet.type];
                   return toRet;
                 })
               );
@@ -449,3 +472,38 @@ window._ove_addons.autoAnnotatePrimers = autoAnnotatePrimers;
 
 const customAnnsSchema = ["name", "sequence", typeField, "isRegex"];
 const customAnnsSchemaNoType = ["name", "sequence", typeField, "isRegex"];
+
+const validateAgainstSchema = {
+  fields: [
+    {
+      path: "name",
+      type: "string",
+      isRequired: true
+    },
+    {
+      path: "description",
+      type: "string"
+    },
+    {
+      path: "sequence",
+      type: "string",
+      isRequired: true
+    },
+    {
+      path: "type",
+      type: "dropdown",
+      values: getFeatureTypes(),
+      defaultValue: "misc_feature"
+    },
+    {
+      path: "isRegex",
+      type: "boolean"
+    },
+    {
+      path: "matchType",
+      type: "dropdown",
+      defaultValue: "dna",
+      values: ["dna", "protein"]
+    }
+  ]
+};