Improve typechecking (components)

- annotation-share-info
- annotation-viewer-content
- annotation.js

src/sidebar/components/annotation-share-info.js

@@ -7,12 +7,20 @@ import { isPrivate } from '../util/permissions';
 import SvgIcon from '../../shared/components/svg-icon';
 
 /**
+ * @typedef {import("../../types/api").Annotation} Annotation
  * @typedef {import('../../types/api').Group} Group
  */
 
+/**
+ * @typedef AnnotationShareInfoProps
+ * @prop {Annotation} annotation
+ */
+
 /**
  * Render information about what group an annotation is in and
  * whether it is private to the current user (only me)
+ *
+ * @param {AnnotationShareInfoProps} props
  */
 function AnnotationShareInfo({ annotation }) {
   const group = useStore(store => store.getGroup(annotation.group));
@@ -52,7 +60,6 @@ function AnnotationShareInfo({ annotation }) {
 }
 
 AnnotationShareInfo.propTypes = {
-  /** The current annotation object for which sharing info will be rendered */
   annotation: propTypes.object.isRequired,
 };
 

src/sidebar/components/annotation-viewer-content.js

@@ -9,8 +9,16 @@ import useRootThread from './hooks/use-root-thread';
 import ThreadList from './thread-list';
 import SidebarContentError from './sidebar-content-error';
 
+/**
+ * @typedef AnnotationViewerContentProps
+ * @prop {() => any} onLogin
+ * @prop {Object} [loadAnnotationsService] - Injected service
+ */
+
 /**
  * The main content for the single annotation page (aka. https://hypothes.is/a/<annotation ID>)
+ *
+ * @param {AnnotationViewerContentProps} props
  */
 function AnnotationViewerContent({ loadAnnotationsService, onLogin }) {
   const annotationId = useStore(store => store.routeParams().id);
@@ -92,8 +100,6 @@ function AnnotationViewerContent({ loadAnnotationsService, onLogin }) {
 
 AnnotationViewerContent.propTypes = {
   onLogin: propTypes.func.isRequired,
-
-  // Injected.
   loadAnnotationsService: propTypes.object,
 };
 

src/sidebar/components/annotation.js

@@ -16,8 +16,25 @@ import AnnotationPublishControl from './annotation-publish-control';
 import AnnotationQuote from './annotation-quote';
 import Button from './button';
 
+/**
+ * @typedef {import("../../types/api").Annotation} Annotation
+ * @typedef {import('../../types/api').Group} Group
+ */
+
+/**
+ * @typedef AnnotationProps
+ * @prop {Annotation} annotation
+ * @prop {number} replyCount - Number of replies to this annotation (thread)
+ * @prop {boolean} showDocumentInfo - Should extended document info be rendered (e.g. in non-sidebar contexts)?
+ * @prop {boolean} threadIsCollapsed - Is the thread to which this annotation belongs currently collapsed?
+ * @prop {Object} annotationsService - Injected service
+ * @prop {Object} toastMessenger - Injected service
+ */
+
 /**
  * A single annotation.
+ *
+ * @param {AnnotationProps} props
  */
 function Annotation({
   annotation,
@@ -162,15 +179,9 @@ function Annotation({
 
 Annotation.propTypes = {
   annotation: propTypes.object.isRequired,
-
-  /** Number of replies to this annotation (thread) */
   replyCount: propTypes.number.isRequired,
-  /** Should extended document info be rendered (e.g. in non-sidebar contexts)? */
   showDocumentInfo: propTypes.bool.isRequired,
-  /** Is the thread to which this annotation belongs currently collapsed? */
   threadIsCollapsed: propTypes.bool.isRequired,
-
-  /* Injected services */
   annotationsService: propTypes.object.isRequired,
   toastMessenger: propTypes.object.isRequired,
 };

src/sidebar/store/modules/annotations.js

@@ -551,6 +551,7 @@ function savedAnnotations(state) {
  * @prop {typeof clearAnnotations} clearAnnotations
  * @prop {typeof focusAnnotations} focusAnnotations
  * @prop {typeof hideAnnotation} hideAnnotation
+ * @prop {typeof highlightAnnotations} highlightAnnotations
  * @prop {typeof removeAnnotations} removeAnnotations
  * @prop {typeof unhideAnnotation} unhideAnnotation
  * @prop {typeof updateAnchorStatus} updateAnchorStatus

src/tsconfig.json

@@ -25,9 +25,6 @@
     // Files in `src/sidebar/components` that may still have errors.
     // Remove them from this list as they are resolved.
     "sidebar/components/hooks/use-root-thread.js",
-    "sidebar/components/annotation-share-info.js",
-    "sidebar/components/annotation-viewer-content.js",
-    "sidebar/components/annotation.js",
     "sidebar/components/hypothesis-app.js",
     "sidebar/components/share-annotations-panel.js",
     "sidebar/components/sidebar-content-error.js",