Jump to annotation working for BOTH span-based and token-based annota…

…tions.
JSv4 · Oct 7, 2024 · c882fe9 · c882fe9
1 parent 63730f5
commit c882fe9
Show file tree

Hide file tree

Showing 8 changed files with 71 additions and 13 deletions.
diff --git a/frontend/src/components/annotations/AnnotationCards.tsx b/frontend/src/components/annotations/AnnotationCards.tsx
@@ -224,6 +224,12 @@ export const AnnotationCards: React.FC<AnnotationCardProps> = ({
         label: "Extract",
         color: "#2196F3",
       };
+    } else if (!item.analysis) {
+      return {
+        icon: <User size={14} />,
+        label: "Manually-Annotated",
+        color: "#4CAF50",
+      };
     } else {
       return {
         icon: <BotIcon size={14} />,

diff --git a/frontend/src/components/annotations/CorpusAnnotationCards.tsx b/frontend/src/components/annotations/CorpusAnnotationCards.tsx
@@ -14,6 +14,7 @@ import {
   filterToLabelId,
   selectedAnalyses,
   showCorpusActionOutputs,
+  filterToAnnotationType,
 } from "../../graphql/cache";
 
 import {
@@ -40,7 +41,7 @@ export const CorpusAnnotationCards = ({
   const filter_to_label_id = useReactiveVar(filterToLabelId);
   const selected_analyses = useReactiveVar(selectedAnalyses);
   const show_action_annotations = useReactiveVar(showCorpusActionOutputs);
-
+  const filter_to_annotation_type = useReactiveVar(filterToAnnotationType);
   const location = useLocation();
 
   ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
@@ -58,12 +59,15 @@ export const CorpusAnnotationCards = ({
     data: annotation_response,
     fetchMore: fetchMoreAnnotations,
   } = useQuery<GetAnnotationsOutputs, GetAnnotationsInputs>(GET_ANNOTATIONS, {
+    fetchPolicy: "network-only",
     notifyOnNetworkStatusChange: true, // necessary in order to trigger loading signal on fetchMore
     variables: {
-      annotationLabel_Type: "TOKEN_LABEL",
       createdByAnalysisIds: selected_analysis_id_string,
       analysis_Isnull: !show_action_annotations,
       ...(opened_corpus_id ? { corpusId: opened_corpus_id } : {}),
+      ...(filter_to_annotation_type
+        ? { annotationLabel_Type: filter_to_annotation_type }
+        : {}),
       ...(filter_to_label_id ? { annotationLabelId: filter_to_label_id } : {}),
       ...(filter_to_labelset_id
         ? { usesLabelFromLabelsetId: filter_to_labelset_id }
@@ -156,8 +160,11 @@ export const CorpusAnnotationCards = ({
       items={annotation_items}
       loading={annotation_loading}
       loading_message="Annotations Loading..."
-      pageInfo={undefined}
-      //pageInfo={annotation_response?.annotations?.pageInfo ? annotation_response.annotations.pageInfo : undefined}
+      pageInfo={
+        annotation_response?.annotations?.pageInfo
+          ? annotation_response.annotations.pageInfo
+          : undefined
+      }
       style={{ minHeight: "70vh", overflowY: "unset" }}
       fetchMore={handleFetchMoreAnnotations}
     />

diff --git a/frontend/src/components/annotator/DocumentAnnotator.tsx b/frontend/src/components/annotator/DocumentAnnotator.tsx
@@ -436,6 +436,11 @@ export const DocumentAnnotator = ({
   // Effect to load document and pawls layer
   useEffect(() => {
     if (open && opened_document) {
+      console.log(
+        "React to DocumentAnnotator opening or document change",
+        opened_document
+      );
+
       viewStateVar(ViewState.LOADING);
       fetchDocumentAnalysesAndExtracts();
 
@@ -517,13 +522,15 @@ export const DocumentAnnotator = ({
               ...pageTextMaps,
             });
             setRawText(doc_text);
-            viewStateVar(ViewState.LOADED);
+            // Loaded state set by useEffect for state change in doc state store.
           })
           .catch((err) => {
             console.error("Error loading PDF document:", err);
             viewStateVar(ViewState.ERROR);
           });
       } else if (opened_document.fileType === "application/txt") {
+        console.log("React to TXT document");
+
         Promise.all([
           getDocumentRawText(opened_document.txtExtractFile || ""),
           loadAnnotations(),
@@ -614,6 +621,7 @@ export const DocumentAnnotator = ({
   useEffect(() => {
     if (opened_document.fileType === "application/pdf") {
       if (doc && pageTextMaps && pages.length > 0) {
+        console.log("React to PDF document loading properly", doc);
         viewStateVar(ViewState.LOADED);
       }
     }
@@ -635,6 +643,10 @@ export const DocumentAnnotator = ({
 
   // If we got a property of annotations to display (and ONLY those), do some post processing and update state variable(s) accordingly
   useEffect(() => {
+    console.log(
+      "React to displayOnlyTheseAnnotations",
+      displayOnlyTheseAnnotations
+    );
     if (displayOnlyTheseAnnotations) {
       setAnnotationObjs(
         convertToServerAnnotations(displayOnlyTheseAnnotations)
@@ -870,7 +882,12 @@ export const DocumentAnnotator = ({
           human_span_labels={human_span_labels}
           relationship_labels={relation_labels}
           document_labels={doc_type_labels}
-          annotation_objs={annotation_objs}
+          annotation_objs={[
+            ...annotation_objs,
+            ...(scrollToAnnotation
+              ? [convertToServerAnnotation(scrollToAnnotation)]
+              : []),
+          ]}
           doc_type_annotations={doc_type_annotations}
           relationship_annotations={relationship_annotations}
           data_cells={data_cells}
@@ -928,7 +945,10 @@ export const DocumentAnnotator = ({
       className="AnnotatorModal"
       closeIcon
       open={open}
-      onClose={onClose}
+      onClose={() => {
+        onClose();
+        setDocument(undefined);
+      }}
       size="fullscreen"
     >
       <Modal.Content

diff --git a/frontend/src/components/annotator/display/components/AnnotatorRenderer.tsx b/frontend/src/components/annotator/display/components/AnnotatorRenderer.tsx
@@ -102,8 +102,8 @@ interface AnnotatorRendererProps {
   onSelectExtract?: (extract: ExtractType | null) => undefined | null | void;
   read_only: boolean;
   load_progress: number;
-  scrollToAnnotation?: ServerTokenAnnotation;
-  selectedAnnotation?: ServerTokenAnnotation[];
+  scrollToAnnotation?: ServerTokenAnnotation | ServerSpanAnnotation;
+  selectedAnnotation?: (ServerTokenAnnotation | ServerSpanAnnotation)[];
   show_selected_annotation_only: boolean;
   show_annotation_bounding_boxes: boolean;
   show_structural_annotations: boolean;
@@ -112,7 +112,7 @@ interface AnnotatorRendererProps {
   human_span_labels: AnnotationLabelType[];
   relationship_labels: AnnotationLabelType[];
   document_labels: AnnotationLabelType[];
-  annotation_objs: ServerTokenAnnotation[];
+  annotation_objs: (ServerTokenAnnotation | ServerSpanAnnotation)[];
   doc_type_annotations: DocTypeAnnotation[];
   relationship_annotations: RelationGroup[];
   data_cells?: DatacellType[];

diff --git a/frontend/src/components/annotator/display/viewer/DocumentViewer.tsx b/frontend/src/components/annotator/display/viewer/DocumentViewer.tsx
@@ -701,6 +701,14 @@ export const DocumentViewer = ({
     "DocumentViewer adapting to filetype: ",
     selected_document.fileType
   );
+
+  if (
+    !selected_document ||
+    (selected_document.fileType === "application/pdf" && !doc)
+  ) {
+    view_components = <></>;
+  }
+
   switch (selected_document.fileType) {
     case "application/pdf":
       view_components = (
@@ -761,6 +769,7 @@ export const DocumentViewer = ({
 
   return (
     <PDFStore.Provider
+      key={selected_document.id}
       value={{
         doc,
         pages,
@@ -900,7 +909,6 @@ export const DocumentViewer = ({
             />
           </SidebarContainer>
           <div className="PDFViewTopBarWrapper">
-            {/**TODO - swap out these components based on file type */}
             <AnnotatorTopbar
               opened_corpus={selected_corpus}
               opened_document={selected_document}

diff --git a/frontend/src/components/annotator/renderers/pdf/PDF.tsx b/frontend/src/components/annotator/renderers/pdf/PDF.tsx
@@ -81,10 +81,15 @@ export const PDF = ({
   const pdfStore = useContext(PDFStore);
 
   if (!pdfStore.doc) {
-    throw new Error("No Document");
+    // Instead of throwing an error, render nothing or a fallback UI
+    console.warn("PDF component rendered without a valid document.");
+    return null; // Or return a fallback UI
   }
+
   if (!pdfStore.pages) {
-    throw new Error("Document without Pages");
+    // Similarly, handle missing pages gracefully
+    console.warn("PDF component rendered without pages.");
+    return <div>No pages available.</div>;
   }
 
   return (

diff --git a/frontend/src/graphql/cache.ts b/frontend/src/graphql/cache.ts
@@ -18,6 +18,7 @@ import {
   FieldsetType,
   ColumnType,
   CorpusQueryType,
+  LabelType,
 } from "./types";
 import { ViewState } from "../components/types";
 
@@ -234,6 +235,7 @@ export const selectedLabelsetIds = makeVar<string[]>([]);
 /**
  * Annotation-related global variables
  */
+export const filterToAnnotationType = makeVar<LabelType | null>(null);
 export const filterToLabelId = makeVar<string>("");
 export const filterToAnnotationLabelId = makeVar<string>(""); // Not used elsewhere. Maybe should be?
 export const selectedAnnotation = makeVar<ServerAnnotationType | null>(null);

diff --git a/frontend/src/graphql/queries.ts b/frontend/src/graphql/queries.ts
@@ -647,6 +647,7 @@ export const GET_ANNOTATIONS = gql`
             pdfFile
             pawlsParseFile
             icon
+            fileType
             __typename
           }
           analysis {
@@ -663,8 +664,10 @@ export const GET_ANNOTATIONS = gql`
             color
             icon
             description
+            labelType
             __typename
           }
+          annotationType
           structural
           rawText
           isPublic
@@ -943,7 +946,9 @@ export const REQUEST_PAGE_ANNOTATION_DATA = gql`
           color
           icon
           description
+          labelType
         }
+        annotationType
         boundingBox
         page
         rawText
@@ -1203,6 +1208,7 @@ export const REQUEST_GET_EXTRACT = gql`
             text
             color
             icon
+            labelType
             description
           }
           document {
@@ -1215,6 +1221,7 @@ export const REQUEST_GET_EXTRACT = gql`
           rawText
           tokensJsons
           json
+          annotationType
           sourceNodeInRelationships {
             edges {
               node {
@@ -1508,6 +1515,7 @@ export const GET_DATACELLS_FOR_EXTRACT = gql`
             text
             color
             icon
+            labelType
             description
           }
           boundingBox
@@ -1557,6 +1565,7 @@ export const GET_ANNOTATIONS_FOR_ANALYSIS = gql`
           description
           labelType
         }
+        annotationType
         boundingBox
         page
         rawText
@@ -1642,6 +1651,7 @@ export const GET_DOCUMENT_ANNOTATIONS_AND_RELATIONSHIPS = gql`
           color
           icon
           description
+          labelType
         }
         userFeedback {
           edges {