Update how selected annotations are styled (and refactor the click event into a separate function)

src/components/WindowSideBarAnnotationsPanel.js

@@ -12,16 +12,36 @@ import ns from '../config/css-ns';
  * WindowSideBarAnnotationsPanel ~
 */
 export class WindowSideBarAnnotationsPanel extends Component {
+  /**
+   * constructor -
+   */
+  constructor(props) {
+    super(props);
+
+    this.handleClick = this.handleClick.bind(this);
+  }
+
+  /**
+   * Handle click event of an annotation.
+  */
+  handleClick(event, annotation) {
+    const {
+      deselectAnnotation, selectAnnotation, selectedAnnotationIds, windowId,
+    } = this.props;
+
+    if (selectedAnnotationIds.includes(annotation.id)) {
+      deselectAnnotation(windowId, annotation.targetId, annotation.id);
+    } else {
+      selectAnnotation(windowId, annotation.targetId, annotation.id);
+    }
+  }
+
   /**
    * Rreturn an array of sanitized annotation data
    */
   sanitizedAnnotations() {
     const {
       annotations,
-      classes,
-      deselectAnnotation,
-      windowId,
-      selectAnnotation,
       selectedAnnotationIds,
     } = this.props;
 
@@ -31,18 +51,8 @@ export class WindowSideBarAnnotationsPanel extends Component {
           annotations.map(annotation => (
             <ListItem
               key={annotation.id}
-              className={
-                selectedAnnotationIds.includes(annotation.id)
-                  ? classes.selectedAnnotation
-                  : null
-              }
-              onClick={() => {
-                if (selectedAnnotationIds.includes(annotation.id)) {
-                  deselectAnnotation(windowId, annotation.targetId, annotation.id);
-                } else {
-                  selectAnnotation(windowId, annotation.targetId, annotation.id);
-                }
-              }}
+              selected={selectedAnnotationIds.includes(annotation.id)}
+              onClick={e => this.handleClick(e, annotation)}
             >
               <Typography variant="body2">
                 <SanitizedHtml ruleSet="iiif" htmlString={annotation.content} />