Develop to main

package.json

@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@allmaps/iiif-parser": "^1.0.0-beta.33",
-    "@annotorious/react": "^3.0.0-rc.19",
+    "@annotorious/react": "^3.0.0-rc.22",
     "@astrojs/netlify": "^2.2.3",
     "@astrojs/node": "^5.3.3",
     "@astrojs/react": "^2.2.0",
@@ -34,8 +34,8 @@
     "@radix-ui/react-tooltip": "^1.0.7",
     "@react-spring/web": "^9.7.3",
     "@recogito/annotorious-supabase": "^1.0.0-rc.10",
-    "@recogito/react-pdf-annotator": "^1.0.0-rc.12",
-    "@recogito/react-text-annotator": "^3.0.0-rc.18",
+    "@recogito/react-pdf-annotator": "^1.0.0-rc.14",
+    "@recogito/react-text-annotator": "^3.0.0-rc.21",
     "@supabase/auth-helpers-shared": "^0.3.4",
     "@supabase/supabase-js": "^2.32.0",
     "@table-library/react-table-library": "^4.1.7",

src/apps/annotation-image/AnnotatedImage/AnnotatedImage.tsx

@@ -5,7 +5,7 @@ import { UndoStack } from '@components/AnnotationDesktop';
 import { createAppearenceProvider } from '@components/Presence';
 import type { PrivacyMode } from '@components/PrivacySelector';
 import { SupabasePlugin } from '@components/SupabasePlugin';
-import type { DocumentInTaggedContext, Layer, Policies, Translations } from 'src/Types';
+import type { Layer, Policies, Translations } from 'src/Types';
 import { Toolpanel } from '../Toolpanel';
 import { 
   AnnotoriousOpenSeadragonAnnotator, 

src/apps/annotation-text/AnnotatedText/AnnotatedText.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import type { DrawingStyle, PresentUser } from '@annotorious/react';
+import type { DrawingStyle, Filter, PresentUser } from '@annotorious/react';
 import { CETEIcean, TEIAnnotator, TextAnnotation, TextAnnotator, TextAnnotatorPopup } from '@recogito/react-text-annotator';
 import { Annotation } from '@components/Annotation';
 import { UndoStack } from '@components/AnnotationDesktop';
@@ -25,7 +25,7 @@ interface AnnotatedTextProps {
 
   document: DocumentInTaggedContext;
 
-  filter?: (a: TextAnnotation) => boolean;
+  filter?: Filter;
 
   i18n: Translations;
 
@@ -104,14 +104,12 @@ export const AnnotatedText = (props: AnnotatedTextProps) => {
             </>
           ) : contentType === 'application/pdf' && text ? (
             <PDFViewer
-              experimentalCSSRenderer
               document={props.document}
               filter={props.filter}
               style={props.style}
               onRendered={() => setPDFLoading(false)} />
           ) : text && (
             <TextAnnotator
-              experimentalCSSRenderer
               filter={props.filter}
               style={props.style}
               presence={{

src/apps/annotation-text/RightDrawer/RightDrawer.tsx

@@ -1,5 +1,6 @@
 import { useEffect, useRef } from 'react';
 import { useTransition, animated } from '@react-spring/web';
+import type { PDFAnnotation } from '@recogito/react-pdf-annotator';
 import type { Annotation, DrawingStyle, PresentUser } from '@annotorious/react';
 import { isMe } from '@recogito/annotorious-supabase';
 import { AnnotationList, DocumentNotesList, LayerConfigurationPanel, DrawerPanel } from '@components/AnnotationDesktop';
@@ -17,7 +18,7 @@ interface RightDrawerProps {
 
   policies?: Policies;
 
-  sorting?: ((a: Annotation, b: Annotation) => number);
+  sorting?: ((a: PDFAnnotation, b: PDFAnnotation) => number);
 
   layers?: Layer[];
 

src/apps/annotation-text/TextAnnotationDesktop.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 import { useAnnotator } from '@annotorious/react';
-import type { PresentUser, DrawingStyle } from '@annotorious/react';
+import type { PresentUser, DrawingStyle, Filter } from '@annotorious/react';
 import type { RecogitoTextAnnotator, TextAnnotation } from '@recogito/react-text-annotator';
 import type { PDFAnnotation } from '@recogito/react-pdf-annotator';
 import { supabase } from '@backend/supabaseBrowserClient';
@@ -38,7 +38,7 @@ export const TextAnnotationDesktop = (props: TextAnnotationProps) => {
 
   const [style, setStyle] = useState<((a: TextAnnotation) => DrawingStyle) | undefined>(undefined);
 
-  const [filter, setFilter] = useState<((a: TextAnnotation) => boolean) | undefined>(undefined);
+  const [filter, setFilter] = useState<Filter | undefined>(undefined);
 
   const [usePopup, setUsePopup] = useState(true);
 
@@ -77,15 +77,6 @@ export const TextAnnotationDesktop = (props: TextAnnotationProps) => {
   // max number of avatars displayed in the top right
   const limit = 5;
 
-  const onChangeViewMenuPanel = (panel: DrawerPanel | undefined) => {
-    if (panel === DrawerPanel.ANNOTATIONS) {
-      // Don't use the popup if the annotation list is open
-      setUsePopup(false);
-    } else {
-      if (!usePopup) setUsePopup(true);
-    }
-  };
-
   const onSetRightPanel = (panel?: DrawerPanel) => {
     if (panel === DrawerPanel.ANNOTATIONS)
       setUsePopup(false); // Don't use the popup if annotation list is open

src/components/AnnotationDesktop/AnnotationList/AnnotationList.tsx

@@ -20,7 +20,7 @@ import {
 
 import './AnnotationList.css';
 
-interface AnnotationListProps {
+interface AnnotationListProps<T extends Anno> {
 
   i18n: Translations;
 
@@ -30,15 +30,15 @@ interface AnnotationListProps {
 
   policies?: Policies;
 
-  sorting?: ((a: Anno, b: Anno) => number);
+  sorting?: ((a: T, b: T) => number);
 
   tagVocabulary?: string[];
 
   beforeSelect(a: SupabaseAnnotation | undefined): void;
 
 }
 
-export const AnnotationList = (props: AnnotationListProps) => {
+export const AnnotationList = <T extends Anno>(props: AnnotationListProps<T>) => {
 
   const el = useRef<HTMLUListElement>(null);
 
@@ -66,6 +66,7 @@ export const AnnotationList = (props: AnnotationListProps) => {
 
   const sorted = useMemo(() => {
     const filtered = filter ? annotations.filter(filter) : annotations;
+    // @ts-ignore
     return props.sorting ? [...filtered].sort(props.sorting) : filtered;
   }, [annotations, filter]);
 

src/components/DocumentLibrary/DocumentLibrary.tsx

@@ -158,7 +158,7 @@ export const DocumentLibrary = (props: DocumentLibraryProps) => {
     getTheme(),
     {
       Table: `
-        --data-table-library_grid-template-columns:  50px 450px repeat(3, minmax(0, 1fr)) 60px !important;
+        --data-table-library_grid-template-columns:  50px 350px 200px repeat(3, minmax(0, 1fr)) 60px !important;
       `,
       HeaderRow: `
         font-size: 13px;
@@ -386,6 +386,14 @@ export const DocumentLibrary = (props: DocumentLibraryProps) => {
       pinLeft: true,
       sort: { sortKey: 'TITLE' },
     },
+    {
+      label: t['Author'],
+      renderCell: (item) => item.meta_data.meta?.author ? item.meta_data.meta?.author : '',
+      select: true,
+      pinLeft: true,
+      sort: { sortKey: 'AUTHOR' },
+    },
+
     {
       label: t['Document Type'],
       renderCell: (item) => item.content_type,
@@ -547,6 +555,7 @@ export const DocumentLibrary = (props: DocumentLibraryProps) => {
     {
       sortFns: {
         TITLE: (array) => array.sort((a, b) => a.name.localeCompare(b.name)),
+        AUTHOR: (array) => array.sort((a, b) => a.meta_data.meta?.author.localeCompare(b.meta_data.meta?.author)),
         TYPE: (array) =>
           array.sort((a, b) =>
             (a.content_type || '').localeCompare(b.content_type || '')

src/pages/[lang]/annotate/[context]/[document]/index.astro

@@ -36,7 +36,6 @@ if (document.error || !document.data) {
     );
   }
 
-  console.log('Error!');
   // https://javascript.plainenglish.io/return-custom-404-responses-in-astro-b844b0e0146d
   const error = await fetch(`${Astro.url}/404`);
   return new Response(error.body, {