Add error boundary to the project dashboard list

GitOrigin-RevId: 0f4cc3b4db62efe25ceeff202f305d08ddd73968

services/web/frontend/js/shared/components/generic-error-boundary-fallback.tsx

@@ -0,0 +1,33 @@
+import { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+import Icon from './icon'
+import { Button } from 'react-bootstrap'
+import { useLocation } from '../hooks/use-location'
+import { DefaultMessage } from './default-message'
+
+export const GenericErrorBoundaryFallback: FC = ({ children }) => {
+  const { t } = useTranslation()
+  const { reload: handleClick } = useLocation()
+
+  return (
+    <div className="error-boundary-container">
+      <div className="icon-error-boundary-container">
+        <Icon
+          accessibilityLabel={`${t('generic_something_went_wrong')} ${t(
+            'please_refresh'
+          )}`}
+          type="exclamation-triangle fa-2x"
+          fw
+        />
+      </div>
+      {children || (
+        <div className="error-message-container">
+          <DefaultMessage className="small" style={{ fontWeight: 'bold' }} />
+        </div>
+      )}
+      <Button bsStyle="primary" onClick={handleClick}>
+        {t('refresh')}
+      </Button>
+    </div>
+  )
+}