error boundary and table pagination

src/hoc/ErrorBoundary.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from "react";
+import { Fallback } from "./Fallback";
 
 class ErrorBoundary extends Component {
   state = {
@@ -13,7 +14,7 @@ class ErrorBoundary extends Component {
     const { error } = this.state;
 
     if (error) {
-      return <div>Что-то пошло не так =( {error}</div>;
+      return <Fallback />;
     }
     return this.props.children;
   }

src/hoc/Fallback.jsx

@@ -0,0 +1,20 @@
+import React from "react";
+import logo from "assets/images/logo/ITguild.svg";
+
+import rightArrow from "assets/icons/arrows/arrowRight.svg";
+
+import './fallback.scss'
+
+export const Fallback = () => {
+
+  return (
+    <div className="fallback">
+      <img src={logo} alt="logo" className="logo" />
+      <h1>Произошла непредвиденная ошибка</h1>
+      <a href='/profile'>
+        Вернуться назад
+        <img src={rightArrow} alt="arrow" />
+      </a>
+    </div>
+  );
+};

src/hoc/fallback.scss

@@ -0,0 +1,19 @@
+.fallback {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 100px;
+  gap: 15px;
+
+  img {
+    max-width: 250px;
+  }
+
+  a {
+    display: flex;
+    column-gap: 10px;
+    align-items: center;
+    font-size: 16px;
+    color: black;
+  }
+}