feat: add project-level error boundary

Closes #47

src/components/ErrorFallback.jsx

@@ -0,0 +1,20 @@
+import PropTypes from 'prop-types';
+import { Alert, Button } from 'reactstrap';
+
+export default function ErrorFallback({ error, resetErrorBoundary }) {
+  return (
+    <Alert color="danger" className="m-3">
+      <h4 className="alert-heading">Error!</h4>
+      <p>Looks like something went wrong.</p>
+      <pre>{error.message}</pre>
+      <Button color="primary" onClick={resetErrorBoundary}>
+        Try Again
+      </Button>
+    </Alert>
+  );
+}
+
+ErrorFallback.propTypes = {
+  error: PropTypes.object.isRequired,
+  resetErrorBoundary: PropTypes.func.isRequired,
+};

src/main.jsx

@@ -1,5 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
+import { ErrorBoundary } from 'react-error-boundary';
+import ErrorFallback from './components/ErrorFallback';
 import './index.css';
 import { setConfigs } from './services/config';
 
@@ -13,7 +15,9 @@ fetch('config.json')
     console.log('rendering app');
     ReactDOM.createRoot(document.getElementById('root')).render(
       <React.StrictMode>
-        <App />
+        <ErrorBoundary FallbackComponent={ErrorFallback} onReset={() => document.location.reload()}>
+          <App />
+        </ErrorBoundary>
       </React.StrictMode>
     );
   });