diff --git a/package-lock.json b/package-lock.json
index ca6989745..f09fed614 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "mirador-video",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "mirador-video",
-      "version": "1.0.6",
+      "version": "1.0.8",
       "license": "Apache-2.0",
       "dependencies": {
         "@babel/plugin-proposal-object-rest-spread": "^7.20.7",
@@ -39,6 +39,7 @@
         "react-dnd-html5-backend": "^16.0.0",
         "react-dnd-multi-backend": "^8.0.0",
         "react-dnd-touch-backend": "^16.0.0",
+        "react-error-boundary": "^4.1.2",
         "react-full-screen": "^1.1.1",
         "react-i18next": "^13.0.0 || ^14.0.0 || ^15.0.0",
         "react-image": "^4.0.1",
@@ -15489,6 +15490,18 @@
         "node": ">=6"
       }
     },
+    "node_modules/react-error-boundary": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-4.1.2.tgz",
+      "integrity": "sha512-GQDxZ5Jd+Aq/qUxbCm1UtzmL/s++V7zKgE8yMktJiCQXCCFZnMZh9ng+6/Ne6PjNSXH0L9CjeOEREfRnq6Duag==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5"
+      },
+      "peerDependencies": {
+        "react": ">=16.13.1"
+      }
+    },
     "node_modules/react-full-screen": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/react-full-screen/-/react-full-screen-1.1.1.tgz",
diff --git a/src/components/AnnotationsOverlayVideo.js b/src/components/AnnotationsOverlayVideo.js
index 9d8ccdbc9..836b2a74e 100755
--- a/src/components/AnnotationsOverlayVideo.js
+++ b/src/components/AnnotationsOverlayVideo.js
@@ -11,7 +11,6 @@ import CanvasOverlayVideo from '../lib/CanvasOverlayVideo';
 import CanvasWorld from '../lib/CanvasWorld';
 import CanvasAnnotationDisplay from '../lib/CanvasAnnotationDisplay';
 import { VideosReferences } from '../plugins/VideosReferences';
-import {ORIENTATIONS} from './VideoViewer';
 
 /** AnnotationsOverlayVideo - based on AnnotationsOverlay */
 export class AnnotationsOverlayVideo extends Component {
diff --git a/src/components/CanvasAnnotations.js b/src/components/CanvasAnnotations.js
index e20477c9d..5fb136d8b 100644
--- a/src/components/CanvasAnnotations.js
+++ b/src/components/CanvasAnnotations.js
@@ -1,4 +1,4 @@
-import {useState, useCallback} from 'react';
+import { useState, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import Chip from '@mui/material/Chip';
 import MenuList from '@mui/material/MenuList';
@@ -38,8 +38,9 @@ const StyledFooterAnnotationContainer = styled('div')(({ theme }) => ({
 /**
  * CanvasAnnotations ~
 */
-export function CanvasAnnotations ({
+export function CanvasAnnotations({
   annotations = [],
+  autoScroll = true,
   index,
   label,
   selectedAnnotationId = undefined,
@@ -53,8 +54,7 @@ export function CanvasAnnotations ({
   selectAnnotation,
   windowId,
   hoverAnnotation,
- }) {
-
+}) {
   const [inputSearch, setInputSearch] = useState('');
 
   const handleClick = useCallback((_event, annotation) => {
@@ -73,12 +73,10 @@ export function CanvasAnnotations ({
     hoverAnnotation(windowId, []);
   }, [hoverAnnotation, windowId]);
 
-
   if (annotations.length === 0) return null;
 
   let annotationsFiltered = annotations;
 
-
   if (inputSearch !== undefined && inputSearch !== '') {
     annotationsFiltered = filterAnnotation(annotations, inputSearch);
   }
@@ -86,111 +84,114 @@ export function CanvasAnnotations ({
   // TODO Count filtered or all ?
   const annotationCount = annotations.length;
 
-    return (
-      <>
-        <Typography sx={{ paddingLeft: 2, paddingRight: 1, paddingTop: 2 }} variant="overline">
-          {t('annotationCanvasLabel', { context: `${index + 1}/${totalSize}`, label })}
-        </Typography>
-        <StyledAnnotationContainer>
-          <TextField
-              label={t('searchPlaceholderAnnotation')}
-              onChange={this.handleAnnotationSearch}
-              sx={{
-                width: '100%',
+  return (
+    <>
+      <Typography sx={{ paddingLeft: 2, paddingRight: 1, paddingTop: 2 }} variant="overline">
+        {t('annotationCanvasLabel', { context: `${index + 1}/${totalSize}`, label })}
+      </Typography>
+      <StyledAnnotationContainer>
+        <TextField
+          label={t('searchPlaceholderAnnotation')}
+          onChange={(e) => setInputSearch(e.target.value)}
+          sx={{
+            width: '100%',
+          }}
+          InputProps={{
+            endAdornment: (
+              <div style={{
+                position: 'absolute',
+                right: 0,
               }}
-              InputProps={{
-                endAdornment: (
-                    <div style={{
-                      position: 'absolute',
-                      right: 0,
-                    }}
-                    >
-                      <MiradorMenuButton aria-label={t('searchAnnotationTooltip')} type="submit">
-                        <SearchIcon />
-                      </MiradorMenuButton>
-                    </div>
-                ),
+              >
+                <MiradorMenuButton aria-label={t('searchAnnotationTooltip')} type="submit">
+                  <SearchIcon />
+                </MiradorMenuButton>
+              </div>
+            ),
+          }}
+        />
+      </StyledAnnotationContainer>
+      <MenuList autoFocusItem variant="selectedMenu">
+        {annotationsFiltered.map((annotation) => (
+          <ScrollTo
+            containerRef={containerRef}
+            key={`${annotation.id}-scroll`}
+            offsetTop={96} // offset for the height of the form above
+            scrollTo={selectedAnnotationId === annotation.id}
+            selected={selectedAnnotationId === annotation.id}
+          >
+            <MenuItem
+              component={listContainerComponent}
+              variant="multiline"
+              divider
+              sx={{
+                '&:hover,&:focus': {
+                  backgroundColor: 'action.hover',
+                },
+                backgroundColor: hoveredAnnotationIds.includes(annotation.id) ? 'action.hover' : '',
               }}
-          />
-        </StyledAnnotationContainer>
-        <MenuList autoFocusItem variant="selectedMenu">
-          {annotationsFiltered.map((annotation) => (
-            <ScrollTo
-              containerRef={containerRef}
-              key={`${annotation.id}-scroll`}
-              offsetTop={96} // offset for the height of the form above
-              scrollTo={selectedAnnotationId === annotation.id}
+                            /* ref={containerRef} */ // TODO useful ?
+              key={annotation.id}
+              annotationid={annotation.id}
               selected={selectedAnnotationId === annotation.id}
+              onClick={(e) => handleClick(e, annotation)}
+              onFocus={() => handleAnnotationHover(annotation)}
+              onBlur={handleAnnotationBlur}
+              onMouseEnter={() => handleAnnotationHover(annotation)}
+              onMouseLeave={handleAnnotationBlur}
             >
-              <MenuItem
-                component={listContainerComponent}
-                variant="multiline"
-                divider
-                sx={{
-                  '&:hover,&:focus': {
-                    backgroundColor: 'action.hover',
-                  },
-                  backgroundColor: hoveredAnnotationIds.includes(annotation.id) ? 'action.hover' : '',
-                }}
-               /* ref={containerRef}*/ // TODO useful ?
-                key={annotation.id}
-                annotationid={annotation.id}
-                selected={selectedAnnotationId === annotation.id}
-                onClick={(e) => handleClick(e, annotation)}
-                onFocus={() => handleAnnotationHover(annotation)}
-                onBlur={handleAnnotationBlur}
-                onMouseEnter={() => handleAnnotationHover(annotation)}
-                onMouseLeave={handleAnnotationBlur}
+              <ListItemText
+                primaryTypographyProps={{ variant: 'body2' }}
               >
-                <ListItemText
-                  primaryTypographyProps={{ variant: 'body2' }}
-                >
-                    <SanitizedHtml
-                        ruleSet={htmlSanitizationRuleSet}
-                        htmlString={annotation.content}
-                    />
-                    <div>
-                        {
-                            annotation.tags.map(tag => (
-                                <Chip
-                                    size="small"
-                                    variant="outlined"
-                                    label={tag}
-                                    id={tag}
-                                    sx={theme => ({
-                                        backgroundColor: theme.palette.background.paper,
-                                        marginRight: theme.spacing(0.5),
-                                        marginTop: theme.spacing(1),
-                                    })}
-                                    key={tag.toString()}
-                                />
-                            ))
-                        }
-                        <AnnotationManifestsAccordion
-                            annotation={annotation}
-                            t={t}
-                        />
-                    </div>
-                </ListItemText>
-              </MenuItem>
-            </ScrollTo>
-          ))
-          }
-           {annotationsFiltered.length === 0
-            && (
-                <MenuItem>
-                    <Typography>
+                <SanitizedHtml
+                  ruleSet={htmlSanitizationRuleSet}
+                  htmlString={annotation.content}
+                />
+                <div>
+                  {
+                                        annotation.tags.map(tag => (
+                                          <Chip
+                                            size="small"
+                                            variant="outlined"
+                                            label={tag}
+                                            id={tag}
+                                            sx={theme => ({
+                                              backgroundColor: theme.palette.background.paper,
+                                              marginRight: theme.spacing(0.5),
+                                              marginTop: theme.spacing(1),
+                                            })}
+                                            key={tag.toString()}
+                                          />
+                                        ))
+                                    }
+                  <AnnotationManifestsAccordion
+                    annotation={annotation}
+                    t={t}
+                  />
+                </div>
+              </ListItemText>
+            </MenuItem>
+          </ScrollTo>
+        ))}
+        {annotationsFiltered.length === 0
+                    && (
+                    <MenuItem>
+                      <Typography>
                         {t('noAnnotationFound')}
-                    </Typography>
-                </MenuItem>
-            )}
-        </MenuList>
+                      </Typography>
+                    </MenuItem>
+                    )}
+      </MenuList>
       <StyledFooterAnnotationContainer>
-          <Typography component="p" variant="subtitle2">{t('showingNumAnnotations', { count: annotationCount, number: annotationCount })}</Typography>
+        <Typography component="p" variant="subtitle2">
+          {t('showingNumAnnotations', {
+            count: annotationCount,
+            number: annotationCount,
+          })}
+        </Typography>
       </StyledFooterAnnotationContainer>
-      </>
-    );
-  }
+    </>
+  );
 }
 
 CanvasAnnotations.propTypes = {
@@ -218,12 +219,3 @@ CanvasAnnotations.propTypes = {
   totalSize: PropTypes.number.isRequired,
   windowId: PropTypes.string.isRequired,
 };
-CanvasAnnotations.defaultProps = {
-  annotations: [],
-  autoScroll: true,
-  containerRef: null,
-  hoveredAnnotationIds: [],
-  htmlSanitizationRuleSet: 'iiif',
-  listContainerComponent: 'li',
-  selectedAnnotationId: undefined,
-};
diff --git a/src/containers/WindowSideBarAnnotationsPanel.js b/src/containers/WindowSideBarAnnotationsPanel.js
index 4d1a3ec1f..7089dc73b 100644
--- a/src/containers/WindowSideBarAnnotationsPanel.js
+++ b/src/containers/WindowSideBarAnnotationsPanel.js
@@ -6,7 +6,9 @@ import {
   getVisibleCanvasIds,
   getAnnotationResourcesByMotivation,
 } from '../state/selectors';
-import WindowSideBarAnnotationsPanel from '../components/WindowSideBarAnnotationsPanel';
+import {
+  WindowSideBarAnnotationsPanel
+} from '../components/WindowSideBarAnnotationsPanel';
 
 /**
  * mapStateToProps - to hook up connect